Increase page loading speed – Leverage browser caching – .htaccess

How can I enable Leverage browser caching via .htaccess file?

Leverage browser caching – It is a simple method to reduce the page loading time of a website for regular visitors. This technique is useful to speedup pages for websites which has a high re-visit ratio by users. When a web browser loads a web page, it downloads all web file to load the page properly.

It includes HTML, images, CSS, scripts etc. Most of the pages include the same contents repeatedly. In this way we can really reduce the loading speed to a great extent!

Where I can enable this [Leverage browser caching] feature?

It’s basically an Apache module and this should be enabled by adding specific code to the Apache configuration file. Most of the users have only user level access to the server.

That’s the important of this post. Here I’m listing a code which can be simply  added to the .htaccess file to enable this feature. The .htaccess is located in the public folder of your website.

Here is the code to add:

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

By using the above code, the main static contents such as images, CSS, PDF’s, JS, etc will be cached in web browser in order to produce faster loading time when you visit the site again.

That’s it!

How to disable phpinfo(); in a shared environment/hosting?

The phpinfo() function in php has a lot of uses. Before going to disable the phpinfo function,you must learn the basics of it. Here is the link which helps you to create the phpinfo >> phpinfo() <<

What is phpinfo() function ?

The function phpinfo() displays the current information of PHP, which includes the php extensions and compilations, version, server information and environment (if compiled as a module), the PHP environment, paths, master and local values of configuration options, HTTP headers, and the PHP License etc.

I am using the same code and it’s simply awesome!!

Implement it and feel the change.

Be careful….

You want to be careful when enabling browser caching as if you set the parameters too long on certain files, users might not be getting the fresh version of your website after updates.

Related:

1, http to https redirection using .htaccess file
2, How to disable phpinfo(); in a shared environment/hosting?

Post navigation

Arunlal A

Senior System Developer at Zeta. Linux lover. Traveller. Let's connect! Whether you're a seasoned DevOps pro or just starting your journey, I'm always eager to engage with like-minded individuals. Follow my blog for regular updates, connect on social media, and let's embark on this DevOps adventure together! Happy coding and deploying!

6 thoughts on “Increase page loading speed – Leverage browser caching – .htaccess

  1. Arun,
    We will implement your techniques from today to improve our website speed. I’m sure it will work.Thanks

  2. Also a good one is :

    #leverage browser caching
    ## EXPIRES CACHING ##

    ExpiresActive On
    ExpiresDefault “access plus 1 week”
    ExpiresByType image/jpg “access plus 1 year”
    ExpiresByType image/jpeg “access plus 1 year”
    ExpiresByType image/gif “access plus 1 year”
    ExpiresByType image/png “access plus 1 year”
    ExpiresByType image/svg+xml “access plus 1 month”
    ExpiresByType text/css “access plus 1 month”
    ExpiresByType text/html “access plus 1 minute”
    ExpiresByType text/plain “access plus 1 month”
    ExpiresByType text/x-component “access plus 1 month”
    ExpiresByType text/javascript “access plus 1 month”
    ExpiresByType text/x-javascript “access plus 1 month”
    ExpiresByType application/pdf “access plus 1 month
    ExpiresByType application/javascript “access plus 1 months”
    ExpiresByType application/x-javascript “access plus 1 months”
    ExpiresByType application/x-shockwave-flash “access plus 1 month”
    ExpiresByType image/x-icon “access plus 1 year”
    ExpiresByType application/json “access plus 0 seconds”
    ExpiresByType application/ld+json “access plus 0 seconds”
    ExpiresByType application/xml “access plus 0 seconds”
    ExpiresByType text/xml “access plus 0 seconds”
    ExpiresByType application/x-web-app-manifest+json “access plus 0 seconds”
    ExpiresByType text/cache-manifest “access plus 0 seconds”
    ExpiresByType audio/ogg “access plus 1 month”
    ExpiresByType video/mp4 “access plus 1 month”
    ExpiresByType video/ogg “access plus 1 month”
    ExpiresByType video/webm “access plus 1 month”
    ExpiresByType application/atom+xml “access plus 1 hour”
    ExpiresByType application/rss+xml “access plus 1 hour”
    ExpiresByType application/font-woff “access plus 1 month”
    ExpiresByType application/vnd.ms-fontobject “access plus 1 month”
    ExpiresByType application/x-font-ttf “access plus 1 month”
    ExpiresByType font/opentype “access plus 1 month”

    ## EXPIRES CACHING ##

  3. Cool stuff….if you don’t mind please break the codes and just explain what each code done while accessing a website by a user.

    1. Simply saying the users to keep the specified files for specified days…
      For example,

      ExpiresByType image/jpg "access 1 year"
      

      Remember jpg type images for one years. We don’t change the images at times, so it will help to increase the page load speed.
      User will get a better browsing experience..

Leave a Reply

Your email address will not be published. Required fields are marked *