Contact Number

+919501010103

Email Address

contact@oxosolutions.com

Social Icons
OXO Solutions® Logo for Website
Empowering small to large businesses since 2008

Fulfilling all your IT needs at single stop
CIN: U74999PB2016PTC045616​GSTIN: ​​03AACCO3599B1ZO

  • About
    • Mission
    • Vision
    • Our Branding
  • Solutions
  • Services
  • Products
  • Research
    • Web
    • Website Speed Optimization
    • Progressive Web Applications
    • Big Data
    • Artificial Intelligence
    • Internet of Things
    • Web Application Security
  • Portfolio
    • E-Commerce
    • Logo Design
    • Web Design
    • Web Development
    • SEO
    • Software Development
    • CMS Customization
  • CSR
  • Resources
    • Frequently Asked Questions
  • Happenings
  • Events
  • Support
  • Career
    • Current Openings
    • Apply Online
    • Internship
    • Life at OXO
  • Blog
  • Partners
  • Contact

Fix Leverage Browser Cache for Images, CSS and JS

Fix Leverage Browser Cache for Images, CSS and JS--oxo-solution-digital-marketing-sompany

Whenever the visitor’s browser loads the web page, it has to download all the files (HTML, CSS, Javascript and images) to display the content on the page. This leads to two types of issues:

  • Firstly, files may be of a smaller size or large size but big files will obviously take longer to download and particularly on the slower internet connection.
  • Secondly, there will be a separate request to server for each file. As the number of requests increases it has to do more work and thus leads to a decrease in the speed of the page load time.

Now, the question arises: what role does the browser cache plays? 

Browser cache saves some of the files when visitor  first time open the website. This helps in reducing the load time when the visitor moves to another page or revisit the site again. In first attempt the time taken by the visitor will remain the same but will reduce in another attempt and thus helps in improving the site performance. 

Leveraging browser cache means to edit your HTTP headers to set an expiry time for certain type of files. 

How to fix the leveraging browser cache?

Apache

Access the file .htaccess file in the root of your domain. In this file set the cache parameters to tell the user about the type of files you want to cache.  As per the types of files, you can set the expiry time for each file. 

## 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 application/pdf "access 1 month"

ExpiresByType application/javascript "access 1 month"

ExpiresByType application/x-javascript "access 1 month"

ExpiresByType application/x-shockwave-flash "access 1 month"

ExpiresByType image/x-icon "access 1 year"

ExpiresDefault "access 2 days"

</IfModule>

## EXPIRES CACHING ##

Leveraging browser cache using Nginx

Add the below code to the snippet of your server block.

location ~* \.(jpg|jpeg|gif|png)$ {

    expires 365d;

}

location ~* \.(pdf|css|html|js|swf)$ {

    expires 30d;

}

Add Cache-Control Headers for Nginx 

location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {

expires 90d;

add_header Cache-Control "public, no-transform";

}


You may also like to read:- Why is Specifying Image Dimensions Important?


Leveraging browser cache WordPress using Plugins

A plugin can also be installed to obtain the same functionality. A plugin will not only handle all the settings of leverage browser cache, but it will also perform a number of other caching optimizations, such as creating temporary copies (file cache), Memcache, database optimization, and other optimizations which make your site faster. 
The plugins that can be preferred are WPRocket, WP Fastest Cache, and W3 Total Cache and premium caching plugins.

Be careful

  • Set the expiry date of a minimum of one month.
  • Do not set the date for more than a year in advance.
  • If you set the parameters too long, the user may not get the fresh content.

Conclusion

This article explained the ways in which you can leverage browser cache using apache, nginx or wordpress plugins. You have to make sure that website speed testing tools should not show this as an error in order to gain improved website speed. 

In case you feel this is beyond your capabilities you can contact us to leave the stuff in the hands of the PRO’s. 

Post navigation

Previous
Next

Leave a Reply Cancel reply

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

You may also Like

  • Saikhom Mirabai Chanu wins first medal for India at Tokyo 2020 Olympics
  • Avoid an Excessive DOM Size: How to Fix this Warning?
  • 14 Steps Guide to Create an Effective SEO Strategy In 2020
  • The Top 25 Do’s and Don’ts of SEO You Need to Know
  • What Are Backlinks in SEO and What Are The Advantages of Backlinks
  • Google Changed Gmail Logo: Here’s What Changed Made So Far?
  • What is Social Media Marketing, and Why Social Media is Important for Business?
  • Combine Images Using CSS Sprites
  • Why Website Speed is Important? How to Optimize Website for Fast Speed?
  • How to Do Keyword Research for SEO

Share on social media

  • Facebook
  • Google Plus
  • LinkedIn
  • twitter
Google Workspace Referral Promo Code
Follow Us

Quick Links

  • Home
  • About
  • Research
  • CSR
  • Resources
  • Happenings
  • Support
  • Career
  • Blog
  • Partners
  • Payment Methods
  • Contact

Services

  • Website Designing
  • Web Development
  • Software Development
  • Ecommerce Development
  • Digital Marketing
  • CMS Customization
  • Search Engine Optimization
  • Logo Design
  • Graphics Design
  • Infrastructure as a Service
  • Workforce as a Service

Solutions

  • Healthcare Solutions
  • Corporate Branding
  • Education Solutions
  • Project Consultancy
  • Digital Marketing
  • Research & Analytics

Products

  • Human Resource Management
  • Customers Support
  • FB Auto
  • Live chat
  • Enterprise Resource Planning

Portfolio

  • E-commerce
  • Logo Design
  • Web Design
  • Web Development
  • SEO
  • Software Development
  • CMS Customization

©2023 OXO Solutions®. All rights reserved.

Copyright Right
  • Privacy Policy
  • Terms and Conditions