Get the most out of your Centmin Mod LEMP stack
Become a Member

IP.Board IPB Pagespeed Config

Discussion in 'Forum software usage' started by Jimmy, Mar 5, 2018.

  1. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    Working on a configuration file for Invision Community Software (IPB). Please feel free to add your comments and suggestions to this thread.

    Code:
    ##################################################
    #### GOOGLE PAGESPEED
    ##################################################
    
    INFORMATION
    https://centminmod.com/nginx_ngx_pagespeed.html#howtoinstall
    
    ##################################################
    #### PAGESPEED ON / OFF / TESTING
    ##################################################
    
    Turn Pagespeed on
    # pscontrol on
    
    Turn Pagespeed off
    # pscontrol off
    
    
    ##################################################
    #### PAGESPEED CUSTOM CONF SETUP
    ##################################################
    
    # nano /etc/centminmod/custom_config.inc
    
    NGXDYNAMIC_NGXPAGESPEED='y'
    NGINX_PAGESPEED='y'
    
    ##################################################
    #### PAGESPEED VHOST MODIFICATION
    ##################################################
    
    # ngx_pagespeed & ngx_pagespeed handler
    # include /usr/local/nginx/conf/pagespeed.conf;
    # include /usr/local/nginx/conf/pagespeedhandler.conf;
    # include /usr/local/nginx/conf/pagespeedstatslog.conf;
    
    ##################################################
    #### PAGESPEED CONFIGURATION
    ##################################################
    
    https://community.centminmod.com/threads/this-forums-pagespeed-conf.62/
    
    # nano /usr/local/nginx/conf/pagespeed.conf
    
    Quick Edit
    # pscontrol edit
    # pscontrol editstats
    # pscontrol admin
    
    Stats OFF / ON
    # pscontrol statson
    # pscontrol statsoff
    I've been using the below configuration on my offline testing system for a few days without issue.

    I have yet to setup pagespeed statics to see the actual results.


    Code:
    pagespeed on;
    
    #######################################################
    # Purge nginx pagespeed cache
    # https://developers.google.com/speed/pagespeed/module/system#flush_cache
    #######################################################
    pagespeed EnableCachePurge on;
    pagespeed PurgeMethod PURGE;
    
    #######################################################
    # File cache settings
    ######################################
    # needs to exist and be writable by nginx
    
    pagespeed FileCacheSizeKb          1048576;
    pagespeed FileCacheCleanIntervalMs 3600000;
    pagespeed FileCacheInodeLimit      500000;
    
    #######################################################
    # By default, ngx_pagespeed adds an X-PageSpeed header with a value of the version of
    # ngx_pagespeed being used. This directive lets you specify the value to use instead:
    pagespeed XHeaderValue "ngx_pagespeed";
    
    #######################################################
    # let's speed up PageSpeed by storing it in the super duper fast memcached
    # Ensure Memcached server installed http://centminmod.com/memcached.html
    # default install for centmin mod is on port 11211, so localhost:11211 is correct
    # uncomment - remove hash # in front of below 2 lines to enable
    # timeout set at 100 milliseconds
    #  pagespeed MemcachedThreads 1;
    #  pagespeed MemcachedServers "localhost:11211";
    #  pagespeed MemcachedTimeoutUs 100000;
    
    #######################################################
    ## 1.11.33.0 beta save-data
    ######################################
    # https://developers.google.com/speed/pagespeed/module/filter-image-optimize#image-quality
    
    # https://developers.google.com/speed/pagespeed/module/reference-image-optimize#JpegQualityForSaveData
    pagespeed JpegQualityForSaveData 60;
    
    # https://developers.google.com/speed/pagespeed/module/reference-image-optimize#WebpQualityForSaveData
    pagespeed WebpQualityForSaveData 60;
    
    #######################################################
    ## 1.7.30.1 beta defaults
    ######################################
    pagespeed PreserveUrlRelativity on;
    pagespeed MaxCombinedCssBytes -1;
    pagespeed ImageResolutionLimitBytes 16777216;
    pagespeed EnableFilters inline_google_font_css;
    
    #######################################################
    ## 1.6.29.3 beta defaults
    ######################################
    pagespeed AvoidRenamingIntrospectiveJavascript on;
    pagespeed ImageInlineMaxBytes 3072;
    pagespeed CssImageInlineMaxBytes 0;
    pagespeed MaxInlinedPreviewImagesIndex -1;
    pagespeed MinImageSizeLowResolutionBytes 3072;
    
    #######################################################
    ## ngx_pagespeed filters settings below ##
    ######################################
    
     # show half the users an optimized site, half the regular site
     # change UA-XXXXXXXXXX-1 to your GA unique id
     # uncomment - remove hash # in front of below 5 lines to enable
    #  pagespeed RunExperiment on;
    #  pagespeed AnalyticsID UA-XXXXXXXXXX-1;
    #  pagespeed ExperimentVariable 1;
    #  pagespeed ExperimentSpec "id=1;percent=50;level=CoreFilters;enabled=collapse_whitespace,remove_comments;";
    #  pagespeed ExperimentSpec "id=2;percent=50";
     
    # Filter settings
    # filters outlined at https://www.modpagespeed.com/doc/config_filters
    # PageSpeed offers three "levels" to simplify configuration: PassThrough, CoreFilters, and OptimizeForBandwidth. The CoreFilters set contains filters that the PageSpeed
    # team believes are safe for most web sites. By using the CoreFilters set, as PageSpeed is updated with new filters, your site will get faster. The OptimizeForBandwidth
    # setting provides a stronger guarantee of safety and is suitable as a default setting for use with sites that are not aware of PageSpeed.
    pagespeed RewriteLevel PassThrough;
    pagespeed EnableFilters collapse_whitespace,remove_comments;
    
    # make_google_analytics_async
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-make-google-analytics-async
    #  pagespeed EnableFilters make_google_analytics_async;
    
    # make_show_ads_async
    # https://developers.google.com/speed/pagespeed/module/filter-make-show-ads-async
    #  pagespeed EnableFilters make_show_ads_async;
    
    # responsive_images, responsive_images_zoom
    # https://developers.google.com/speed/pagespeed/module/filter-image-responsive
    pagespeed EnableFilters responsive_images,resize_images;
    pagespeed EnableFilters responsive_images_zoom;
    
    # convert_to_webp_animated
    # https://developers.google.com/speed/pagespeed/module/filter-image-optimize#convert_to_webp_animated
    pagespeed EnableFilters convert_to_webp_animated;
    
    # inline_google_font_css
    # https://developers.google.com/speed/pagespeed/module/filter-css-inline-google-fonts
    # pagespeed EnableFilters inline_google_font_css;
    # require FetchHttps if using https site
    pagespeed FetchHttps enable;
    
    # inline_css
    # https://developers.google.com/speed/pagespeed/module/filter-css-inline
    pagespeed EnableFilters inline_css;
    pagespeed CssInlineMaxBytes 2048;
    
    # prioritize_critical_css
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-prioritize-critical-css
    # pagespeed EnableFilters prioritize_critical_css;
    
    # move_css_to_head
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-css-to-head
    pagespeed EnableFilters move_css_to_head;
    
    # move_css_above_scripts
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-css-above-scripts
    # pagespeed EnableFilters move_css_above_scripts;
    
    # combine_css
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-css-combine
    pagespeed EnableFilters combine_css;
    
    # Uncomment this if you want to prevent mod_pagespeed from combining files
    # (e.g. CSS files) across paths
    #
    pagespeed CombineAcrossPaths off;
    
    # combine_javascript
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-js-combine
    pagespeed EnableFilters combine_javascript;
    pagespeed MaxCombinedJsBytes 122900;
    
    # extend_cache
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-cache-extend
    pagespeed EnableFilters extend_cache;
    
    # rewrite_css
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-css-rewrite
    pagespeed EnableFilters rewrite_css;
    
    # rewrite_javascript
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-js-minify
    pagespeed EnableFilters rewrite_javascript;
    
    # inline_preview_images
    # https://developers.google.com/speed/pagespeed/module/filter-inline-preview-images
    pagespeed EnableFilters inline_preview_images;
    
    # lazyload_images
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-lazyload-images
    pagespeed EnableFilters lazyload_images;
    
    # rewrite_images
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-image-optimize
    pagespeed EnableFilters rewrite_images;
    pagespeed EnableFilters convert_jpeg_to_progressive;
    pagespeed EnableFilters convert_jpeg_to_webp;
    pagespeed EnableFilters convert_to_webp_lossless;
    pagespeed EnableFilters inline_images;
    pagespeed EnableFilters recompress_images;
    pagespeed EnableFilters extend_cache_images;
    
    # sprite_images
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-image-sprite
    # pagespeed EnableFilters rewrite_css,sprite_images;
    
    # insert_dns_prefetch
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-insert-dns-prefetch
    pagespeed EnableFilters insert_dns_prefetch;
    
    # InPlaceResourceOptimization
    # https://developers.google.com/speed/pagespeed/module/system#ipro
    # Enabled by default as of 1.9.32.1
    pagespeed InPlaceResourceOptimization off;
    
    pagespeed LoadFromFile "https://<domain.com>//public/" "/home/nginx/domains/<domain.com>/public/";
    pagespeed LoadFromFile "https://<domain.com>//uploads/" "/home/nginx/domains/<domain.com>/uploads/";
    pagespeed LoadFromFile "https://<domain.com>//datastore/" "/home/nginx/domains/<domain.com>/datastore/";
    
    pagespeed Disallow     "https://<domain.com>//<renamed-admin-directory>/*";
    pagespeed Disallow     "https://example.org/*do=quote*";
    pagespeed Disallow     "https://example.org/page/index.html";
    
    #######################################################

     
    Last edited: Mar 5, 2018
  2. pamamolf

    pamamolf Premium Member Premium Member

    3,861
    379
    83
    May 31, 2014
    Ratings:
    +731
    Local Time:
    9:41 PM
    Nginx-1.17.x
    MariaDB 10.3.x
    @Jimmy
    I just test it today and it seems to work with no issues for me :)

    But i think it misses a .png optimizations as Google's pagespeed site reports ... :(

    Also i want to ask if the double back slash needed at the end of the config like:

    so it should be like
    or
     
    Last edited: Mar 11, 2018
  3. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    Double slashes were just a mess-up when I removed my names from the doc.

    Sound be the second one.

    Code:
    pagespeed LoadFromFile "https://mydomain.com/public/" "/home/nginx/domains/mydomain.com/public/";
     
  4. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    @eva2000 do you know if having multiple LoadFromFile for the different domains on CMM will work or is the correct way of doing things? I read that LoadFromFile won't work on pagespeed domain specific configurations, only works in the main pagespeed file.

    Code:
    # DOMAIN 1
    pagespeed LoadFromFile "https://domain1.com/public/" "/home/nginx/domains/domain1.com/public/";
    pagespeed LoadFromFile "https://domain1.com/uploads/" "/home/nginx/domains/domain1.com/uploads/";
    pagespeed LoadFromFile "https://domain1.com/datastore/" "/home/nginx/domains/domain1.com/datastore/";
    
    # DOMAIN 2
    pagespeed LoadFromFile "https://domain2.com/public/" "/home/nginx/domains/domain2.com/public/";
    pagespeed LoadFromFile "https://domain2.com/uploads/" "/home/nginx/domains/domain2.com/uploads/";
    pagespeed LoadFromFile "https://domain2.com/datastore/" "/home/nginx/domains/domain2.com/datastore/";
    
    # DOMAIN 3
    pagespeed LoadFromFile "https://domain3.com/public/" "/home/nginx/domains/domain3.com/public/";
    pagespeed LoadFromFile "https://domain3.com/uploads/" "/home/nginx/domains/domain3.com/uploads/";
    pagespeed LoadFromFile "https://domain3.com/datastore/" "/home/nginx/domains/domain3.com/datastore/";
     
  5. eva2000

    eva2000 Administrator Staff Member

    45,468
    10,319
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +16,005
    Local Time:
    5:41 AM
    Nginx 1.19.x
    MariaDB 5.5/10.x
    should work fine if you allow each domain first which is what you're meant to do
    Code (Text):
    pagespeed Domain https://domain1.com;
    pagespeed Domain https://domain2.com;
    pagespeed Domain https://domain3.com;
    
     
  6. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    Thanks!
     
  7. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    Something like below, or do I need to stack the three first before the LoadFromFile(s)?

    Code:
    # DOMAIN 1
    pagespeed Domain https://domain1.com;
    pagespeed LoadFromFile "https://domain1.com/public/" "/home/nginx/domains/domain1.com/public/";
    pagespeed LoadFromFile "https://domain1.com/uploads/" "/home/nginx/domains/domain1.com/uploads/";
    pagespeed LoadFromFile "https://domain1.com/datastore/" "/home/nginx/domains/domain1.com/datastore/";
    
    # DOMAIN 2
    pagespeed Domain https://domain2.com;
    pagespeed LoadFromFile "https://domain2.com/public/" "/home/nginx/domains/domain2.com/public/";
    pagespeed LoadFromFile "https://domain2.com/uploads/" "/home/nginx/domains/domain2.com/uploads/";
    pagespeed LoadFromFile "https://domain2.com/datastore/" "/home/nginx/domains/domain2.com/datastore/";
    
    # DOMAIN 3
    pagespeed Domain https://domain3.com;
    pagespeed LoadFromFile "https://domain3.com/public/" "/home/nginx/domains/domain3.com/public/";
    pagespeed LoadFromFile "https://domain3.com/uploads/" "/home/nginx/domains/domain3.com/uploads/";
    pagespeed LoadFromFile "https://domain3.com/datastore/" "/home/nginx/domains/domain3.com/datastore/";
     
  8. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    From what I'm reading, the only filter available for png is "convert_png_to_jpeg". PNG files are large, but they also contain an optional transparency layer. If I convert png files to jpeg which has no transparency, that could cause an issue.

    There is convert_gif_to_png, recompress_png. that can be used.

    Not sure I'm interested in either. I personally don't want the gifs converted. I see limited information about recompress_png. Unless there was a huge savings in re-compressing them, I'd skip this one too. Still looking for some information on recompress_png.
     
    Last edited: Mar 12, 2018
  9. pamamolf

    pamamolf Premium Member Premium Member

    3,861
    379
    83
    May 31, 2014
    Ratings:
    +731
    Local Time:
    9:41 PM
    Nginx-1.17.x
    MariaDB 10.3.x
    Yes i am talking about compressing png as it will save a huge amount of data....

    Or maybe something like this?
     
    Last edited: Mar 12, 2018
  10. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    Most of those are already in the file:

    Code:
    # rewrite_images
    # https://developers.google.com/speed/docs/mod_pagespeed/filter-image-optimize
    pagespeed EnableFilters rewrite_images;
    pagespeed EnableFilters convert_jpeg_to_progressive;
    pagespeed EnableFilters convert_jpeg_to_webp;
    pagespeed EnableFilters convert_to_webp_lossless;
    pagespeed EnableFilters inline_images;
    pagespeed EnableFilters recompress_images;
    pagespeed EnableFilters extend_cache_images;
    I'll have to look over this section more. Not sure if I want the convert_jpeg_to_progressive then convert_jpeg_to_webp, not sure if there is any benefit converting it to progressive and than webp.
     
  11. pamamolf

    pamamolf Premium Member Premium Member

    3,861
    379
    83
    May 31, 2014
    Ratings:
    +731
    Local Time:
    9:41 PM
    Nginx-1.17.x
    MariaDB 10.3.x
    I post the above most for the:
     
  12. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    I want to make one separate note. When I was running this on my demo box something wasn't right. In my conf file I have:

    Code:
    # By default, ngx_pagespeed adds an X-PageSpeed header with a value of the version of
    # ngx_pagespeed being used. This directive lets you specify the value to use instead:
    pagespeed XHeaderValue "show_something_different_please";
    When I check, it still shows the default data = ngx_pagespeed.

    Made me think that the config wasn't sticking for some reason. I should be able to curl and get that returned.
     
  13. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    You can add that if you want. I don't want it to flatten PNGs, because I have a lot of transparent PNGs. Those are going to look horrible if they're converted to jpeg and the conversion grabs white / black for the areas where the transparency was.
     
  14. pamamolf

    pamamolf Premium Member Premium Member

    3,861
    379
    83
    May 31, 2014
    Ratings:
    +731
    Local Time:
    9:41 PM
    Nginx-1.17.x
    MariaDB 10.3.x
    Then we must found a way to compress png without loosing the transparency....

    Png files can be compressed a lot !
     
  15. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    Give it a try. Upload a few with transparent backgrounds and see how pagespeed handles them.
     
  16. pamamolf

    pamamolf Premium Member Premium Member

    3,861
    379
    83
    May 31, 2014
    Ratings:
    +731
    Local Time:
    9:41 PM
    Nginx-1.17.x
    MariaDB 10.3.x
    Pagespeed seems to know when an image has transparent pixels and so it will not optimize it but if it's not it will:
    Image Filter and Option Reference
     
  17. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    You can go with the filter groups if you want:
    Code:
    # Recompress Images Group
    # This is a filter group consisting of convert_gif_to_png, convert_jpeg_to_progressive, convert_jpeg_to_webp, convert_png_to_jpeg,
    # jpeg_subsampling, recompress_jpeg, recompress_png, recompress_webp, strip_image_color_profile, and strip_image_meta_data.
    pagespeed EnableFilters recompress_images;
    
    # Rewrite Images Group
    # This is a filter group that includes inline_images, recompress_images, convert_to_webp_lossless, and resize_images.
    pagespeed EnableFilters rewrite_images;
    I might just go with these because it's easy. If I start having an issue, I can tweak from there.
     
  18. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    Having a cdn doesn't make this any more easy.
     
  19. Jimmy

    Jimmy Well-Known Member

    1,706
    365
    83
    Oct 24, 2015
    East Coast USA
    Ratings:
    +923
    Local Time:
    3:41 PM
    1.17.x
    MariaDB 10.3.x
    Anyone have any insight on how I should setup pulling /uploads/ folder from a CDN and the rest of the files from the site?
     
  20. eva2000

    eva2000 Administrator Staff Member

    45,468
    10,319
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +16,005
    Local Time:
    5:41 AM
    Nginx 1.19.x
    MariaDB 5.5/10.x
    yup

    nice read Nginx PageSpeed - If I'll try to use CDN

    basically
    Code (Text):
    pagespeed Domain cdn.example.com;
    pagespeed LoadFromFile "https://cdn.example.com" "/home/nginx/domains/example.com/public";