I am having problems with my leverage browser caching. It seems that my resources are not fetched from cache and as you can see on the image below some of them are duplicating. I have these meta tag:
<meta http-equiv="Cache-Control" content="private, max-age=216000">
Also I got this on my .htaccess:
<IfModule mod_headers.c>
# Set the cache-control max-age
<FilesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=172800, public"
</FilesMatch>
# 2 DAYS
<FilesMatch ".(xml|txt)$">
Header set Cache-Control "max-age=172800, public, must-revalidate"
</FilesMatch>
# 4 HOURS
<FilesMatch ".(html|htm)$">
Header set Cache-Control "max-age=14400, must-revalidate"
</FilesMatch>
# Turn off the ETags
Header unset ETag
FileETag None
# Turn off the Last Modified header except for html docs
<FilesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|js|css)$">
Header unset Last-Modified
</FilesMatch>
Thanks
Ok, as I see from your screenshot, you haven't set any caching headers. Even though you said that you did, I can't see them on screenshot.
Here is an explanation of how caching headers work if you need it, just in case: Cache-Control headers, max-age defined but back button always deliver web cache data
To make caching more efficient, you can load common libraries from public CDNs. For example you can load JQuery from their official CDN: look here
Related
I am new to using .htaccess file. I have image files; a.jpeg & several other .jpeg files in the same folder. What I want the client to do is cache a.jpeg but not the rest of .jpeg files.
Here's what my .htaccess file looks like:
#exception
<Files a.jpeg>
Header set Cache-Control "max-age=604800, public"
</Files>
# NEVER CACHE - rest of .jpegs
<FilesMatch "\.(jpg|jpeg)$">
Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate"
</FilesMatch>
The problem is that a.jpeg is not being cached like all other .jpegs. Kindly help.
The webiste that I am using to test my cached and non-cached files is this : https://www.giftofspeed.com/cache-checker/
I just came to know that the <FilesMatch ""> expects a regular expression to search for a file hence the regex : "\b^(?!a)\w*\.jpg\b" inside the FilesMatch tag worked.
Here's the complete .htaccess file :
# NEVER CACHE - rest of .jpegs
<FilesMatch "\b^(?!a.jpg)\w*\.jpg\b">
Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate"
</FilesMatch>
After trying to find the answer, I still cannot figure it out.
I have my domain www.bragdeal.com
I created a subdomain static.bragdeal.com and pointed it to the folder 'static' in the root
I placed all of my images in bragdeal.com/static/ folder
When I ran gtmetrix, it tells me to Use cookie-free domains
On my website, I point to the images like this:
<img src="static/test.jpg">
In my htaccess I have:
# 1 WEEK
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
# 1 WEEK
<FilesMatch "\.(xml|txt)$">
Header set Cache-Control "max-age=604800, public, must-revalidate"
</FilesMatch>
# 1 WEEK
<FilesMatch "\.(html|htm|php|js)$">
Header set Cache-Control "max-age=604800, must-revalidate"
</FilesMatch>
Is my only solution buying a completely new domain to store all my static content on it?
You need to point to your images using the sub-domain you created.
<img src="http://static.bragdeal.com/test.jpg">
Another alternative would be to put them on Amazon S3 -- which also reduces some traffic to your server.
I have few warnings wich I'm tyring to solve in the pagespeed test, such as:
Leverage browser caching
Setting an expiry date or a maximum age in the HTTP headers for static resources instructs the browser to load previously downloaded resources from local disk rather than over the network.
And then it points out to local .js and .css files
But I have this in my htaccess:
<FilesMatch "\.(js|css|ttf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
<FilesMatch "\.(html|htm|php)$">
Header set Cache-Control "max-age=60, private, proxy-revalidate"
</FilesMatch>
<FilesMatch "\.(css|js|gif|jpeg|png|ico)$">
ExpiresActive On
ExpiresDefault "access plus 1 year"
</FilesMatch>
Any idea what i'm doing wrong?
Well, this is a shot in the dark but I came across circumstances where Apache would not respect my .htaccess headers and I had to "force" them with the always keyword like this:
<FilesMatch "\.(js|css|ttf)$">
Header always set Cache-Control "max-age=604800, public"
</FilesMatch>
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
Header always set Cache-Control "max-age=604800, public"
</FilesMatch>
<FilesMatch "\.(html|htm|php)$">
Header always set Cache-Control "max-age=60, private, proxy-revalidate"
</FilesMatch>
<FilesMatch "\.(css|js|gif|jpeg|png|ico)$">
ExpiresActive On
ExpiresDefault "access plus 1 year"
</FilesMatch>
When your action is a function of an existing header, you may need to specify a condition of always, depending on which internal table the original header was set in. The table that corresponds to always is used for locally generated error responses as well as successful responses. Note also that repeating this directive with both conditions makes sense in some scenarios because always is not a superset of onsuccess with respect to existing headers:
You're adding a header to a locally generated non-success (non-2xx) response, such as a redirect, in which case only the table corresponding to always is used in the ultimate response.
You're modifying or removing a header generated by a CGI script, in which case the CGI scripts are in the table corresponding to always and not in the default table.
You're modifying or removing a header generated by some piece of the server but that header is not being found by the default onsuccess condition.
From Apache Module mod_headers
Gidday
I've currently got js files set up as must-revalidate, to overcome mobile networks caching old versions when I do updates.
<FilesMatch ".(js)$">
Header set Cache-Control "max-age=608000"
Header set Cache-Control "must-revalidate"
</FilesMatch>
I have some .js files that I never change, so I was wondering how to go about making an exception for these files?
Thanks for your time and help.
You can add another FilesMatch section for those specific files:
<FilesMatch "\.js$">
Header set Cache-Control "max-age=608000"
Header set Cache-Control "must-revalidate"
</FilesMatch>
# CACHED FOREVER
<FilesMatch "(file1|file2)\.js$">
Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
Header unset Last-Modified
</FilesMatch>
This is my code for cacheing my website in the user's browsers:
## EXPIRES CACHING ##
<IfModule mod_expires.c>
Header unset Pragma
FileETag None
Header unset ETag
# cache images/pdf docs for 30 days
<FilesMatch "\.(ico|pdf|jpg|jpeg|png|gif|js|ttf|woff|eot|svg)$">
Header set Cache-Control "max-age=2592000, public, must-revalidate"
Header unset Last-Modified
</FilesMatch>
# cache html/htm/xml/txt diles for 10 days
<FilesMatch "\.(html|htm|xml|txt|xsl|css|php)$">
Header set Cache-Control "max-age=864000, must-revalidate"
</FilesMatch>
</IfModule>
## EXPIRES CACHING ##
When I check my website's performance on http://developers.google.com/speed/pagespeed/insights/ it doesn't seem like it's getting cache'd.
Is there anything wrong with the code? Or could it have something to do with a deeper server setting?
Thanks!
I solved the issue by installing mod_headers and mod_expires on the server. Quite useful if you're going to use their functions...