Leverage browser caching tutorial and their implementation

Several times we see that the website has lots of images used on page like banner image, footer image, header image , button image and so on . So each time when the pages start loading on the website then all image gets loaded each time wheneven page gets refresh.

 

In Short Leverage browser caching has below advantage

* Enable Leverage browser caching through htaccess

* Website optimization tips with Leverage browser caching

* Reduce page load time with Leverage browser caching

Leverage Browser caching gives the idea that we can specify browser caching for such images that are static i.e, not getting changed each time. We can specify caching expiry time for such images

Browser caching through htaccess

ExpiresActive On

# Set up caching on media files for 1 year (forever?)
<FilesMatch ".(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$">
ExpiresDefault A29030400
Header append Cache-Control "public"
</FilesMatch>

# Set up caching on media files for 1 week
<FilesMatch ".(gif|jpg|jpeg|png|swf)$">
ExpiresDefault A604800
Header append Cache-Control "public"
</FilesMatch>

# Set up 2 Hour caching on commonly updated files
<FilesMatch ".(xml|txt|html|js|css)$">
ExpiresDefault A604800
Header append Cache-Control "proxy-revalidate"
</FilesMatch>

# Force no caching for dynamic files
<FilesMatch ".(php|cgi|pl|htm)$">
ExpiresActive Off
Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform"
Header set Pragma "no-cache"
</FilesMatch>


 

 

 

Related posts:

The following two tabs change content below.

Chandra Shekhar

GCP Architect
Chandra Shekhar Pandey is Google certified Cloud engineer, I am Magento2 Trained developer. Having huge experience in designing cloud solution. I have around 12 years of experience with world enterprise IT companies and fortune 500 clients. During my architecture design I am always caring about high availability, fast performance and resilient system. From the programmer background I have huge experience in LAMP stack as well. Throughout my carrier I have worked on Retail, E-Learning, Video... Read More about Chandra Shekhar

Latest posts by Chandra Shekhar (see all)