Google Pagespeed: Як задовольнити нові правила стиснення зображення?

У нас є кілька сторінок з хорошими значеннями Pageseeded - навіть ті, які мають 100/100. Однак через кілька днів Pagespeed стверджує на всіх сайтах (технічно різні, різні сервери), що наші зображення можуть бути оптимізованішими.

Хтось знає, що саме було змінено алгоритмом? На одному з PS 100/100 (раніше) ми використовуємо jpegoptim, тому ми не знаємо, як далі оптимізувати. Зображення завантажуються нашою програмою та потім оптимізуються.

Будь-яке розуміння буде вдячне. Чи є десь журнал змін для PS?

Раніше я бачу ті самі непривабливі результати для сторінок без будь-яких проблем, звичайно, використовуючи чуйні рамки, як ZURB Foundation, із чуйними зображеннями.

Раніше я використовував:

find . -iname "*.jpg" -exec jpegoptim --strip-all -o -p {} \;

і отримали чудові результати.

Рішення січня 2017 року: 85% якості повинно зробити трюк:

find . -iname "*.jpg" -exec jpegoptim --strip-all -m85 -o -p {} \;

Повернення до 100/100 на швидкості сторінки Google.

Ось частина мого методу розгортання gulp / npm для ZURB Foundation 6

// Copy images to the "dist" folder
// In production, the images are compressed
function images() {
  return gulp.src('src/assets/img/**/*')
    .pipe($.if(PRODUCTION, imagemin(
      [
        imagemin.gifsicle({interlaced: true}),
        imageminJpegoptim({
          max: 85,
          progressive: true
        }),
        imagemin.optipng({optimizationLevel: 5}),
        imagemin.svgo({plugins: [{cleanupIDs: false, removeEmptyAttrs: false, removeViewBox: false}]})
      ],
      {
      },
      {
        verbose: true
      }
    )))
    .pipe(gulp.dest(PATHS.dist + '/assets/img'));
}

Вам потрібно додати npm-модулі gulp-imagemin imagemin-jpegoptim

var imagemin = require('gulp-imagemin');
const imageminJpegoptim = require('imagemin-jpegoptim');

Ви також можете помітити повідомлення: " Завантажте оптимізовані зображення, JavaScript та CSS-ресурси для цієї сторінки ". Вони зробили роботу для вас, якщо у вас виникли проблеми з оптимізацією, яку очікує Google. Іноді різні інструменти не можуть бути такими маленькими, як хоче Google.

Остання рекомендація від Google - використовувати Imagemagick converter :

convert INPUT.jpg -sampling-factor 4:2:0 -strip [-resize WxH] [-quality N] [-interlace JPEG] [-colorspace Gray/sRGB] OUTPUT.jpg

з конкретним прикладом puzzle.jpg

convert puzzle.jpg -sampling-factor 4:2:0 -strip -quality 85 -interlace JPEG -colorspace sRGB puzzle_converted.jpg

використовуючи ті самі аргументи на власних зображеннях, я отримав ті ж результати, що й завантажений оптимізований файл JPG.