Browser caching is the kind that lives on the visitor’s own computer: if the logo, the CSS and the JavaScript arrive with an instruction saying “keep this for a while”, on the next visits the browser does not ask for them again. You give that instruction with HTTP headers, and on a hosting account you do it in the .htaccess file at the root of the site. The server runs LiteSpeed, which reads these rules the Apache way.
First: is something already doing this for you?
If the site is WordPress and the LiteSpeed Cache plugin is active with “Browser Cache” switched on, the plugin already writes these rules into .htaccess. Adding yours on top only duplicates them. See the first LiteSpeed Cache settings. The rest of this article is for sites without that plugin: a hand-built PHP site, a static site, or any application.
How to add the rules
| 1 |
Copy the current .htaccess first. In cPanel’s File Manager, turn on “Show hidden files”, duplicate the file and give the copy another name. A mistake in this file takes the site down.
|
|
| 2 |
Open the .htaccess at the root of the site (the domain’s folder) and add the block below outside any part marked “# BEGIN” and “# END”: those parts are managed by plugins and get rewritten.<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/webp "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType text/css "access plus 1 week"
ExpiresByType text/javascript "access plus 1 week"
ExpiresByType application/javascript "access plus 1 week"
ExpiresByType font/woff2 "access plus 1 month"
</IfModule>
|
|
| 3 |
Save and open the site. If a 500 error appears, it is a syntax error: put the copy back. The durations above are examples: the choice is yours, and depends on how often each kind of file changes.
|
|
| 4 |
Check the headers. In the browser, F12, Network tab, reload the page, click an image and look for cache-control or expires in the response headers. Or, in a terminal: curl -I https://asuaempresa.ao/logo.png (using the address of one of your own files).
|
|
| Kind of file |
Changes often? |
What duration makes sense |
| Images and logo |
Rarely. |
Long. |
| Fonts |
Almost never. |
Long. |
| CSS and JavaScript |
With every update to the site. |
Medium, if the names or version numbers change when the file does. |
| HTML pages and application responses |
Yes. |
Put no duration here. These pages are handled by page caching, not browser caching. |
|
A long duration has a price: the visitor keeps the old version. If you change a CSS file and keep the same name, anyone who already has it stored keeps seeing the old one until the duration runs out. The fix is to change the name or add a version number to the address, as in style.css?v=2. WordPress themes usually do this by themselves; on a hand-built site, it is up to you. When it is your own browser showing the old copy, see clearing the cache.
|
|
Prefer Cache-Control to Expires? With the headers module, the rule is Header set Cache-Control "public, max-age=2592000" inside a FilesMatch for the extensions you want, and the value is in seconds. The file types the server knows are in MIME types and custom error pages.
|
|
Edited the file and the site now shows a 500 error? Tell us the domain and the time you made the change, and we will help you put it back.
Open a support ticket
|
RECOMMENDED PRODUCT Web hosting with cPanel Domain and SSL included, daily backups and the panel you already know. from $6.59/mo (3-year plan, with coupon) See plans |
Português
English
