I have been going through lots of article, where a proper example for caching mechanism is not penned down. All tutorials describes about that and a single line demo which, I guess, never really optimizes. I have compiled css and js using grunt.
I have included
<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 application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>
in my .htaccess file.
This, actually says, to cache the content and whenever any changes occur force the browser to use new files.
I do not actually see any changes in DOM Loaded content or in Load Time and everytime, the compiled css and js takes files from server and caches after 5-7 reloading. I guess the cache, which it performs, uses default browser cache.
So How would I use a caching mechanism so that it serves pages quickly and clears the cache when any changes effects the css and JS?
I am using PHP as my application. A better example for doing that with code would be really helpful.