Leverage browser caching

[Saurabh Jain]

How to do the Leverage browser caching

Based on Google developer site health analysis

1. Leverage browser caching

Details -

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.

Leverage browser caching for the following cacheable resources:

----

----

---

[Aiwa]

Key word in there, 'static'. IP.Board, by it's nature, is 'dynamic'. Content is ever changing based on permissions, content added, etc.

If you're using apache, you can use mod_expires, but be warned, it can cause issues if used improperly on dynamic pages.

[Makoto]

Never cache dynamic PHP pages. What this is saying is you need to set caching headers for your static elements. Basically forum style elements, avatars and the sort.

Add some caching rules for content in /public and /uploads and you should be good. Caching these elements for one week+ is usually a good idea. Any time avatars/templates are updated, the nocache query string should update and cause the browser to re-download the new version regardless of how long you cache elements for.

These are the old Apache rules I used for this,

<Directory /path/to/www/public/>
        <filesMatch ".(jpg|jpeg|png|gif|swf|ico|css|js|pdf|flv)$">
                Header set Cache-Control "max-age=604800, public"
        </filesMatch>
</Directory>
<Directory /path/to/www/uploads/>
        <filesMatch ".(jpg|jpeg|png|gif|swf|ico|css|js|pdf|flv)$">
                Header set Cache-Control "max-age=604800, public"
        </filesMatch>
</Directory>

[Draffi]

Never cache dynamic PHP pages. What this is saying is you need to set caching headers for your static elements. Basically forum style elements, avatars and the sort.

Add some caching rules for content in /public and /uploads and you should be good. Caching these elements for one week+ is usually a good idea. Any time avatars/templates are updated, the nocache query string should update and cause the browser to re-download the new version regardless of how long you cache elements for.

These are the old Apache rules I used for this,

<Directory /path/to/www/public/>
        <filesMatch ".(jpg|jpeg|png|gif|swf|ico|css|js|pdf|flv)$">
                Header set Cache-Control "max-age=604800, public"
        </filesMatch>
</Directory>
<Directory /path/to/www/uploads/>
        <filesMatch ".(jpg|jpeg|png|gif|swf|ico|css|js|pdf|flv)$">
                Header set Cache-Control "max-age=604800, public"
        </filesMatch>
</Directory>

I have a question, please:

Where to put this? inside the .htaccess ?

[Grumpy]

You can omit the <directory> tags if you are putting it in .htaccess since the htaccess itself should be placed in appropriate directory. Otherwise, you can put it in your apache config.

[Joriz]

We do actually cache our dynamic forum pages. We do this in certain cases for guests. Members always get the latest version off course.

For more information and tips see: http://community.invisionpower.com/topic/364153-great-results-with-nginx-cache/page-6?hl=nginx#entry2401354

I advise you to read all the tips and first test this in a separate environment with some of your users.You don't want to create nasty results where some members can view pages as other members.

I think the Google developer (Did you use Pagespeed Insight?) is referring to images and other static content as mentioned by the members above me. This can be easily achieved by adding a .htaccess file if you are using Apache or preferable set the expires value for static content in Nginx to it's maximum ( expires max; ).