Speed Up Site Load Times Using Caching

Use client side browser caching to speed up your site or blog.

Ok, not that kind of cash! "cache" mmmkay?

So there are several tutorials I will be writing that have to do with optimizing your website or blog. The first one we will cover is simple and easy. Hopefully you have easy access to your “.htaccess” file so we can modify it. Depending on your web host you might be accessing it via FTP, or SSH (secure shell). I highly recommend making a backup of your .htaccess file before editing it so if something goes dangerously  wrong you can put it back to the way it was.

We are going to leverage the client’s web browser to cache the files from our website so once they load the page and surf to other pages the load times will be much faster than the first visit to the first page. Often times there are graphics, fonts, video and other files that load on every page. Well, why not let the client cache them and load from memory?

Your default .htaccess file probably looks something like this:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

Ok, all we want to do is add some lines after all that so it looks like this:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

## EXPIRES CACHING ##
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 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 2 days"
## EXPIRES CACHING ##

If you are using a web host that uses cPanel, you can also access your .htaccess file via the File Manager. When the popup box appears, click on the Web Root option and make sure that the “Show hidden files” option is checked.

By using this code, our main static files (images, CSS, PDF’s, JS, etc.) will be cached in order to faster loading times in the future.

As always, if you have any questions or comments, please post them below and I will do my best to help you.

Related Posts:
[related_posts]

Related posts:

1. Custom Login URL For WordPress Admin
2. Load content using AJAX
3. WordCamp Atlanta 2011 Is Near!