How to Leverage the Browser Caching of Static Assets in WordPress Using htaccess

In WordPress by Fathi Arfaoui0 CommentsLast Updated: September 29th, 2017

We’ve talked many times about the importance of speeding up a website or blog, and make it user-friendly and optimized for search engines crawling. Today, We will talk about a real critical factor when it comes to surfing the web, and it’s the leverage browser caching of static assets.

If you’re not familiar with that term, don’t worry, you will learn how to leverage browsing cache using a simple code on your server.

When a visitor comes to your blog for the first time, the browser will load everything including in your pages, from icons, menus, and others, and when the user opens the second page. The browser re-download all the static assets such as the logo and footer. It’s really an additional step that the browser never needs, it makes things longer and can affect your site loading time.

This is why we use the leverage browser caching of static assets of your WordPress website, and load them locally for all the future browsing. This method will significantly decrease the total number of requests to the servers. And the result will be a fast loading time for your blog.

Luckily, WordPress is one of the platforms that let you easily leverage browsing cache, by adding a simple code to the htaccess file in your website root.
Some plugins like the W3 total cache let you set some of the file’s expiration and help browser caching static files. But, it won’t work as directly through the htaccess file. It’s more powerful and without the need to edit any settings every time you update or delete a plugin.
Add the below code to your htaccess file:

Related Content:  How to Fix the WordPress White Screen of Death (blank page)

## 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 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"

## EXPIRES CACHING ##

You don’t have to edit the code, it’s optimized for the best period to save static files. But, if you want, you can change the number of months, or even, set the duration to a predefined number of days.
If you have optimized your blog images and using a speed webs hosting for WordPress, you will notice a real improvement, in your page loading after inserting the code above.

You can also get the maximum results from your static files in WordPress, by compressing your images first. That can be done with Photoshop before uploading the image. Make sure to have a good quality image, but with a compressed version, and use PNG in general. It will save you some time in page loading PNG images with fewer colors can work well.

The image size is also very important, verify that your image size is not bigger than your page limits. Let’s say for example, that your post’s maximum width is 500 pixels, and your image’s width is 1100 pixels, then your image will appear as 500 pixels, but with a real size of 1100 pixels.

That’s in general, a big space that can make your page to load slowly, and takes more time to navigate the page. So, make things logical and never use a size that you will never use, make your image’s size exactly as it will appear on your post.

Related Content:  How to Secure WordPress Login Page in Simple Steps

Conclusion

This is how you can leverage the browser caching for the WordPress static assets, that will increase your site speed score on Google, Pingdom, and others. But most importantly, you’ll speed up your blog and make the visitor happy. Every second count in today’s site loading time, and if you can increase the speed by 2 sends, that will have a great impact on conversion, time on the site, and of course the sales.

About Fathi Arfaoui

Fathi Arfaoui: Blogger, and the founder and owner of Trustiko.com. He shares Business, Blogging, WordPress, Web Safety, and Blogging tips to build better websites and blogs. Also, he shares online marketing strategies and recommendations.

Leave a Comment