Leverage Browser Caching

When a webpage loads on your screen there are a lot of little pieces that have come together to create what you’re seeing. Your logo, other images, style sheets, javascript files are among some of the external resources a webpage might use to render itself on your screen. Generally, each time you load the page, every one of those resources has to be requested again, and served up to render the page.

Enter Leveraging Your Browser Caching.

A cache is a set of stored resources for your webpage/website. It holds those elements (external resources) in the browser so that the next time the page needs to be rendered a separate request does not need to be initiated, the browser already has those elements handy to render up the page for you. This makes pages much faster and increases the quality of the user experience … particularly on mobile. There are a number of different ways to leverage browser caching. Most common is through use of an .htaccess file. This file tells browsers what elements and resources to cache, and for how long. It may look something like the following.

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg “access 1 year”
ExpiresByType image/jpeg “access 1 year”
ExpiresByType image/gif “access 1 year”
ExpiresByType image/png “access 1 year”
ExpiresByType text/css “access 1 month”
ExpiresByType text/html “access 1 month”
ExpiresByType application/pdf “access 1 month”
ExpiresByType text/x-javascript “access 1 month”
ExpiresByType application/x-shockwave-flash “access 1 month”
ExpiresByType image/x-icon “access 1 year”
ExpiresDefault “access 1 month”
</IfModule>
## EXPIRES CACHING ##
 

This would tell the browser to hold on to some elements (images) for a year and other files for a period of 1 month. It is important to note that when caching your external resources you will want to clear that cache when you make any changes to the website. If you don’t, the changes might not be served up when the page is called until the cache expires. For instance, changing a jpeg image on the site with a new one won’t redner for anyone that has a browser recognizing that jpegs are cached for 1 year. After that year, they’ll see the image change.

More Web Design Blog Content

A Quick Way To Kill Your Facebook Marketing

Facebook is a powerful tool. With millions upon millions of reachable users it is the social media powerhouse. Sharing content is incredibly easy and businesses can so easily engage potential customers that many businesses are putting it to work for them. There are, in fact, many ways to

Review: PHP Live Chat ★★★★

4 Stars for this chat system from GNTStudio. It’s quite useful and very easy to install. We’re actually planning to use it on our own website we like it so much. They lose one star because we had to modify a bit too much to get things to

Gatorland Kubota Has A New Website

A great new site for a great company with new ownership. Gatorland Kubota sells and services all kinds of farm and lawn equipment. A family owned and operated business there is no doubt that they want the best for their customers. After all, they chose livewire didn’t they?

Don’t Get Smacked by Copyright Infringemnt

Developers do it all the time – they need an image for a website and head on over to Google images, put a keyword in and voila! Free pictures for everyone! Not so fast. Many of these images are protected under copyright law and if you get caught,

Project Gutenburg

Every heard of it? If not, make sure to check it out. They have tons of books online, free for anybody. Our favorite? A Connecticut Yankee in King Arthur’s Court by Mark Twain http://www.gutenberg.org/ebooks/86 Got a smartphone? Just download a free e-reader and you’re all set. Download the

Conversion Optimization

So many people have a myopic outlook on SEO and SEM. They tend to focus on optimization as strawberry field, where you can just pick a little fruit from here or there and fill up your basket. Not so fast. It’s not just about having a full basket,