Preload Components
How Preloading Components improves Web site download performance
Preload may look like the opposite of post-load, but it actually has a different goal. By preloading components you can take advantage of the time the browser is idle and request components (like images, styles and scripts) you'll need in the future. This way when the user visits the next page, you could have most of the components already in the cache and your page will load much faster for the user. There are actually several types of preloading: - Unconditional preload - as soon as onload fires, you go ahead and fetch some extra components. Check google.com for an example of how a sprite image is requested onload. This sprite image is not needed on the google.com homepage, but it is needed on the consecutive search result page. - Conditional preload - based on a user action you make an educated guess where the user is headed next and preload accordingly. On search.yahoo.com you can see how some extra components are requested after you start typing in the input box. - Anticipated preload - preload in advance before launching a redesign. It often happens after a redesign that you hear: "The new site is cool, but it's slower than before". Part of the problem could be that the users were visiting your old site with a full cache, but the new one is always an empty cache experience. You can mitigate this side effect by preloading some components before you even launched the redesign. Your old site can use the time the browser is idle and request images and scripts that will be used by the new site.
Other Topics
Overview Web Site performance Improvement Minimize HTTP Requests Use a Content Delivery Network Add an Expires or a Cache-Control Header Gzip Components Put Stylesheets at the Top Put Scripts at the Bottom Avoid CSS Expressions Make JavaScript and CSS External Reduce DNS Lookups Minify JavaScript and CSS Avoid Redirects. Remove Duplicate Scripts Configure ETags Make Ajax Cacheable Flush the Buffer Early Use GET for AJAX Requests Post-load Components Preload Components Reduce DOM Elements Split Components Across Domains Minimize the Number of iframes No 404s Reduce Cookie Size Use Cookie-free Domains for Components Minimize DOM Access Develop Smart Event Handlers Choose over @import Avoid Filters Optimize Images Optimize CSS Sprites Don't Scale Images in HTML Make favicon.ico Small and Cacheable Keep Components under 25K Pack Components into a Multipart Document Avoid Empty Image src