Learn about Centmin Mod LEMP Stack today
Become a Member

WebPerf Optimizing Image Sizes for faster page load times with optimise-images.sh

Discussion in 'Web Development & Web Performance' started by eva2000, Apr 29, 2017.

  1. eva2000

    eva2000 Administrator Staff Member

    50,928
    11,808
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,267
    Local Time:
    2:18 AM
    Nginx 1.25.x
    MariaDB 10.x
    You're welcome. Ah yes case insensitive matches ! Thanks

     
  2. fabianski

    fabianski Member

    102
    14
    18
    Feb 20, 2019
    Ratings:
    +36
    Local Time:
    1:18 PM
    Is single image optimization not supported?

    I'm using the plugin shor0814/image-optimiser-plugin to optimize the new images that are sent in wordpress.

    The plugin tries to do automatic optimization using the direct path to the image but this apparently does not work

    Code:
    $scriptlocation = "/usr/sbin";
    $scriptname = "optimise-images-plugin.sh";
    ...
    
    $outname = $scriptlocation.$scriptname." optimise ".$file;
    ....
    I did a test to optimize a single image directly by ssh did not work either

    Code:
    /usr/sbin/optimise-images.sh optimise /home/nginx/domains/domain.org/public/wp-content/uploads/2019/06//image.jpg
    No results are reported when I ran this command...
     
  3. eva2000

    eva2000 Administrator Staff Member

    50,928
    11,808
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,267
    Local Time:
    2:18 AM
    Nginx 1.25.x
    MariaDB 10.x
    wrong thread then, you're using a fork of my optimise-images.sh created by @ShawnH so best to ask in Wordpress - Optimise Images modification and plugin

    but for my optimise-image.sh yes single image isn't supported only directory level
     
  4. fabianski

    fabianski Member

    102
    14
    18
    Feb 20, 2019
    Ratings:
    +36
    Local Time:
    1:18 PM
  5. elargento

    elargento Member

    352
    17
    18
    Jan 4, 2016
    Ratings:
    +44
    Local Time:
    1:18 PM
    10
    Why mkdir -p /home/nginx/domains/domain.com/public/images is needed? is it a temporary folder?
     
  6. eva2000

    eva2000 Administrator Staff Member

    50,928
    11,808
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,267
    Local Time:
    2:18 AM
    Nginx 1.25.x
    MariaDB 10.x
    where's this comming from ?
     
  7. elargento

    elargento Member

    352
    17
    18
    Jan 4, 2016
    Ratings:
    +44
    Local Time:
    1:18 PM
    10
    upload_2019-7-3_1-0-26.png
    I don't understand if this folder is used for temporary files or if the up

    I mean, how can I optimize the images on several subfolders by overwriting the old ones with the new optimized images?
     
  8. eva2000

    eva2000 Administrator Staff Member

    50,928
    11,808
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,267
    Local Time:
    2:18 AM
    Nginx 1.25.x
    MariaDB 10.x
    that's an example, meaning I created that directory to test images in that directory for my example

    see instructions at Unattended Subdirectory Runs
     
  9. Mak Adang

    Mak Adang Member

    62
    20
    8
    Jan 4, 2015
    Ratings:
    +23
    Local Time:
    11:18 PM
    1.9.0
    10.0.18-MariaDB
  10. eva2000

    eva2000 Administrator Staff Member

    50,928
    11,808
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,267
    Local Time:
    2:18 AM
    Nginx 1.25.x
    MariaDB 10.x
  11. elargento

    elargento Member

    352
    17
    18
    Jan 4, 2016
    Ratings:
    +44
    Local Time:
    1:18 PM
    10
    Eva, what does ./optimise-images.sh {install} do?
     
  12. eva2000

    eva2000 Administrator Staff Member

    50,928
    11,808
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,267
    Local Time:
    2:18 AM
    Nginx 1.25.x
    MariaDB 10.x
    Updated April 5, 2020: optimise-images.sh with basic Dockerfile support which was contributed by developer from Upcloud via pull request at Add Dockerfile by scop · Pull Request #3 · centminmod/optimise-images. Which means you can technically run optimise-images.sh on non-CentOS systems i.e. via Docker on Ubuntu build a CentOS 7 image.

    How to install and use Docker is left up to end user to learn.

    Build local Dockerfile image
    Code (Text):
    docker build --tag optimise-images:1.0 .
    

    Resulting Docker images
    Code (Text):
    docker images
    REPOSITORY          TAG                 IMAGE ID            CREATED             SIZE
    optimise-images     1.0                 f338939fb838        30 seconds ago      574MB
    centos              7                   5e35e350aded        4 months ago        203MB
    

    Would need to use docker volume to map system directory to docker container image directory if using optimise-images.sh within a docker container.

    So for /home/optimise-benchmarks system directory full of images to profile it, you would run:
    Code (Text):
    docker run --rm -it -v /home/optimise-benchmarks:/home/optimise-benchmarks optimise-images:1.0 optimise-images.sh profile /home/optimise-benchmarks

    To optimise the directory
    Code (Text):
    docker run --rm -it -v /home/optimise-benchmarks:/home/optimise-benchmarks optimise-images:1.0 optimise-images.sh optimise /home/optimise-benchmarks
    

    Profile mode run:
    Code (Text):
    docker run --rm -it -v /home/optimise-benchmarks:/home/optimise-benchmarks optimise-images:1.0 optimise-images.sh profile /home/optimise-benchmarks
    
    ------------------------------------------------------------------------------
    image profile
    image name : width : height : quality : transparency : image depth (bits) : size : user: group
    ------------------------------------------------------------------------------
    images in /home/optimise-benchmarks
    logged at /home/optimise-logs/profile-log-050420-015006.log
    ------------------------------------------------------------------------------
    image : bees.png : 444 : 258 : 92 : False : 8 : 175256 : root : root
    image : dslr_canon_eos_m6_1.jpg : 1200 : 800 : 82 : False : 8 : 161442 : root : root
    image : dslr_nikon_d7200_1.jpg : 2048 : 1365 : 82 : False : 8 : 377126 : root : root
    image : dslr_nikon_d7200_2.jpg : 1365 : 2048 : 82 : False : 8 : 520565 : root : root
    image : png24-image1.png : 600 : 400 : 92 : False : 8 : 386063 : root : root
    image : png24-interlaced-image1.png : 600 : 400 : 92 : False : 8 : 443931 : root : root
    image : samsung_s7_mobile_1.jpg : 2048 : 1536 : 82 : False : 8 : 259901 : root : root
    image : webp-study-source-firebreathing.png : 1024 : 752 : 92 : False : 8 : 1194070 : root : root
    
    ------------------------------------------------------------------------------
    Original or Existing Images:
    ------------------------------------------------------------------------------
    | Avg width | Avg height | Avg quality | Avg size   | Total size (Bytes) | Total size (KB) |
    | --------- | ---------- | ----------- | --------   | ------------------ | --------------- |
    | 1166      | 945        | 87          | 439794     | 3518354            | 3436            |
    
    ------------------------------------------------------------------------------
    ImageMagick Resource Limits
    ------------------------------------------------------------------------------
    Version: ImageMagick 6.9.11-3 Q16 x86_64 2020-03-30
    Resource limits:
      Width: 214.7MP
      Height: 214.7MP
      List length: unlimited
      Area: 3.8543GP
      Memory: 1.79481GiB
      Map: 3.58962GiB
      Disk: unlimited
      File: 786432
      Thread: 2
      Throttle: 0
      Time: unlimited
    ------------------------------------------------------------------------------
    Completion Time: 0.58 seconds
    ------------------------------------------------------------------------------

    Optimise mode run:
    Code (Text):
    docker run --rm -it -v /home/optimise-benchmarks:/home/optimise-benchmarks optimise-images:1.0 optimise-images.sh optimise /home/optimise-benchmarks
    
    !!! Important !!!
    
    Have you made a backup of images in /home/optimise-benchmarks? [y/n]: y
    
    ------------------------------------------------------------------------------
    image optimisation start
    ------------------------------------------------------------------------------
    ### samsung_s7_mobile_1.jpg (jpg) ###
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 /usr/bin/convert -define registry:temporary-path=/home/imagicktmp samsung_s7_mobile_1.jpg -define jpeg:size=4096x4096 -filter triangle -define filter:support=2 -define jpeg:fancy-upsampling=off -unsharp 0.25x0.08+8.3+0.045 -interlace none -strip -set comment optimised -resize 2048x2048\> samsung_s7_mobile_1.jpg
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 jpegoptim -p --max=82 samsung_s7_mobile_1.jpg
    samsung_s7_mobile_1.jpg 2048x1536 24bit N JFIF  [OK] 260188 --> 260142 bytes (0.02%), optimized.
    ### dslr_canon_eos_m6_1.jpg (jpg) ###
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 /usr/bin/convert -define registry:temporary-path=/home/imagicktmp dslr_canon_eos_m6_1.jpg -define jpeg:size=4096x4096 -filter triangle -define filter:support=2 -define jpeg:fancy-upsampling=off -unsharp 0.25x0.08+8.3+0.045 -interlace none -strip -set comment optimised -resize 2048x2048\> dslr_canon_eos_m6_1.jpg
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 jpegoptim -p --max=82 dslr_canon_eos_m6_1.jpg
    dslr_canon_eos_m6_1.jpg 1200x800 24bit N JFIF  [OK] 161453 --> 161388 bytes (0.04%), optimized.
    ### dslr_nikon_d7200_1.jpg (jpg) ###
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 /usr/bin/convert -define registry:temporary-path=/home/imagicktmp dslr_nikon_d7200_1.jpg -define jpeg:size=4096x4096 -filter triangle -define filter:support=2 -define jpeg:fancy-upsampling=off -unsharp 0.25x0.08+8.3+0.045 -interlace none -strip -set comment optimised -resize 2048x2048\> dslr_nikon_d7200_1.jpg
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 jpegoptim -p --max=82 dslr_nikon_d7200_1.jpg
    dslr_nikon_d7200_1.jpg 2048x1365 24bit N JFIF  [OK] 376994 --> 376881 bytes (0.03%), optimized.
    ### dslr_nikon_d7200_2.jpg (jpg) ###
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 /usr/bin/convert -define registry:temporary-path=/home/imagicktmp dslr_nikon_d7200_2.jpg -define jpeg:size=4096x4096 -filter triangle -define filter:support=2 -define jpeg:fancy-upsampling=off -unsharp 0.25x0.08+8.3+0.045 -interlace none -strip -set comment optimised -resize 2048x2048\> dslr_nikon_d7200_2.jpg
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 jpegoptim -p --max=82 dslr_nikon_d7200_2.jpg
    dslr_nikon_d7200_2.jpg 1365x2048 24bit N JFIF  [OK] 520648 --> 520648 bytes (0.00%), skipped.
    ### bees.png (png) ###
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 /usr/bin/convert -define registry:temporary-path=/home/imagicktmp bees.png -interlace none -set comment optimised -define png:compression-filter=5 -define png:compression-level=9 -define png:compression-strategy=2 -resize 2048x2048\> bees.png
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 optipng -o2 bees.png -preserve -out bees.png
    Output IDAT size = 175199 bytes (no change)
    Output file size = 175480 bytes (60 bytes = 0.03% decrease)
    ### webp-study-source-firebreathing.png (png) ###
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 /usr/bin/convert -define registry:temporary-path=/home/imagicktmp webp-study-source-firebreathing.png -interlace none -set comment optimised -define png:compression-filter=5 -define png:compression-level=9 -define png:compression-strategy=2 -resize 2048x2048\> webp-study-source-firebreathing.png
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 optipng -o2 webp-study-source-firebreathing.png -preserve -out webp-study-source-firebreathing.png
    Output IDAT size = 1194013 bytes (5679 bytes decrease)
    Output file size = 1194294 bytes (6111 bytes = 0.51% decrease)
    ### png24-image1.png (png) ###
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 /usr/bin/convert -define registry:temporary-path=/home/imagicktmp png24-image1.png -interlace none -set comment optimised -define png:compression-filter=5 -define png:compression-level=9 -define png:compression-strategy=2 -resize 2048x2048\> png24-image1.png
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 optipng -o2 png24-image1.png -preserve -out png24-image1.png
    Output IDAT size = 386006 bytes (no change)
    Output file size = 386287 bytes (132 bytes = 0.03% decrease)
    ### png24-interlaced-image1.png (png) ###
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 /usr/bin/convert -define registry:temporary-path=/home/imagicktmp png24-interlaced-image1.png -interlace plane -set comment optimised -define png:compression-filter=5 -define png:compression-level=9 -define png:compression-strategy=2 -resize 2048x2048\> png24-interlaced-image1.png
    /bin/nice -n 10 /usr/bin/ionice -c2 -n7 optipng -o2 png24-interlaced-image1.png -preserve -out png24-interlaced-image1.png
    Output IDAT size = 443874 bytes (2304 bytes decrease)
    Output file size = 444155 bytes (2460 bytes = 0.55% decrease)
    ------------------------------------------------------------------------------
    Completion Time: 22.58 seconds
    ------------------------------------------------------------------------------
    
    ------------------------------------------------------------------------------
    image profile
    image name : width : height : quality : transparency : image depth (bits) : size : user: group
    ------------------------------------------------------------------------------
    images in /home/optimise-benchmarks
    logged at /home/optimise-logs/profile-log-050420-020515.log
    ------------------------------------------------------------------------------
    image : bees.png : 444 : 258 : 92 : False : 8 : 175480 : root : root
    image : dslr_canon_eos_m6_1.jpg : 1200 : 800 : 82 : False : 8 : 161388 : root : root
    image : dslr_nikon_d7200_1.jpg : 2048 : 1365 : 82 : False : 8 : 376881 : root : root
    image : dslr_nikon_d7200_2.jpg : 1365 : 2048 : 82 : False : 8 : 520648 : root : root
    image : png24-image1.png : 600 : 400 : 92 : False : 8 : 386287 : root : root
    image : png24-interlaced-image1.png : 600 : 400 : 92 : False : 8 : 444155 : root : root
    image : samsung_s7_mobile_1.jpg : 2048 : 1536 : 82 : False : 8 : 260142 : root : root
    image : webp-study-source-firebreathing.png : 1024 : 752 : 92 : False : 8 : 1194294 : root : root
    
    ------------------------------------------------------------------------------
    Original or Existing Images:
    ------------------------------------------------------------------------------
    | Avg width | Avg height | Avg quality | Avg size   | Total size (Bytes) | Total size (KB) |
    | --------- | ---------- | ----------- | --------   | ------------------ | --------------- |
    | 1166      | 945        | 87          | 439909     | 3519275            | 3437            |
    
    ------------------------------------------------------------------------------
    ImageMagick Resource Limits
    ------------------------------------------------------------------------------
    Version: ImageMagick 6.9.11-3 Q16 x86_64 2020-03-30
    Resource limits:
      Width: 214.7MP
      Height: 214.7MP
      List length: unlimited
      Area: 3.8543GP
      Memory: 1.79481GiB
      Map: 3.58962GiB
      Disk: unlimited
      File: 786432
      Thread: 2
      Throttle: 0
      Time: unlimited
    ------------------------------------------------------------------------------
    Completion Time: 0.59 seconds
    ------------------------------------------------------------------------------
    
     
  13. gabel

    gabel Member

    68
    38
    18
    Jan 7, 2016
    Ratings:
    +64
    Local Time:
    4:18 PM
    1.9.9
    MariaDB 10
    hey @eva2000 quick question, it still doesn't support subdirectories? Was using another tool but would like to use yours since I like your stuff but I have images split in directories/subdirectories so almost impossible doing them 1 by 1
     
  14. eva2000

    eva2000 Administrator Staff Member

    50,928
    11,808
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,267
    Local Time:
    2:18 AM
    Nginx 1.25.x
    MariaDB 10.x
    Yeah it's still one directory at a time so no sub directory support. You can programmatically script it to so subdirectories as outlined at centminmod/optimise-images

    and also example with wordpress script for /upload directory and subdirectories centminmod/optimise-images
     
  15. omrtozd

    omrtozd New Member

    16
    7
    3
    Feb 16, 2021
    Ratings:
    +11
    Local Time:
    7:18 PM
    Is it possible to use this with Amazon S3? I have Amazon S3 plugin on my WordPress website, it stores the images on Amazon S3 and serves images with Cloudflare. I wonder if I can use optimise-images.sh with this setup.
     
  16. eva2000

    eva2000 Administrator Staff Member

    50,928
    11,808
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +18,267
    Local Time:
    2:18 AM
    Nginx 1.25.x
    MariaDB 10.x
    Unfortunately not only local files not remote.