Join the community today
Become a Member

Playing with EWWW Image Optimizer Wordpress Plugin

Discussion in 'Blogs & CMS usage' started by eva2000, Aug 15, 2017.

  1. robert syputa

    robert syputa Member

    77
    18
    8
    Jan 18, 2018
    Seattle
    Ratings:
    +46
    Local Time:
    9:35 AM
    latest
    10
    Right. I wanted to show like format examples.

     
  2. ahmed

    ahmed Active Member

    361
    49
    28
    Feb 21, 2017
    Ratings:
    +63
    Local Time:
    3:35 PM
    can you advise if it is safe to delete these?

    Code:
    237M    ./tools/optimise-images/.git/objects/pack/pack-fb54c2dd2f5c7eb582d0b9fe281206735845bf64.pack
    25M    ./tools/optimise-images/images/dslr_sony_alpha_a99_ii_2.jpg
    21M    ./tools/optimise-images/images/dslr_pentax_k1_1.jpg
    17M    ./tools/optimise-images/images/dslr_nikon_d5_2.jpg
    15M    ./tools/optimise-images/images/dslr_pentax_k1_2.jpg
    [CODE/]
     
  3. eva2000

    eva2000 Administrator Staff Member

    55,247
    12,253
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,833
    Local Time:
    11:35 PM
    Nginx 1.27.x
    MariaDB 10.x/11.4+
    those are demo files, so yes safe
     
  4. ahmed

    ahmed Active Member

    361
    49
    28
    Feb 21, 2017
    Ratings:
    +63
    Local Time:
    3:35 PM
    what abt this one?

    237M ./tools/optimise-images/.git/objects/pack
     
  5. eva2000

    eva2000 Administrator Staff Member

    55,247
    12,253
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,833
    Local Time:
    11:35 PM
    Nginx 1.27.x
    MariaDB 10.x/11.4+
    That is github repo in .git directory you'll need to keep .git directory
     
  6. BamaStangGuy

    BamaStangGuy Active Member

    668
    192
    43
    May 25, 2014
    Ratings:
    +272
    Local Time:
    8:35 AM
    This does not work:

    Code:
    location ~ ^/wp-content/uploads/ {
      #pagespeed off;
      #pagespeed unplugged;
      #autoindex on;
      #add_header X-Robots-Tag "noindex, nofollow";
      location ~* ^/wp-content/uploads/(.+/)?(.+)\.(png|jpe?g)$ {
       expires 30d;
       add_header Vary "Accept";
       add_header Cache-Control "public, no-transform";
       try_files $uri$webp_extension $uri =404;
      }
    }
    type in Network still shows png or jpg. Any ideas? Using EWWW which rewrites them as .jpg.webp inside uploads/<year>/<month>/

    Followed instructions here: Nginx Serving WebP Images Conditionally Demo
     
  7. BamaStangGuy

    BamaStangGuy Active Member

    668
    192
    43
    May 25, 2014
    Ratings:
    +272
    Local Time:
    8:35 AM
    These do not work either:

    Code:
        location ~ ^/wp-content/uploads/2018 {
                    location ~* ^/wp-content/uploads/2018/.+\.(png|jpe?g)$ {
                            expires 30d;
                            add_header Vary "Accept";
                            add_header Cache-Control "public, no-transform";
                            try_files $uri$webp_extension $uri =404;
                    }
            }
    
        location ~ ^/wp-content/uploads/2019 {
                    location ~* ^/wp-content/uploads/2019/.+\.(png|jpe?g)$ {
                            expires 30d;
                            add_header Vary "Accept";
                            add_header Cache-Control "public, no-transform";
                            try_files $uri$webp_extension $uri =404;
                    }
            }
    
        location ~ ^/wp-content/uploads/2020 {
                    location ~* ^/wp-content/uploads/2020/.+\.(png|jpe?g)$ {
                            expires 30d;
                            add_header Vary "Accept";
                            add_header Cache-Control "public, no-transform";
                            try_files $uri$webp_extension $uri =404;
                    }
            }
    Code:
        location ~ ^/wp-content/uploads/2018/ {
                    location ~* ^/wp-content/uploads/2018/.+\.(png|jpe?g)$ {
                            expires 30d;
                            add_header Vary "Accept";
                            add_header Cache-Control "public, no-transform";
                            try_files $uri$webp_extension $uri =404;
                    }
            }
    
        location ~ ^/wp-content/uploads/2019/ {
                    location ~* ^/wp-content/uploads/2019/.+\.(png|jpe?g)$ {
                            expires 30d;
                            add_header Vary "Accept";
                            add_header Cache-Control "public, no-transform";
                            try_files $uri$webp_extension $uri =404;
                    }
            }
    
        location ~ ^/wp-content/uploads/2020/ {
                    location ~* ^/wp-content/uploads/2020/.+\.(png|jpe?g)$ {
                            expires 30d;
                            add_header Vary "Accept";
                            add_header Cache-Control "public, no-transform";
                            try_files $uri$webp_extension $uri =404;
                    }
            }
     
  8. eva2000

    eva2000 Administrator Staff Member

    55,247
    12,253
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,833
    Local Time:
    11:35 PM
    Nginx 1.27.x
    MariaDB 10.x/11.4+
    Just tried on my test wordpress centmin.sh menu option 22 install with keycdn cache-enable full HTML guest cache and works fine, natively in generated include file /usr/local/nginx/conf/wpincludes/cache-enabler.domain.com/wpsecure_cache-enabler.domain.com.conf has
    Code (Text):
    # WebP extension support if you are converting /uploads images to webp
    location ~ ^/wp-content/uploads/ {
      #pagespeed off;
      #pagespeed unplugged;
      #autoindex on;
      #add_header X-Robots-Tag "noindex, nofollow";
      location ~* ^/wp-content/uploads/(.+/)?(.+)\.(png|jpe?g)$ {
        expires 30d;
        add_header Vary "Accept";
        add_header Cache-Control "public, no-transform";
        try_files $uri$webp_extension $uri =404;
      }
    }
    

    Code (Text):
    ls -lahR uploads/2020/03
    uploads/2020/03:
    total 112K
    drwxr-sr-x 2 nginx nginx 4.0K Mar 18 23:33 .
    drwxr-sr-x 4 nginx nginx 4.0K Mar  1 00:03 ..
    -rw-r--r-- 1 nginx nginx 5.7K Mar 18 23:33 corona_1920_racio6_c_scalew_766-150x150.jpg
    -rw-r--r-- 1 nginx nginx 4.0K Mar 18 23:33 corona_1920_racio6_c_scalew_766-150x150.jpg.webp
    -rw-r--r-- 1 nginx nginx 8.4K Mar 18 23:33 corona_1920_racio6_c_scalew_766-300x101.jpg
    -rw-r--r-- 1 nginx nginx 6.4K Mar 18 23:33 corona_1920_racio6_c_scalew_766-300x101.jpg.webp
    -rw-r--r-- 1 nginx nginx  46K Mar 18 23:33 corona_1920_racio6_c_scalew_766.jpg
    -rw-r--r-- 1 nginx nginx  21K Mar 18 23:33 corona_1920_racio6_c_scalew_766.jpg.webp
    

    so nothing to manually add

    upload_2020-3-19_9-39-39.png
     
  9. BamaStangGuy

    BamaStangGuy Active Member

    668
    192
    43
    May 25, 2014
    Ratings:
    +272
    Local Time:
    8:35 AM
    Wonder if somehow Cloudflare is causing issues?

    Will do some more tests.
     
  10. BamaStangGuy

    BamaStangGuy Active Member

    668
    192
    43
    May 25, 2014
    Ratings:
    +272
    Local Time:
    8:35 AM
    Edit: It appears it is just taking time for cloudflare to purge cache
     
  11. eva2000

    eva2000 Administrator Staff Member

    55,247
    12,253
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,833
    Local Time:
    11:35 PM
    Nginx 1.27.x
    MariaDB 10.x/11.4+
    Yup if you have Cloudflare caching that would need purging eventually :) I have this Centmin Mod Nginx webP setup on my blog at https://servermanager.guide/ running Cloudflare free plan :D
     
  12. BamaStangGuy

    BamaStangGuy Active Member

    668
    192
    43
    May 25, 2014
    Ratings:
    +272
    Local Time:
    8:35 AM
    Safari is broken for images now. What am I missing?
     
  13. eva2000

    eva2000 Administrator Staff Member

    55,247
    12,253
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,833
    Local Time:
    11:35 PM
    Nginx 1.27.x
    MariaDB 10.x/11.4+
    should of been fixed with Beta Branch - fix wordpress wpsecure webP header in 123.09beta01 but might depend on safari versions. I could of sworn Safari latest had webP support but from Can I use... Support tables for HTML5, CSS3, etc looks like not ! Will have to revise Centmin Mod Nginx implementation !

    But nginx.conf include file for webp.conf has
    Code (Text):
    map $http_accept $webp_extension {
        default "";
        "~*webp" ".webp";
    }
    

    so .webp would only be served to browsers which have accept header for image/webp. But it could be your cloudflare extended caching in play caching it but accept vary header should of taken care of that. Ensure your webp images are served with accept vary header

    what cache method did you select when running centmin.sh menu option 22 wordpress auto install ?
     
    Last edited: Mar 20, 2020
  14. eva2000

    eva2000 Administrator Staff Member

    55,247
    12,253
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,833
    Local Time:
    11:35 PM
    Nginx 1.27.x
    MariaDB 10.x/11.4+
    hmm seems Cloudflare cache does not respect the Accept Vary header Understanding Origin Cache-Control !

     
  15. BamaStangGuy

    BamaStangGuy Active Member

    668
    192
    43
    May 25, 2014
    Ratings:
    +272
    Local Time:
    8:35 AM
    This is disappointing. It basically forces you to use Cloudflare Pro if you want Webp.
     
  16. eva2000

    eva2000 Administrator Staff Member

    55,247
    12,253
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,833
    Local Time:
    11:35 PM
    Nginx 1.27.x
    MariaDB 10.x/11.4+
    Indeed, i am going to update 123.09beta01 to disable Centmin Mod Nginx .webp auto detection/serving when Cloudflare is detected as CF Free plan doesn't support it and well with CF paid plans you won't need Centmin Mod Nginx .webp origin support anyway.

    So in nginx.conf include file referenced at /usr/local/nginx/conf/webp.conf

    change from
    Code (Text):
    map $http_accept $webp_extension {
        default "";
        "~*webp" ".webp";
    }
    

    to
    Code (Text):
    map $http_accept $webp_extension {
        default "";
        "~*webp" ".webp";
    }
    
    map $http_cf_connecting_ip $webp_extension {
        default "";  
    }

    so 2nd nginx map is for detecting Cloudflare's CF-Connecting-IP header and then empty the $webp_extension variable which is set from 1st nginx map which detects if HTTP request Accept header contains image/webp mime type for browsers that support it
     
  17. upgrade81

    upgrade81 Member

    295
    17
    18
    Sep 5, 2016
    CH
    Ratings:
    +30
    Local Time:
    3:35 PM
    1.17
    10.3
    I realized that webp were no longer working.

    With the last change you made for cloudflare they don't work.
    We only use cloudflare with the dns function, however we disable webp.
     
  18. eva2000

    eva2000 Administrator Staff Member

    55,247
    12,253
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,833
    Local Time:
    11:35 PM
    Nginx 1.27.x
    MariaDB 10.x/11.4+
    I guess I could check for cloudflare cache headers too so DNS only use still has working webP

    edit: just updated 123.09beta01 to change webp.conf include file to check for cf-cache-status HTTP header instead of cf-connecting-ip header so that Cloudflare DNS only mode can still work with nginx level webP support

    Code (Text):
    map $http_accept $webp_extension {
        default "";
        "~*webp" ".webp";
    }
    map $http_cf_cache_status $webp_extension {
        default ""; 
    }
    
     
  19. upgrade81

    upgrade81 Member

    295
    17
    18
    Sep 5, 2016
    CH
    Ratings:
    +30
    Local Time:
    3:35 PM
    1.17
    10.3
    Thank you for your interest.
    However it seems not to work.
     
  20. upgrade81

    upgrade81 Member

    295
    17
    18
    Sep 5, 2016
    CH
    Ratings:
    +30
    Local Time:
    3:35 PM
    1.17
    10.3
    even erasing it after a while it is reinserted.

    :-(