To take advantage of the browser cache, we essentially need to make known to the browser when the files it has just collected expire, so that by then it will keep them and will not collect new ones.
This information can be passed from server to browser in some ways. Below is an example using the .htaccess
of Apache file, example using PHP header()
function and example using META
tag in HTML:
Apache
Creating a file with the name .htaccess
in the root of our project or in a folder and / or sub-folder where we have certain elements that we want to control, we were able to define the expiration date of the files sent to the browser making use of the module mod_expires
(English) :
Example
# enable expirations
ExpiresActive On
ExpiresDefault "access plus 3 months"
ExpiresByType image/gif "access plus 3 months"
ExpiresByType image/png "access plus 3 months"
ExpiresByType image/jpeg "access plus 3 months"
ExpiresByType image/pjpeg "access plus 3 months"
ExpiresByType text/javascript "modification plus 3 months"
ExpiresByType application/javascript "modification plus 3 months"
ExpiresByType text/css "modification plus 3 months"
In the example above we are indicating for each file type what their validity is, ie how long should the browser cache them.
-
access plus 3 months
→ From file access, save for 3 months
-
modification plus 3 months
→ From the modification date, save for 3 months
PHP
Via PHP we can make use of the header()
function to make the browser known from when you should consider the file as expired:
// A partir das 5h da manhã do dia 20-07-2020 o navegador deve puxar nova cópia
header("Expires: Sat, 26 Jul 2020 05:00:00 GMT");
Or we can also:
// Ficheiro expira em 30 dias (60sec * 60min * 24horas * 30dias)
header("Cache-Control: max-age=2592000");
Anything that is sent to the browser through PHP should have appropriate headers for caching control to optimize page download time when we talk about content that changes very sporadically.
HTML
With HTML we can also set a meta tag to tell the browser when the page expires, see specifications here (English) :
<!-- Não fazer cache -->
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
The accepted values are:
- Public - can be cached public
- Private - can only be privately cached
- no-cache - can not be cached
- no-store - can be cached, but can not be archived
Summary
Cache via Apache is useful for controlling when documents such as images, PDF, CSS, JS, etc. expire.
Caching via PHP and HTML is particularly useful for controlling when a page expires whose content is static for a certain time, dynamic but only changed from X to X time or define content that should never be cached.
Of course this can also be done via Apache as explained above.
Note: This answer is intended to shed light on cache control and some forms at our disposal. There are too many cache control issues and techniques that can be used for specific purposes, but here's an introduction.