Leverage Browser Caching Best Method
1.8 GB = 1800MB so an average U.S user can only visit your site 900 times a month if all datas need to be refreshed every visits, caching previously downloaded files will lower data consumption and quicken browsing experience
How to Leverage Browser Caching with Apache htaccess
You can use Expires header (mod_expires) or Cache-Control header to leverage browser caching, either one of Cache-Control or Expires header is recommended, do not use both as the max-age directive takes priority over Expires (max-age is the value used by Cache-Control Header)
I would definitely recommend Cache-Control Header as it is the latest but you can also use Expires header too, but do not use both.
Cache-Control vs Expires (mod_expires)
Cache-Control was introduced in HTTP/1.1 and offers more options than Expires. They can be used to accomplish the same thing but the data value for Expires is an HTTP date, whereas Cache-Control max-age lets you specify a relative amount of time so you could specify “X hours after the page was requested”.
Expires header depends on Date Header without Date Header mod_expires will not work properly, Expires use Server-Side Date to calculate cache time but in the other hand Cache-Control header doesn’t depend on any other header it uses the Client-Side date to calculate cache time. If you are using a CDN (Cloud Delivery Network) I recommend to use Cache-Control with a max-age time in seconds. For example Cache-Control: max-age=604800. This prevents request-peaks (heavy load) to your origin-server: With “Expires Wed, 07 Aug 20xx 04:37:07 GMT” all browsers will request same file at the same time.
For painless method copy paste this code in very end of htaccess file, this will add support for Cache-Control which is simply enough for most sites, Cache-Control Header is recommended and its best for CDN.
# Leverage Browser Caching Guest.blog/?p=3184 <IfModule mod_headers.c> # Remove Expires header, Which is something similar to Cache-Control Header Header always unset Expires Header unset Expires
Header unset Cache-Control # 1 WEEK <FilesMatch ".(dmg|bmp|bz2|gif|ico|gz|rar|rtf|swf|eot|tar|tgz|txt|wav|torrent|pkg|rar|exe|zip|jpeg|jpg|gif|bmp|mp3|ttf|woff|flv|swf|png|css|ico|pdf|mpg|mp4|mov|wav|wmv|swf|css|js|txt|asf|asx|wax|wmv|wmx|avi|bmp|class|divx|doc|docx|eot|exe|gif|gz|gzip|ico|jpg|jpeg|jpe|json|mdb|mid|midi|mov|qt|mp3|m4a|mp4|m4v|mpeg|mpg|mpe|mpp|otf|odb|odc|odf|odg|odp|ods|odt|ogg|pdf|png|pot|pps|ppt|pptx|ra|ram|svg|svgz|swf|tar|tif|tiff|ttf|ttc|wav|wma|wri|woff|xla|xls|xlsx|xlt|xlw|zip|css|htc|less|js|js2|js3|js4)$"> Header set Cache-Control "max-age=604800, public" </FilesMatch> # NEVER CACHE - notice the extra directives <FilesMatch ".(html|htm|php|cgi|pl)$"> Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate" </FilesMatch> </IfModule> # Leverage Browser Caching Guest.blog/?p=3184
If you favor mod_expires / Expires header use the following snippet in the very end of htaccess