Htaccess Leverage browser caching
Using .htaccess file we can enable browser caching for statics files to improve website performance.
Implementation of browser caching is one of the most neglected (or underrated) things and most developers do not implement this. However, it is one of the most important points to optimize the website for speed.
While analysing a website on GTmetrix, most website score shows F (0) because browsing cache is not set. Similarly, and Google PageSpeed Insights shows warnings to “Serve static assets with an efficient cache policy”.
You can easily enhance your website performance and GTmetrix score by adding small .htaccess code to enable browser cache.
What is browser caching?
If a webpage has a big file or a large number of files, the browser may take some time to download all resources. That is why the website loads slowly for users.
Browser cache is a feature in which browsers can store some of the web page files locally on the user’s machine.
How does Browser Cache work?
Using browser cache, browsers store some static files temporarily when a user visits for the first time on your site. When he visits the same page (or even another page with the same files), the browser loads files from the cache quickly. Therefore, there is no need to download those files from the server and it improves website loading speed.
Enable Cache headers using Htaccess:
Important Points about Browser Caching:
- Set static content (CSS, Docs, video, fonts etc.) cache for 1 year
- It is not recommended to set cache for more than 1 year
- Static resources that may change frequently, may have a cache for 1 week or 1 month.
How to force new static files?
Some framework and CMS append versions with static resources path as a query string to prevent loading old cached files if a new version is available.
For example, WordPress allows us to set a CSS path like “https://website.com/wp-content/themes/twentytwenty/style.css?ver=5.2.7” where each new theme version creates a different URL. That way if a new version of the WordPress theme made changes in CSS files, new ones will be loaded.
|Exercises & Assignments|
|No Content Found.|
|Interview Questions & Answers|
|No Content Found.|