Welcome to Bucaro TecHelp!

Bucaro TecHelp
Maintain Your Computer and Use it More Effectively
to Design a Web Site and Make Money on the Web

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact RSS News Feeds News Feeds

Holiday Gift Guide
Holiday Gift Guide

Video - Make Your Webpage Load Faster by Prefetching Resources

This video by Shawn Brenneman, Google software engineer on Picasa Web Albums, explains how pre-fetching can speed up the downloading of images on your webpage.

Image pre-fetching is a technique to make the browser load and decode resources early. Image pre-fetching can be used to create smooth image transition effects. You might have noticed that the first time you click on a button, the transition is not smooth. The solution is to make the browser load the image and keep it in cache.

Large image files take longer to download than the HTML on a webpage. The sooner that you make the request for the image file, the sooner the webpage gets downloaded. If you make the request at the begiining of the HTML page, the image and the HTML code will get to the user at about the same time.

You can use the Image() JavaScript object to make the browser pre-fetch the images. An example of the javascript code for creating the image object is shown below.

<script type="text/javascript">

var myImage = new Image();
myImage.src = "imagename.gif";


<img src="imagename.gif" />

Prefetching applies to more than just image files, it also applies to other web page resources like Java Script code files and Style code files. If you make the requests for these resources at the begiining of the HTML page they can all get to the user at about the same time.

RSS Feed RSS Feed

Follow Stephen Bucaro Follow @Stephen Bucaro

Fire HD
[Site User Agreement] [Privacy Policy] [Site map] [Search This Site] [Contact Form]
Copyright©2001-2017 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268