Geek Answers Handbook

How to preload an ENTRE web page

How can you preload an entire web page using JavaScript so that I can cache this page in a users browser?

I know how to preload images using JS, but I would like to preload the whole page.

Use case. On my website I have a google maps page with a lot of other content (images, css, JS), and it takes a lot of time (about 10 seconds) to download from a non-cached browser.

This is a subpage of my home page, and users usually visit this page. So what I want to do is preload the entire page with all the loaded content (images, JS) as much as possible so that it is cached in the users browser, so when they come to this page, it loads much faster. Loading a page from a cached browser reduces the time from 10 seconds to 2 seconds.

Thanks in advance for your help.

+4
source share
2 answers

Create an invisible or very small <iframe src="second_page.html"> on the main page.

+8
source

Perhaps there are some misconceptions. Separating real content from fancy materials can help significantly reduce the cost of loading. You can choose solutions that delay the immediate loading of things when loading a document. (For example, I have a demo version of the PlayMaps concept, which displays only a static image of Google Maps until the user clicks on it, and downloads only the interactive version after that.)

CSS and JS files should be compressed and minimized, and try to fully download all the content.

In addition, you can analyze the performance of your site with Firebug and YSlow to get bottlenecks.

+2
source

More articles:


All Articles