WordPress.org

Forums

Quick Cache (Speed Without Compromise)
[resolved] Google PageSpeed Insights suggests "Leverage browser caching" (11 posts)

  1. evster
    Member
    Posted 10 months ago #

    I've tested multiple sites that I have Quick Cache installed on via Google's PageSpeed Insights tool (http://developers.google.com/speed/pagespeed/insights/), and for all of them it is still suggesting that I "leverage browser caching."

    The Google PageSpeed tools suggests "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."

    This applies primarily to a small list of graphic files (.png, .jpg, etc...) and on one site a .js file is listed. For each of these items it's telling me "expiration not specified."

    Should I be concerned, or can this warning safely be ignored? I'm guessing these are files that Quick Cache is simply not caching?

    https://wordpress.org/plugins/quick-cache/

  2. Raam Dev
    Member
    Plugin Author

    Posted 10 months ago #

    Should I be concerned, or can this warning safely be ignored? I'm guessing these are files that Quick Cache is simply not caching?

    Quick Cache caches WordPress page output to the disk and loads that cached HTML when serving a request, instead of having WordPress run all the database queries to regenerate output. This greatly improves performance.

    Browser Caching is different. That's basically the web server telling your browser that when it loads a specific file type (jpg, png, pdf, etc.) to save (cache) that file on the persons computer (in their browser) and instead of downloading the file again in the future to just use the cached one.

    Quick Cache is a WordPress caching plugin, so it specifically deals with caching WordPress output. If you want to also support browser caching, you'll need to tell your web server (e.g., Apache) to send the necessary headers to the client browser so that it caches files for a specific amount of time.

    You can do this by adding the following to your site's .htaccess file:

    # Browser Caching
    
    FileETag MTime Size
    
    <IfModule expires_module>
        ExpiresActive on
        ExpiresDefault "access plus 1 week"
    </IfModule>

    I agree that Quick Cache should at least explain this and possibly even provide a mechanism for automatically inserting this code into your .htaccess file. There is a feature request open to add such a section to Quick Cache: https://github.com/websharks/quick-cache/issues/134

  3. evster
    Member
    Posted 10 months ago #

    Hey thanks so much for that detailed response!

    I'm new to the world of caching so I still have a lot to learn, but your explanation makes total sense and I now understand the difference between Quick Cache and browser caching.

    However, if I do decide to implement browser caching, will that mean repeat visitors will not see any updates for 1 week from the time they initially load the page - even if the page is updated? Or does the browser somehow check with the server to see if the page has been updated, and then reload the content in a fresh browser cache?

    I wouldn't want to set a 1-week browser caching period and then have repeat visitors miss out on new content until after the caching period is over.

    Thanks again!

  4. Raam Dev
    Member
    Plugin Author

    Posted 10 months ago #

    However, if I do decide to implement browser caching, will that mean repeat visitors will not see any updates for 1 week from the time they initially load the page - even if the page is updated? Or does the browser somehow check with the server to see if the page has been updated, and then reload the content in a fresh browser cache?

    I had that same question when I first started looking more closely at browser caching. My colleague explained why you don't have to worry about that (in short, because software like WordPress will make sure that dynamic stuff, like posts, include headers that get sent to the browser explicitly telling the browser not to cache it): https://github.com/websharks/quick-cache/issues/134#issuecomment-45284002

  5. Raam Dev
    Member
    Plugin Author

    Posted 10 months ago #

    If WordPress (or another plugin) wants to disallow caching for a request it can call upon nocache_headers() in the WordPress core to override the headers passed by the server based on the default expiration time of one week. Quoted from: https://github.com/websharks/quick-cache/issues/134#issuecomment-45284002

  6. Raam Dev
    Member
    Plugin Author

    Posted 10 months ago #

    Also, if you want to get very specific and tell the web server to only request that the browser cache specific types of resources (e.g., images), you can get more specific in your .htaccess file.

    For example:

    # Browser Caching
    
    FileETag MTime Size
    
    <IfModule expires_module>
        ExpiresActive on
        ExpiresByType text/plain "access plus 1 week"
        ExpiresByType text/css "access plus 1 week"
        ExpiresByType text/javascript "access plus 1 week"
        ExpiresByType application/javascript "access plus 1 week"
        ExpiresByType application/x-javascript "access plus 1 week"
        ExpiresByType image/svg+xml "access plus 1 week"
        ExpiresByType image/gif "access plus 1 week"
        ExpiresByType image/png "access plus 1 week"
        ExpiresByType image/ico "access plus 1 week"
        ExpiresByType image/x-icon "access plus 1 week"
        ExpiresByType image/jpg "access plus 1 week"
        ExpiresByType image/jpe "access plus 1 week"
        ExpiresByType image/jpeg "access plus 1 week"
        ExpiresByType font/truetype "access plus 1 week"
        ExpiresByType application/x-font-ttf "access plus 1 week"
        ExpiresByType font/opentype "access plus 1 week"
        ExpiresByType application/x-font-otf "access plus 1 week"
        ExpiresByType application/font-woff "access plus 1 week"
        ExpiresByType application/vnd.ms-fontobject "access plus 1 week"
        ExpiresByType application/x-shockwave-flash "access plus 1 week"
        ExpiresByType application/x-httpd-php-source "access plus 1 week"
    </IfModule>
  7. evster
    Member
    Posted 10 months ago #

    Thank you once again Raam for your detailed explanation!

    I was doing some additional research on the issue and thought of the following potential scenario, which is definitely going to happen to me more often than not:

    Let's say I have browser caching turned on using the .htaccess code that you suggested, but then I manually update the style.css or scripts.js file of my custom theme. Based on my research, I do not believe that the client's browser cache will automatically update to reflect these changes. It seems that the forced "no cache" going on with WordPress is directed more towards dynamically edited content (posts, pages, etc...).

    Given this, what would be your thoughts on using Quick Cache in conjunction with your .htaccess code for browser caching and this plugin: "Busted" Plugin which will "Force browsers to load the most recent file if modified?" I have not looked at the underlying code of this plugin, but it appears to do what I want it to.

  8. Raam Dev
    Member
    Plugin Author

    Posted 9 months ago #

    Please read the Using URL fingerprinting section here. The WordPress functions (e.g., wp_enqueue_script()) that are used to enqueue CSS and JS files already implement a version parameter that would be appended to the CSS or JS file on the page, thereby creating a unique URL Fingerprint. When that resource changes, the theme or plugin developer simply updates the version parameter for that resource so that when the new version is loaded the client browser detects that the fingerprint (the version) is different and uses the newer version of the file.

  9. evster
    Member
    Posted 9 months ago #

    Thanks Raam for the tip! I sincerely appreciate all of your help and guidance through this.

  10. Raam Dev
    Member
    Plugin Author

    Posted 9 months ago #

    Thanks Raam for the tip! I sincerely appreciate all of your help and guidance through this.

    My pleasure! :) Glad I could help.

  11. RightBeatRadio
    Member
    Posted 1 month ago #

    This is wonderful. Thank you, raamdev, for your time helping out the community.

Reply

You must log in to post.

About this Plugin

  • Quick Cache (Speed Without Compromise)
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic