ПРОМЫШЛЕННОЕУСКОРЕНИЕ
САЙТОВ
Мациевский Николай – владелецwww.webogroup.com, айри.рф
С 2007 года ускорено 5 836 сайтовПосещаемость клиентских сайтов: 60М+ в деньСреднее ускорение сайта: 1,6 раза2 книги, 16 наград (Microsoft MVP – 6 лет подряд, Стартап года – 2 раза, WebReady, ROI, Окно в Европу, YEES, Эврика, «Старт», CERPrize, VCDay)
МЕТОДИКИОПТИМИЗАЦИИ
ФРОНТЕНДА
W/Mustaches
Google PageSpeed Insights
WebPageTest.org
Google PageSpeed Module
CDN = Content Delivery Network
Правильное ускорение
Отображение сайта за 1 секунду
МОНИТОРИНГКЛИЕНТСКОЙ
ПРОИЗВОДИТЕЛЬНОСТИ
Google Analytics
Битрикс
NewRelic
mPulse
Айри.рф
Performance Timing API
Resource Timing API
Профилирование задержек
ВНЕДРЕНИЕУСКОРЕНИЯ
Выбор KPI по скорости
Время ответа сервераВремя отрисовкиВремя полной загрузки – 50%Процент загрузок до 4 секунд
KPI скорости сайта
“Бюджет” на ускорение
60% - на проверку гипотез ускорениясогласно ожидаемому эффекту
20% - на тестирование и анализ20% - на внедрение лучших методов
Ускорение в виде “сборки”
Правила сборки файловКонтроль клиентского кэшированияКонтроль целостности серверного кэшаТестирование ускоренной “сборки” сайта
Ускорение “на лету”
mod_pagespeed200+ настроек+50-150мс времени ответа сервераeval() для JavaScriptнестабильная работа при нагрузкесобственная инвалидация кэша
Быстрое ускорение “на лету”
nginx + sub, subs, replace, gzip_static, brotli
gzip, zopfli, brotli, Closure Compiler, YUI Compressor, HTML Compressor
optipng, pngcrush, pngout, pngwolf, gifsicle, giflossy, convert, mozjpeg, subsampling, webp, exiftool, zopflipng
scour, svgo, subset, smpdf, gs, ...
Ускорение со скоростью gzip
Отложенная загрузка
Параллельная загрузка
Оптимизация изображений
ПРОФИЛИРОВАНИЕКЛИЕНТСКОЙ
ПРОИЗВОДИТЕЛЬНОСТИ
Внедрение CDN
Мобильная производительность
Chrome: JavaScript CPU Profiler
РЕЗЮМЕ
Измерение производительности
Подключение (connect)Сервер (server wait)Канал (download)Отрисовка (DOMready)*Начало взаимодействия (interaction)Загрузка (onload)
Правильная методикаНагрузка
Частота изменений
Ручная обработкаАвтоматизация
Динамическое решение
Статическая сборка
Комплексный подход
P = cПланироватьD = cДелатьS = соСчитатьA = проАнализировать
Спасибо!Мациевский Николай[email protected] +7 926 7281964Промо-код на 2500 рублей в Айри.рфhl16