Leverage browser caching of static assets

Web Performance Optimization Discussions
1

Hi,

I have already used WP Super Cache plugin for my Wordpress site and added following codes to .htaccess file but still got the F for cache static content.

http://www.webpagetest.org/performance_optimization.php?test=140514_RS_S5Z&run=1&cached=0

[code]## EXPIRES CACHING ##

ExpiresActive On
ExpiresByType image/jpg “access plus 1 year”
ExpiresByType image/jpeg “access plus 1 year”
ExpiresByType image/gif “access plus 1 year”
ExpiresByType image/png “access plus 1 year”
ExpiresByType text/css “access plus 1 month”
ExpiresByType application/pdf “access plus 1 month”
ExpiresByType text/x-javascript “access plus 1 month”
ExpiresByType application/x-shockwave-flash “access plus 1 month”
ExpiresByType image/x-icon “access plus 1 year”
ExpiresDefault “access plus 1 month”

EXPIRES CACHING ##[/code]

2

CloudFlare makes your .htaccess file useless. It’s bypassed. Disable CF and run these tests again to see what I’m talking about.

I use this code in .htaccess for leveraging of browser caching:<IfModule mod_expires.c> ExpiresActive On ExpiresByType text/css A2628000 ExpiresByType text/richtext A3600 ExpiresByType image/svg+xml A3600 ExpiresByType text/plain A3600 ExpiresByType text/xsd A3600 ExpiresByType text/xsl A3600 ExpiresByType video/asf A2628000 ExpiresByType video/avi A2628000 ExpiresByType image/bmp A2628000 ExpiresByType application/java A2628000 ExpiresByType video/divx A2628000 ExpiresByType application/msword A2628000 ExpiresByType application/x-msdownload A2628000 ExpiresByType image/gif A2628000 ExpiresByType application/x-gzip A2628000 ExpiresByType image/x-icon A2628000 ExpiresByType image/jpeg A2628000 ExpiresByType application/vnd.ms-access A2628000 ExpiresByType audio/midi A2628000 ExpiresByType video/quicktime A2628000 ExpiresByType audio/mpeg A2628000 ExpiresByType video/mp4 A2628000 ExpiresByType video/mpeg A2628000 ExpiresByType application/javascript A2628000 ExpiresByType application/x-javascript A2628000 ExpiresByType application/vnd.ms-project A2628000 ExpiresByType application/vnd.oasis.opendocument.database A2628000 ExpiresByType application/vnd.oasis.opendocument.chart A2628000 ExpiresByType application/vnd.oasis.opendocument.formula A2628000 ExpiresByType application/vnd.oasis.opendocument.graphics A2628000 ExpiresByType application/vnd.oasis.opendocument.presentation A2628000 ExpiresByType application/vnd.oasis.opendocument.spreadsheet A2628000 ExpiresByType application/vnd.oasis.opendocument.text A2628000 ExpiresByType audio/ogg A2628000 ExpiresByType application/pdf A2628000 ExpiresByType image/png A2628000 ExpiresByType application/vnd.ms-powerpoint A2628000 ExpiresByType audio/x-realaudio A2628000 ExpiresByType application/x-shockwave-flash A2628000 ExpiresByType application/x-tar A2628000 ExpiresByType image/tiff A2628000 ExpiresByType audio/wav A2628000 ExpiresByType audio/wma A2628000 ExpiresByType application/vnd.ms-write A2628000 ExpiresByType application/vnd.ms-excel A2628000 ExpiresByType application/zip A2628000 </IfModule>

Additionally, I test using IE 10 or 11 only, to get the full picture of what is happening with a given site. Chrome can mask alot of the responses for some reason, robbing you of the full picture.

In this test of your site, it’s clear you also need to compress and optimize images. This will take almost 1 megabyte off your pageload and will improve performance without losing any content. Might even improve that time to first byte, which incidentally is far off the target for this test. Some of that is actually added, by CloudFlare. Turning off CF will immediately improve that TTFB some.

EDIT to add: This call:http://kpopexplorer.net/wp-content/plugins/wp-pagenavi/pagenavi-css.css?ver=2.70Is kicking a 404 not found error.

Additionally, calls 13-20 and 51 in this test waterfall view are coming from third party hosting, namely tinypic. You have no control over these images and can’t optimize them if they aren’t hosted locally. If they’re not dynamic content, I suggest hosting them locally after optimization.

3

thank you very much for your reply. It helps a lot!

4

Hi Anton Chigurh,

When I disable Cloudfare, my TTFB improves but Keep-Alive goes down.

http://www.webpagetest.org/result/140527_PH_3FD/

Should I consider keep TTFB high or Keep-Alive?

5

It’s not just the keep-alive, the TTFB for your static resources looks like they also come back relatively slowly. Try doing a bunch more tests (9+) and see if the base page TTFB is consistently fast. If so, reach out to Cloudflare support and your hosting company and have them work together. It’s possible that they are doing IP-Based rate-limiting or something like that.

The keep-alives is also a problem with your hosting provider and usually a strong sign that they are WAY over-subscribed. If they can’t/wont enable keep-alives then you should switch hosts - period (and let everyone here know so nobody else uses them - rewarding that behavior is killing performance).

6

My site result displays some weird links in ‘Leverage browser caching of static assets’ sections.
http://www.webpagetest.org/result/140530_93_559/

Recently, I implement Disqus comment system and some affiliate programs on the website.

7

Those look like a combination of retargeting pixels, ads stuff and some from Disqus. I wouldn’t be surprised if the “affiliate” programs were doing all sorts of user tracking/retargeting which is what you are seeing.

8

You can easily Leverage Browser Caching on WordPress. Follow this guide: How to Easily Leverage Browser Caching on WordPress - WPMyWeb