Improving web page load speed through better caching
If you have a large web site, or page with many frequently reloading graphics, below are two methods to reduce loading speeds significantly.
- Managing Expiring Content (good for a graphic heavy web site)
- Enabling on-the-fly server compression (good for a text heavy web site)
The Secret: Managing Expiring Content
Using mod_expire to expire content is the simplest, least impactful way to increase page loading speeds for returning visitors. The concept is simple enough. Basically all you are doing is telling the browser to save content on the visiting computer for "x" number of hours, days, or minutes.
Below is the snippet to add to your .htaccess file, located in your public_html directory. Your .htaccess file is just a text file, so feel free to edit it with any text editor. If an error occurs just remove the text and revert to the previous copy.
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault A300
ExpiresByType application/pdf A300
ExpiresByType application/x-javascript A3600
ExpiresByType application/x-shockwave-flash A604800
ExpiresByType audio/mpeg A604800
ExpiresByType image/gif A604800
ExpiresByType image/jpeg A604800
ExpiresByType image/png A604800
ExpiresByType image/x-icon A2592000
ExpiresByType text/css A3600
ExpiresByType text/html A300
ExpiresByType text/plain A300
ExpiresByType video/mpeg A2592000
ExpiresByType video/quicktime A2592000
ExpiresByType video/x-flv A2592000
</IfModule>
Wow, this looks complicated doesn't it?
Well, it's pretty simple once you get the gist of what the numbers mean.
Let's start with the line:
ExpiresDefault A300
All this is saying is that any file type not included in the list below (by default), will expire it in 300 seconds (5 minutes).
That "A" in front of the number of seconds is required. Why?
The guy who wrote the software thought it was important is my best guess...
By expiring your content in 300 seconds you are telling the visiting web browser to cache the page for five minutes. After five minutes, the visiting browser will refresh to whatever is on the page. You might need this for a quickly updating web page or forum.
The bigger the number the longer you are telling the visiting browser to save your content; effectively reducing loading speed since the files are cached nicely on the visitors computer.
Convert days to seconds?
Use http://goggle.com to quickly convert days, hours or minutes into seconds by typing this into Google's search box:
"convert 300 seconds to minutes" or, "convert 24 hours to seconds" etc.
Quick Guide to seconds:
300 = 5 minutes
3600 = 60 minutes
604800 = 7 days
2592000 = 30 days
So, now that you know to force the expiration of content, feel free to change the number of seconds using the Google calculator above.
Ok, so what's the big picture here?
Well, let's say you have a video ( x-flv) on your web site. It's 1mb in size. Without forcing the visiting browser to "save" or cache the file for thirty days for example (as above), each time the person views the video it may re-download each time the page is loaded. Multiply this by 100 visitors a day and you may find yourself with an excess bandwidth bill end of month, or unnecessarily slow video load speeds for all viewers visiting your web site.
_____________________________________
Enabling on-the-fly server compression
An alternative to the method described above involves using server side compression.
Simply add this to your .htaccess file:
AddOutputFilterByType DEFLATE text/html text/plain text/xml
Then test it here: http://www.gidnetwork.com/tools/gzip-test.php
Reference:
- http://betterexplained.com/articles/speed-up-your-javascript-load-time/
