I have a task to fix existing site's problem that nothing is being cached (except for browser session). When closing session and opening browser again, page loads a lot of images, JS and CSS again. As I have ~60 items every time, there is a big load problem.
Looking at Chrome console, Audit shows The following resources are missing a cache expiration...
And in Network item in "Response Headers" doesn't even show "cache-control" line.
I have set info in .htaccess
file and made sure mod_expires
is active:
<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 text/html "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 1 month"
</IfModule>
I added Cache-control
meta-tag in html head that is also showing in page's code source so it is compiled.
<meta http-equiv="Cache-control" content="public" content="max-age=604800">
And I'd like to add that it most likely isn't a server issue as production page's host has set it to a usual default. (And I don't have access to that server anyways)
I'd be super delighted, if someone could give me some pointers of what I am missing or haven't checked or simply don't understand.
Added main.css headers
You can set the headers through php since this is a php site.
<?php
header("Cache-Control: max-age=2592000"); //30days (60sec * 60min * 24hours * 30days)
?>
Also you can use the FilesMatch like this in your .htaccess
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=31536000, public"
</FilesMatch>
Well, although stupid (as I expected), but I didn't read about it anywhere and just forget about the need of it.
It turned out all those things changed (as I said everything was activated on server, access files etc). And the problem was that I didn't clear the cache after changing caching info. Now after three days I started working on some CSS, needed to reset the cache and boom - all the new headers are active for all the items.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With