Author: Tyler Odean, iGoogle Product Manager
In this article we'd like to highlight a few basic steps that gadget developers can take to improve the performance of their gadgets in iGoogle and on other OpenSocial enabled containers throughout the web. Gadgets that load quickly and are responsive to user input are more popular and more likely to remain installed on a user page, and a compact properly-cached gadget reduces hosting and bandwidth costs. With a few simple steps you can accelerate your gadget's performance.
Use tools to profile your gadget and pinpoint bottlenecks
The best practices for designing a gadget are the same as the best practices for maintaining any web property. You can use plugins and tools such as Page Speed and Firebug to profile the requests that your gadget is making to identify bottlenecks. For a list of tools that can help you improve the performance of your gadget, please check the downloads page. We recommend loading containers as a baseline and then compare the latency of the empty container with the latency of the container with the gadget installed in a variety of browsers and cache states. For more information on how to use profilers to diagnose your gadget, check out the latency measurement tutorial.
Use caching for your dynamic content
Most containers offer support for the Cache-Control HTTP header. You have server-side control over how your resources are cached, so be sure to set your headers appropriately for maximum benefit.
The Cache-Control header is best described in the HTTP/1.1 specification but there are some simpler descriptions available as well. If you're not sure about the cache headers your server is currently sending, you can try some publicly available tools to examine the cache headers on your files and see if they need to be tweaked.
Be aware that the Cache-Control header will be examined for all content coming from your server, including XML application specs, responses from makeRequest (both prefetched and not), and proxied images. Be sure to set caching headers for all of this content! You can also take advantage of the container to ensure that your content is appropriately cached by directing requests through
gadgets.io.getProxyURL( OrigURL ). Proper caching will not only reduce end-user latency, it will also help minimize bandwidth costs associated with hosting your gadget. For more information on using
gadgets.io.getProxyURL you can check out the OpenSocial Latency Combat Field Manual.
Reduce the number of fetches
The HTTP/1.1 specification states:
Clients that use persistent connections SHOULD limit the number of simultaneous connections that they maintain to a given server. A single-user client SHOULD NOT maintain more than 2 connections with any server or proxy.
Other best practices
- Turn on gzip for any content you deliver. Good things come in small packages.
- Run the Gadget Checker. The Gadget Checker gadget checks your gadget code for many common errors, some of which can definitely affect latency.
- Split CSS and image files over 2-4 servers. Browsers limit the number of concurrent connections to any one server. If requests cannot be batched, they should be distributed over several servers to avoid this bottleneck.