Gulp Bildoptimierer (gulp-imagemin) nicht vollständig optimieren

Question

Ich benutze Schluck, um meine Arbeit zu kompilieren, Kürzlich benutze ich gulp-imagemin Plugin, um die Bilder zu optimieren, und es funktioniert immer noch nicht vollständig zu optimieren.Auf Google PageSpeed ​​Insights zeigt Die Bilder sind nicht vollständig zu optimieren. Wie kann ich meine Bilder optimieren? Bitte helfen Sie. Dies ist die Funktion, die ich auf meinem gulpfile.js verwende, und es reduziert etwa 2-5% Bildergröße.Aber nicht vollständig zu optimieren.

gulp.task('imgs', function() { 
    gulp 
     .src(paths.assets.images) 
     .pipe(imagemin({ 
      progressive: true, 
      interlaced: true, 
      pngquant: true 
     })) 
     .pipe(flatten()) 
     .pipe(gulp.dest(paths.build + "/img")); 
}); 

Hier ist der Screenshot, wo Google PageSpeed ​​Insights Bilder zeigen nicht optimieren.

Answer 1

Dieser arbeitet viel besser ..

gulp.task('imgs', function() { 
    gulp 
     .src(paths.assets.images) 
     .pipe(cache(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true }))) 
     .pipe(flatten()) 
     .pipe(gulp.dest(paths.build + "/images")); 
}); 

Answer 2

Ich habe mit dem gleichen Problem konfrontiert gerade und ich beschloß, aus dem Standard-imagemin-jpegtran zu einer imageminMozjpeg Plugin zu bewegen.

Zuerst müssen Sie imagemin-mozjpeg installieren:

npm install --save imagemin-mozjpeg

Dann fügen Sie diese Zeile in Ihre gulpfile.js:

var imageminMozjpeg = require('imagemin-mozjpeg');

Und leicht den Code ändern, in dem Sie die verrohrt imagemin Werkzeug

.pipe(imagemin(
    [imageminMozjpeg()], 
    {verbose: true}   // Enabling this will log info on every image passed to gulp-imagemin 
)) 

Es entfernt auch Bilder Metadaten. Das Ergebnis ist erstaunlich: gulp-imagemin working process log