I know you can preload an image into the browser's cache, but can you preload an entire HTML page (images included)?? This would be useful when a user has a lot to read a page and you know the next page they are going to access. You can use this time a inactivity to preload the next page into cache and thus improve overall performance.
A preloading technique I have used with success works as follows:
I have developed a function, called "
preload_document ()," which is useful for implementing this technique. To make it easy for you to cut and paste, I have included it in an editable textbox below. My recommendation to you is that you save the function in a .js file, such as "preload.js," and then reference it externally from each document that uses it.
Obviously, documents which preload other documents need to call the
preload_document () function. Less obvious, however, is the fact that any documents which are preloaded must also call the
preload_document () function. In both cases, the
preload_document () function should only be called from within the
onLoad event handler, as follows:
<body onLoad="preload_next_document ('nextdoc.html');">
For the current document, this guarantees that network bandwidth will not be expended on the next document until the current document is completely loaded. For the next document, this guarantees that the preloader window will not close until after the entire document has been preloaded. (Note: Set the next_doc parameter to null in documents that get preloaded but don't need to preload other documents.)
When the current document finishes loading, it executes the "(current document)" branch of the function, which opens a very small, postage stamp-sized window to load the next document. However, when the new window is created, it appears above the current window, where it can potentially distract the user. Thus, the main window must also call its
focus () method in order to raise itself above the preloader window. This makes it possible for the preloader window to "work behind the scene."
When the document in the preloader window finishes loading, its own
onLoad event fires, causing the "(next document)" branch of
preload_document () to be executed. This closes the preloader window -- but that's OK, since the document it loaded is now stored in the cache.
When the user goes for the next document, it will appear to load instantly, because it is already in the cache.
Feel free to use
May 3, 1997