top button
Flag Notify
    Connect to us
      Site Registration

Site Registration

How to enable browser caching for a website?

+1 vote
576 views
How to enable browser caching for a website?
posted Dec 29, 2015 by anonymous

Share this question
Facebook Share Button Twitter Share Button LinkedIn Share Button

1 Answer

+1 vote

browser caching

Every time a browser loads a webpage it has to download all the web files to properly display the page. This includes all the HTML, CSS, javascript and images.

Some pages might only consist of a few files and be small in size - maybe a couple of kilobytes. For others however there may be a lot of files, and these may add up to be several megabytes large. Twitter.com for example is 2mb+.

The issue is two fold.

These large files take longer to load and can be especially painful if you're on a slow internet connection (or a mobile device).
Each file makes a separate request to the server. The more requests your server gets simultaneously the more work it needs to do, only further reducing your page speed.
Browser caching can help by storing some of these files locally in the user's browser. Their first visit to your site will take the same time to load, however when that user revisits your website, refreshes the page, or even moves to a different page of your site, they already have some of the files they need locally.

This means the amount of data the user's browser has to download is less, and fewer requests need to be made to your server. The result? Decreased page load times.

How does it work?

Browser caching works by marking certain pages, or parts of pages, as being needed to be updated at different intervals. Your logo on your website, for instance, is unlikely to change from day to day. By caching this logo image, we can tell the user's browser to only download this image once a week. Every visit that user makes within a week would not require another download of the logo image.

By the webserver telling the browser to store these files and not download them when you come back saves your users time and your web server bandwidth.

Why is it important?

The main reason why browser caching is important is because it reduces the load on your web server, which ultimately reducing the load time for your users.

How to leverage browser caching

To enable browser caching you need to edit your HTTP headers to set expiry dates on certain types of files.

Find your .htaccess file in the root of your domain, this file is a hidden file but should show up in FTP clients like FileZilla or CORE. You can edit the htaccess file with notepad or any form of basic text editor.

In this file we will set our caching parameters to tell the browser what types of files to cache.

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
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 text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"
</IfModule>
## EXPIRES CACHING ##

Depending on your websites files you can set different expiry dates. If certain types of files are updated more frequently, you would set an earlier expiry date on the (ie. css files)

answer Dec 30, 2015 by Manikandan J
Let us make QueryHome code public
Following is the .htaccess file for enabling the caching (self explanatory)
## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
<FilesMatch "\.(ico|jpg|jpeg|png|gif)$">
ExpiresDefault "access plus 2 weeks"
</FilesMatch>
<FilesMatch "\.(js|css|swf)$">
ExpiresDefault "access plus 2 weeks"
</FilesMatch>
</IfModule>
## EXPIRES CACHING ##
Similar Questions
+1 vote

I have a recurring issue, that tomcat caches my jsf webapp pages in a strange manner. Sometimes for multiple days/hours, one
or two explicit pages or the whole webapp is loading very slowly.

My setup is a locally used tomcat 8.0.28 for debugging in Eclipse and a local database. The behavior persists also after browser cache clearing and with different browsers.

Does anyone else have seen this behavior before? Do i miss a specific parameter?

+3 votes

Want to build the push notification for the normal browser but it seems it require to be a https website. Is it mandatory for the website to be a https website for having browser based push notification service i.e. GCM/FCM?
Any pointer would be helpful?

+2 votes

I want to build a A URL Shortener service in my PHP based Website without use of any thirdparty tool. Any clue or opensource would be a great help?

...