/ Register

Want to subscribe to topics you're interested in?
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.

Tags:
Previous Thread Next Thread
Loading...
Page 2 of 3
  1. Oct 8, 2017 #21
    kinhatula

    kinhatula New Member

    9
    2
    3
    Sep 6, 2017
    Ratings:
    +2
    Local Time:
    8:34 PM
    sorry, can I ask you a question? where is add this code into file domain.com.ssl.conf or domain.com.conf ?

    location /webp {
    #pagespeed off;
    autoindex on;
    add_header X-Robots-Tag "noindex, nofollow";
    location ~* ^/webp/.+\.(png|jpe?g)$ {
    expires 30d;
    add_header Vary "Accept-Encoding";
    add_header Cache-Control "public, no-transform";
    try_files $uri$webp_extension $uri =404;
    }
    }
     
  2. Oct 8, 2017 #22
    eva2000

    eva2000 Administrator Staff Member

    58,895
    12,490
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +19,122
    Local Time:
    11:34 PM
    Nginx 1.31.x
    MariaDB 10.x/11.4+/12.3+
  3. Oct 8, 2017 #23
    kinhatula

    kinhatula New Member

    9
    2
    3
    Sep 6, 2017
    Ratings:
    +2
    Local Time:
    8:34 PM
    thanks eva2000
     
  4. Oct 18, 2017 #24
    dcg

    dcg Member

    67
    24
    8
    Oct 17, 2015
    Florida, USA
    Ratings:
    +49
    Local Time:
    9:34 AM
    1.21.x
    10.3.x
    FYI

    Mozjpeg needs a tar zxf after source download for installing.
    Code:
    echo "installing mozjpeg"
  cd /usr/src
  wget https://github.com/mozilla/mozjpeg/releases/download/v3.2-pre/mozjpeg-3.2-release-source.tar.gz
#need tar zxf of source to which extracts to mozjpeg
  cd mozjpeg
  ./configure
  make -s
  make -s install
  MOZJPEG_BIN='/opt/mozjpeg/bin/jpegtran'
  echo "installed mozjpeg"
    optimise-images/optimise-images.sh at master · centminmod/optimise-images · GitHub
     
  5. Oct 18, 2017 #25
    eva2000

    eva2000 Administrator Staff Member

    58,895
    12,490
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +19,122
    Local Time:
    11:34 PM
    Nginx 1.31.x
    MariaDB 10.x/11.4+/12.3+
    thanks @dcg for the heads up :)
     
  6. Mar 3, 2018 #26
    Revenge

    Revenge Active Member

    469
    93
    28
    Feb 21, 2016
    Portugal
    Ratings:
    +354
    Local Time:
    2:34 PM
    1.9.x
    10.1.x
  7. Mar 3, 2018 #27
    eva2000

    eva2000 Administrator Staff Member

    58,895
    12,490
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +19,122
    Local Time:
    11:34 PM
    Nginx 1.31.x
    MariaDB 10.x/11.4+/12.3+
  8. Mar 3, 2018 #28
    pamamolf

    pamamolf Well-Known Member

    4,125
    429
    83
    May 31, 2014
    Ratings:
    +841
    Local Time:
    4:34 PM
    Nginx-1.29.x
    MariaDB 10.6.x
    @Revenge

    Is this something you can enable at IPB or a plugin is needed ?
     
  9. Mar 3, 2018 #29
    pamamolf

    pamamolf Well-Known Member

    4,125
    429
    83
    May 31, 2014
    Ratings:
    +841
    Local Time:
    4:34 PM
    Nginx-1.29.x
    MariaDB 10.6.x
    @eva2000

    Need some help on this please :)

    I was check the documentation and i am ready to try it with my target to be:

    1)Run and optimize only jpg images with the option to do lossless optimization and then with the option at 90% to keep quality - (the files must keep the original names so they still working after optimization and no other files must be created)

    I think jpegoptim will be ok for my case.....

    2)
    Run and optimize only png images with the option to do lossless optimization and then with the option at 90% to keep quality - (the files must keep the original names so they still working after optimization and no other files must be created)

    I think optipng will be ok for my case.....

    Can you please help me on what i must edit to archive the above scenarios?
    Thank you
     
  10. Mar 3, 2018 #30
    eva2000

    eva2000 Administrator Staff Member

    58,895
    12,490
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +19,122
    Local Time:
    11:34 PM
    Nginx 1.31.x
    MariaDB 10.x/11.4+/12.3+
    for GitHub - centminmod/optimise-images: Batch image resizer, optimiser and profiler using ImageMagick convert, OptiPNG, JpegOptim and optional ZopfliPNG, Guetzli and MozJPEG., best way to figure out what you need is practice on a test directory of a few images. If you don't have images to test, you can use benchmark-mode to test a preset number of images and just edit options and retest each time optimise-images/benchmark-mode.md at master · centminmod/optimise-images · GitHub

    the default options are explained and listed at GitHub - centminmod/optimise-images: Batch image resizer, optimiser and profiler using ImageMagick convert, OptiPNG, JpegOptim and optional ZopfliPNG, Guetzli and MozJPEG. pay attention to PNG image quality it's value doesn't mean some thing as JPG = PNG 92 = png:compression-level=9 and png:compression-strategy=2 so leave as is it isn't percentage value

    Also script itself has comments explaining options optimise-images/optimise-images.sh at master · centminmod/optimise-images · GitHub

    so if you only want to optimize without resizing at jpg = 90% then
    Code (Text):
    IMAGICK_RESIZE='n'
IMAGICK_QUALITY='90'

    with resize for images only over 2048x2048
    Code (Text):
    IMAGICK_RESIZE='y'
IMAGICK_QUALITY='90'


    Also you may want to enable ADD_COMMENT='y' to skip previously optimised images optimise-images/skip-optimised-images-180817.md at master · centminmod/optimise-images · GitHub
     
  11. Mar 3, 2018 #31
    pamamolf

    pamamolf Well-Known Member

    4,125
    429
    83
    May 31, 2014
    Ratings:
    +841
    Local Time:
    4:34 PM
    Nginx-1.29.x
    MariaDB 10.6.x
    But that will offer Imagick optimization correct?

    Isn't better to use Jpegoptim? If yes how can i disable Imagick ?

    Thank you
     
  12. Mar 3, 2018 #32
    eva2000

    eva2000 Administrator Staff Member

    58,895
    12,490
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +19,122
    Local Time:
    11:34 PM
    Nginx 1.31.x
    MariaDB 10.x/11.4+/12.3+
    Jpegoptim uses IMAGICK_QUALITY for quality value too as ImageMagick does resize and quality first and then passes it to Jpegoptim for further optimisation

    example for one image optimise-images/benchmark-mode.md at master · centminmod/optimise-images · GitHub

    Code (Text):
    ### dslr_canon_eos_77d_1.jpg (jpg) ###
/usr/bin/convert -define registry:temporary-path=/home/imagicktmp dslr_canon_eos_77d_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 -resize 2048x2048\> dslr_canon_eos_77d_1.jpg

jpegoptim -p --max=82 dslr_canon_eos_77d_1.jpg
dslr_canon_eos_77d_1.jpg 2048x1365 24bit N JFIF  [OK] 388216 --> 388147 bytes (0.02%), optimized.

    Not much savings as you can probably just set JPEGOPTIM='n' and let ImageMagick do the optimisation

    difference in completion time in benchmark mode for JPEGOPTIM enabled (default) vs disabled

    default JPEGOPTIM='y'
    Code (Text):
    ./optimise-images.sh bench

------------------------------------------------------------------------------
Benchmarked Completeion Time: 38.54 seconds
------------------------------------------------------------------------------

    disabled JPEGOPTIM='n'
    Code (Text):
    ./optimise-images.sh bench

Benchmarked Completeion Time: 39.32 seconds

    taking into account variance between runs not much difference

    but JPEGOPTIM='y' needs to be enabled if you set no resize as that is what is used to optimise image - this would be a bug i should force JPEGOPTIM='y' when IMAGICK_RESIZE='n' is set
     
    Last edited: Mar 3, 2018
  13. Mar 3, 2018 #33
    Revenge

    Revenge Active Member

    469
    93
    28
    Feb 21, 2016
    Portugal
    Ratings:
    +354
    Local Time:
    2:34 PM
    1.9.x
    10.1.x
    Currently they gfycat is supported by default. You don't need to do nothing.
    Imgur they needed to remove the support for now.

    Im using a plugin where i can manually add more.
     
  14. Mar 3, 2018 #34
    pamamolf

    pamamolf Well-Known Member

    4,125
    429
    83
    May 31, 2014
    Ratings:
    +841
    Local Time:
    4:34 PM
    Nginx-1.29.x
    MariaDB 10.6.x
    For lossless can i use it as:
    ?
     
  15. Mar 3, 2018 #35
    eva2000

    eva2000 Administrator Staff Member

    58,895
    12,490
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +19,122
    Local Time:
    11:34 PM
    Nginx 1.31.x
    MariaDB 10.x/11.4+/12.3+
    lossless != 100% quality for jpg at least close but not the same

    optimise-images.sh doesn't do lossless at the moment for JPG and PNG other than WebP conversions via IMAGICK_WEBPLOSSLESS='n' but loss WebP images can actually be larger than original JPG/PNG image it was converted from so lossless WebP is disabled by default.

    lossless for web based served graphics is useless and just wastes space and bandwidth. Visitors aren't going to notice a difference between 80-90% JPG or PNG optimised for the web versus lossless image.
     
  16. Mar 3, 2018 #36
    pamamolf

    pamamolf Well-Known Member

    4,125
    429
    83
    May 31, 2014
    Ratings:
    +841
    Local Time:
    4:34 PM
    Nginx-1.29.x
    MariaDB 10.6.x
    Is the "install" parameter the first one to use before i use the "optimise" parameter?
     
  17. Mar 3, 2018 #37
    eva2000

    eva2000 Administrator Staff Member

    58,895
    12,490
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +19,122
    Local Time:
    11:34 PM
    Nginx 1.31.x
    MariaDB 10.x/11.4+/12.3+
    install is only if you want source compile ImageMagick7, guetzli, mozjpeg and butteraugli. ImageMagick7 is alot slower than ImageMagick6 so not needed.
     
  18. Mar 3, 2018 #38
    pamamolf

    pamamolf Well-Known Member

    4,125
    429
    83
    May 31, 2014
    Ratings:
    +841
    Local Time:
    4:34 PM
    Nginx-1.29.x
    MariaDB 10.6.x
    Ok all good ! :)

    The only one that the script needs is the working on sub directories .....the current solution is not the easier one.....

    Using optipng and jpegoptim i was able to archive that by:
    Can't be done something like this on the script so we will have it ready to optimize also sub directories?
     
  19. Mar 3, 2018 #39
    eva2000

    eva2000 Administrator Staff Member

    58,895
    12,490
    113
    May 24, 2014
    Brisbane, Australia
    Ratings:
    +19,122
    Local Time:
    11:34 PM
    Nginx 1.31.x
    MariaDB 10.x/11.4+/12.3+
    actually pretty much similar but only way right now GitHub - centminmod/optimise-images: Batch image resizer, optimiser and profiler using ImageMagick convert, OptiPNG, JpegOptim and optional ZopfliPNG, Guetzli and MozJPEG.
     
  20. Apr 24, 2018 #40
    sannin

    sannin New Member

    14
    0
    1
    Jul 25, 2014
    Ratings:
    +1
    Local Time:
    11:34 PM
    1.7.3
    MariaDB 10
    Hey thanx for this script!

    Many times i have seen people upload images with capitalized extension, for example "pic1.JPG" . You could use "-iname" in find command to include those images too.
     
Previous Thread Next Thread
Loading...
Page 2 of 3

.