Problems with browser cache / external css

  • Resolved Chad

    (@chadi)


    8 years, 9 months ago

    Installed the plugin, removed any other caching plugin I had. Enabled virtually everything. Pingdom shows 82 score on test. But, got 2 problems:

    F: Leverage browser caching
    D: Combine external CSS

    https://www.logicweb.com/wp-content/cache/autop ... autoptimize_83b708277cbeaa0bfb743be494987501.css
https://www.logicweb.com/wp-content/cache/autop ... autoptimize_a46b2a5c8c3ed4ef613384a677726783.css
https://www.logicweb.com/wp-content/plugins/modal-window/public/css/style.css?ver=3.0
https://www.logicweb.com/wp-content/themes/default-child/style.css?ver=4.8.1
https://www.logicweb.com/wp-content/themes/default/style.css

    I do not see these options in your plugin. Please explain how to correct this without the need to add other plugins.

    htaccess

    <IfModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</IfModule>

## BEGIN GZIP Compression ##
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-httpd-fastphp
AddOutputFilterByType DEFLATE image/svg+xml
SetOutputFilter DEFLATE
</IfModule>
## END GZIP Compression ##

## BEGIN Leverage Browser Caching (Expires Caching) ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
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 image/x-icon "access 1 year"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresDefault "access 1 month"
</IfModule>
## END Leverage Browser Caching (Expires Caching) ##

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Author Optimizing Matters

    (@optimizingmatters)

    8 years, 9 months ago

    try deactivating the “serve as static files” option to fix this for the autoptimized files @chadi

    hope this helps,
    frank

    Thread Starter Chad

    (@chadi)

    8 years, 9 months ago

    Thanks, but still getting F (23) and D (65)

    For some reason, Leverage browser caching is failing and not kicking in from the htaccess.

    Still getting D on Combine CSS as well.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    8 years, 9 months ago

    For some reason, Leverage browser caching is failing and not kicking in from the htaccess.

    worse; when the AO’ed CSS/ JS is not served statically, PHP takes over and the correct caching headers are added. this + the fact your .htaccess doesn’t work (for AO’ed files and others) means there is *something* in front of Apache removing/ overwriting those headers. could be something at your hoster or a 3rd party reverse proxy (like cloudflare). i’ve also heard a specific setting in WP Super Cache does something similar (mod_rewrite based caching).

    Still getting D on Combine CSS as well.

    there are 3 files not optimized;

    https://www.logicweb.com/wp-content/plugins/modal-window/public/css/style.css?ver=3.0
    https://www.logicweb.com/wp-content/themes/default-child/style.css?ver=4.8.1
    https://www.logicweb.com/wp-content/themes/default/style.css

    so do you have style.css in your CSS optimization exclusion list? alternatively it could also be excluded by a plugin (or theme) via AO’s API, so if not in the exclusion list you’ll have to look into that.

    hope this helps,
    frank

    Thread Starter Chad

    (@chadi)

    8 years, 9 months ago

    Thanks for your help. When I remove the style.css from “excluse css from autoptimize” I get 2 results:

    Fixes “Combine CSS” from C to A, but ends up affecting the menu as well as shown below.

    View post on imgur.com

    Should look like: http://i.imgur.com/fFyJ4eI.png

    Still getting F on “Leverage browser caching”.

    Thread Starter Chad

    (@chadi)

    8 years, 9 months ago

    Also, even with a score of 85/86 and F on browser cache, I get a B score on combine JS…

    There are 3 JavaScript files served from http://www.logicweb.com. They should be combined into as few files as possible.

    https://www.logicweb.com/wp-content/cache/autop … autoptimize_ad934cfc9dcb7ea01681b1ceaae75998.php
    https://www.logicweb.com/wp-includes/js/jquery/jquery.js?ver=1.12.4
    https://www.logicweb.com/wp-includes/js/wp-emoji-release.min.js?ver=4.8.1

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    8 years, 9 months ago

    When I remove the style.css from “excluse css from autoptimize” I get 2 results: Fixes “Combine CSS” from C to A, but ends up affecting the menu as well as shown below.

    well, for starters you can be more specific; try excluding modal-window/public/css/style.css or themes/default-child/style.css and see which one is needed.

    the root cause of your problem is probably the fact that a plugin (indonez-ui-shortcodes) and your theme (satria) are settings some CSS to media="all" and some to media="screen, all". AO honors media attribute and creates an autoptimized CSS-file for each, which results in the CSS not being in the same order. media="screen, all" makes little to no sense as far as I know (but I’m not a CSS specialist). if need be you can use the AO API to force all of that to media="all" (I can provide example code), but ideally this is fixed in the plugin/theme.

    Still getting F on “Leverage browser caching”.

    well, as I wrote something is overwriting the cache-headers set by Apache and AO (when in dynamic delivery, i.e. PHP), you’ll have to check with hoster or reverse proxy provider or … nothing AO can do about that.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    8 years, 9 months ago

    for JS; you can try un-excluding js/jquery/jquery.js but many sites need that excluded. the emoji-js is called by other JS, so can’t be optimized by AO. I personally use a plugin to remove the emoji-clutter.

    maweb

    (@maweb)

    8 years, 6 months ago

    Hello, there’s a way to set (by .htaccess) a date/time expire for autoptimize.css and .js?
    Actually it set at 3 seconds.

    At the same, is there a way to move “under the fold” the autoptimize.css ?
    Actually is above the fold.

    Thank you

    • This reply was modified 8 years, 6 months ago by maweb.
    • This reply was modified 8 years, 6 months ago by maweb.
    • This reply was modified 8 years, 6 months ago by maweb.
    Plugin Author Optimizing Matters

    (@optimizingmatters)

    8 years, 6 months ago

    morning @maweb;
    for the expiration; AO’ed files by default have a very long expiry date, but you might have something (probably the from wp super cache) in wp-content/cache/.htaccess that overrides that.

    for “under the fold”; have a look at “inline all CSS” (easy) or “inline and defer CSS” (better). there’s more info in the FAQ on those.

    can you start your own thread if you have additional questions? 🙂

    hope this helps,
    frank

    maweb

    (@maweb)

    8 years, 6 months ago

    # BEGIN WPSuperCache
    <IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    #If you serve pages from behind a proxy you may want to change ‘RewriteCond %{HTTPS} on’ to something more sensible
    AddDefaultCharset UTF-8
    RewriteCond %{REQUEST_URI} !^.*[^/]$
    RewriteCond %{REQUEST_URI} !^.*//.*$
    RewriteCond %{REQUEST_METHOD} !POST
    RewriteCond %{QUERY_STRING} !.*=.*
    RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress_logged_in|wp-postpass_).*$
    RewriteCond %{HTTP:X-Wap-Profile} !^[a-z0-9\”]+ [NC]
    RewriteCond %{HTTP:Profile} !^[a-z0-9\”]+ [NC]
    RewriteCond %{HTTP_USER_AGENT} !^.*(2.0\ MMP|240×320|400X240|AvantGo|BlackBerry|Blazer|Cellphone|Danger|DoCoMo|Elaine/3.0|EudoraWeb|Googlebot-Mobile|hiptop|IEMobile|KYOCERA/WX310K|LG/U990|MIDP-2.|MMEF20|MOT-V|NetFront|Newt|Nintendo\ Wii|Nitro|Nokia|Opera\ Mini|Palm|PlayStation\ Portable|portalmmm|Proxinet|ProxiNet|SHARP-TQ-GX10|SHG-i900|Small|SonyEricsson|Symbian\ OS|SymbianOS|TS21i-10|UP.Browser|UP.Link|webOS|Windows\ CE|WinWAP|YahooSeeker/M1A1-R2D2|iPhone|iPod|Android|BlackBerry9530|LG-TU915\ Obigo|LGE\ VX|webOS|Nokia5800).* [NC]
    RewriteCond %{HTTP_USER_AGENT} !^(w3c\ |w3c-|acs-|alav|alca|amoi|audi|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd-|dang|doco|eric|hipt|htc_|inno|ipaq|ipod|jigs|kddi|keji|leno|lg-c|lg-d|lg-g|lge-|lg/u|maui|maxo|midp|mits|mmef|mobi|mot-|moto|mwbp|nec-|newt|noki|palm|pana|pant|phil|play|port|prox|qwap|sage|sams|sany|sch-|sec-|send|seri|sgh-|shar|sie-|siem|smal|smar|sony|sph-|symb|t-mo|teli|tim-|tosh|tsm-|upg1|upsi|vk-v|voda|wap-|wapa|wapi|wapp|wapr|webc|winw|winw|xda\ |xda-).* [NC]
    RewriteCond %{HTTP:Accept-Encoding} gzip
    RewriteCond %{HTTPS} on
    RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{SERVER_NAME}/$1/index-https.html.gz -f
    RewriteRule ^(.*) “/wp-content/cache/supercache/%{SERVER_NAME}/$1/index-https.html.gz” [L]

    RewriteCond %{REQUEST_URI} !^.*[^/]$
    RewriteCond %{REQUEST_URI} !^.*//.*$
    RewriteCond %{REQUEST_METHOD} !POST
    RewriteCond %{QUERY_STRING} !.*=.*
    RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress_logged_in|wp-postpass_).*$
    RewriteCond %{HTTP:X-Wap-Profile} !^[a-z0-9\”]+ [NC]
    RewriteCond %{HTTP:Profile} !^[a-z0-9\”]+ [NC]
    RewriteCond %{HTTP_USER_AGENT} !^.*(2.0\ MMP|240×320|400X240|AvantGo|BlackBerry|Blazer|Cellphone|Danger|DoCoMo|Elaine/3.0|EudoraWeb|Googlebot-Mobile|hiptop|IEMobile|KYOCERA/WX310K|LG/U990|MIDP-2.|MMEF20|MOT-V|NetFront|Newt|Nintendo\ Wii|Nitro|Nokia|Opera\ Mini|Palm|PlayStation\ Portable|portalmmm|Proxinet|ProxiNet|SHARP-TQ-GX10|SHG-i900|Small|SonyEricsson|Symbian\ OS|SymbianOS|TS21i-10|UP.Browser|UP.Link|webOS|Windows\ CE|WinWAP|YahooSeeker/M1A1-R2D2|iPhone|iPod|Android|BlackBerry9530|LG-TU915\ Obigo|LGE\ VX|webOS|Nokia5800).* [NC]
    RewriteCond %{HTTP_USER_AGENT} !^(w3c\ |w3c-|acs-|alav|alca|amoi|audi|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd-|dang|doco|eric|hipt|htc_|inno|ipaq|ipod|jigs|kddi|keji|leno|lg-c|lg-d|lg-g|lge-|lg/u|maui|maxo|midp|mits|mmef|mobi|mot-|moto|mwbp|nec-|newt|noki|palm|pana|pant|phil|play|port|prox|qwap|sage|sams|sany|sch-|sec-|send|seri|sgh-|shar|sie-|siem|smal|smar|sony|sph-|symb|t-mo|teli|tim-|tosh|tsm-|upg1|upsi|vk-v|voda|wap-|wapa|wapi|wapp|wapr|webc|winw|winw|xda\ |xda-).* [NC]
    RewriteCond %{HTTP:Accept-Encoding} gzip
    RewriteCond %{HTTPS} !on
    RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{SERVER_NAME}/$1/index.html.gz -f
    RewriteRule ^(.*) “/wp-content/cache/supercache/%{SERVER_NAME}/$1/index.html.gz” [L]

    RewriteCond %{REQUEST_URI} !^.*[^/]$
    RewriteCond %{REQUEST_URI} !^.*//.*$
    RewriteCond %{REQUEST_METHOD} !POST
    RewriteCond %{QUERY_STRING} !.*=.*
    RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress_logged_in|wp-postpass_).*$
    RewriteCond %{HTTP:X-Wap-Profile} !^[a-z0-9\”]+ [NC]
    RewriteCond %{HTTP:Profile} !^[a-z0-9\”]+ [NC]
    RewriteCond %{HTTP_USER_AGENT} !^.*(2.0\ MMP|240×320|400X240|AvantGo|BlackBerry|Blazer|Cellphone|Danger|DoCoMo|Elaine/3.0|EudoraWeb|Googlebot-Mobile|hiptop|IEMobile|KYOCERA/WX310K|LG/U990|MIDP-2.|MMEF20|MOT-V|NetFront|Newt|Nintendo\ Wii|Nitro|Nokia|Opera\ Mini|Palm|PlayStation\ Portable|portalmmm|Proxinet|ProxiNet|SHARP-TQ-GX10|SHG-i900|Small|SonyEricsson|Symbian\ OS|SymbianOS|TS21i-10|UP.Browser|UP.Link|webOS|Windows\ CE|WinWAP|YahooSeeker/M1A1-R2D2|iPhone|iPod|Android|BlackBerry9530|LG-TU915\ Obigo|LGE\ VX|webOS|Nokia5800).* [NC]
    RewriteCond %{HTTP_USER_AGENT} !^(w3c\ |w3c-|acs-|alav|alca|amoi|audi|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd-|dang|doco|eric|hipt|htc_|inno|ipaq|ipod|jigs|kddi|keji|leno|lg-c|lg-d|lg-g|lge-|lg/u|maui|maxo|midp|mits|mmef|mobi|mot-|moto|mwbp|nec-|newt|noki|palm|pana|pant|phil|play|port|prox|qwap|sage|sams|sany|sch-|sec-|send|seri|sgh-|shar|sie-|siem|smal|smar|sony|sph-|symb|t-mo|teli|tim-|tosh|tsm-|upg1|upsi|vk-v|voda|wap-|wapa|wapi|wapp|wapr|webc|winw|winw|xda\ |xda-).* [NC]
    RewriteCond %{HTTPS} on
    RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{SERVER_NAME}/$1/index-https.html -f
    RewriteRule ^(.*) “/wp-content/cache/supercache/%{SERVER_NAME}/$1/index-https.html” [L]

    RewriteCond %{REQUEST_URI} !^.*[^/]$
    RewriteCond %{REQUEST_URI} !^.*//.*$
    RewriteCond %{REQUEST_METHOD} !POST
    RewriteCond %{QUERY_STRING} !.*=.*
    RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress_logged_in|wp-postpass_).*$
    RewriteCond %{HTTP:X-Wap-Profile} !^[a-z0-9\”]+ [NC]
    RewriteCond %{HTTP:Profile} !^[a-z0-9\”]+ [NC]
    RewriteCond %{HTTP_USER_AGENT} !^.*(2.0\ MMP|240×320|400X240|AvantGo|BlackBerry|Blazer|Cellphone|Danger|DoCoMo|Elaine/3.0|EudoraWeb|Googlebot-Mobile|hiptop|IEMobile|KYOCERA/WX310K|LG/U990|MIDP-2.|MMEF20|MOT-V|NetFront|Newt|Nintendo\ Wii|Nitro|Nokia|Opera\ Mini|Palm|PlayStation\ Portable|portalmmm|Proxinet|ProxiNet|SHARP-TQ-GX10|SHG-i900|Small|SonyEricsson|Symbian\ OS|SymbianOS|TS21i-10|UP.Browser|UP.Link|webOS|Windows\ CE|WinWAP|YahooSeeker/M1A1-R2D2|iPhone|iPod|Android|BlackBerry9530|LG-TU915\ Obigo|LGE\ VX|webOS|Nokia5800).* [NC]
    RewriteCond %{HTTP_USER_AGENT} !^(w3c\ |w3c-|acs-|alav|alca|amoi|audi|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd-|dang|doco|eric|hipt|htc_|inno|ipaq|ipod|jigs|kddi|keji|leno|lg-c|lg-d|lg-g|lge-|lg/u|maui|maxo|midp|mits|mmef|mobi|mot-|moto|mwbp|nec-|newt|noki|palm|pana|pant|phil|play|port|prox|qwap|sage|sams|sany|sch-|sec-|send|seri|sgh-|shar|sie-|siem|smal|smar|sony|sph-|symb|t-mo|teli|tim-|tosh|tsm-|upg1|upsi|vk-v|voda|wap-|wapa|wapi|wapp|wapr|webc|winw|winw|xda\ |xda-).* [NC]
    RewriteCond %{HTTPS} !on
    RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{SERVER_NAME}/$1/index.html -f
    RewriteRule ^(.*) “/wp-content/cache/supercache/%{SERVER_NAME}/$1/index.html” [L]
    </IfModule>

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    8 years, 6 months ago

    don’t see an offender in there. could also be in /.htaccess or /wp-content/.htaccess (or even in the apache config file(s) itself)

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘Problems with browser cache / external css’ is closed to new replies.