10 шагов к ускорению сайта
Post on 13-Aug-2015
495 Views
Preview:
TRANSCRIPT
10 шагов к быстрому сайту
Мациевский НиколайWEBO Group, Айри.рф
Партнерская конференция «1С-Битрикс»
Ваш спецназ для ускорения сайта
• Измеряем реальную скорость и проблемные зоны
• Оптимизируем и мониторим серверные задержки
• Тратим 5 минут на сжатие и кэширование
• Оптимизируем изображения: с потерями или без
• Оптимизируем шрифты, стили и скрипты
• Откладываем загрузку картинок и виджетов
| ПАРТНЕРСКАЯ КОНФЕРЕНЦИЯ
Мониторинг скорости
• Какая медиана времени ответа сервера?
• Где и когда тормозит сервер?
• CPU (MySQL | PHP), I/O (disk), RAM (Memcached)
• Что тормозит на клиенте?
• KPI: 80% загрузок сайта до 2 секунд
• Решения: New Relic, Яндекс.Метрика, mPulse,
Pingdom, Айри.рф, …
| ПАРТНЕРСКАЯ КОНФЕРЕНЦИЯ
Серверная оптимизация
• Nginx + (php-fpm | cgi | nodejs)
• Opcode: APC, eAccelerator, Zend Optimizer
• Memcached
• MySQL: кэши
• Проверить время сброса кэшей
• 99% серверных задержек не более 200 мс
| ПАРТНЕРСКАЯ КОНФЕРЕНЦИЯ
Сжатие на сервере
• Nginx: gzip on; gzip_level 7;
• Nginx: expires max;
• Nginx: gzip_static;
• Zopfli: на 5% лучше gzip 9
• Методика: zopfli -> gzip_static -> gzip
| ПАРТНЕРСКАЯ КОНФЕРЕНЦИЯ
JPEG, GIF, BMP, PNG, WEBP
• Без потерь качества:
• JPEG: ExifTool, mozjpeg / jpegtran
• GIF, BMP, PNG: pngcrush, optipng, TruePNG,
zopfliPNG
• С потерями качества:
• Pngnq, ImageMagick, TruePNG
• WebP, поддержка 65%:
• На 15% меньше PNG и JPEG
| ПАРТНЕРСКАЯ КОНФЕРЕНЦИЯ
Шрифты, стили, скрипты
• Шрифты: fontforge (woff) +
subset.py + gzip + fontsquirrel
• Выигрыш: до 10 раз
• Стили: YUI Compressor / CSS Tidy
• Скрипты: Google Compiler / YUI
Compressor
• HTML: htmlcompressor
| ПАРТНЕРСКАЯ КОНФЕРЕНЦИЯ
LazyLoad, post-load, pre-load
• LazyLoad: при скролле или после загрузки
• Загрузка виджетов и счетчиков по событию
onload
• Navigation Timing API / Navigation User API для
измерения
| ПАРТНЕРСКАЯ КОНФЕРЕНЦИЯ
top related