Нас часто спрашивают «Что такое пушить шрифты или стили»? Технология HTTP/2 Server Push не новая, но её мало кто использует, потому что мало кто знает про это подробности.
В этом эфире мы показали, замерили и объяснили, что это за оптимизация такая и дали всё необходимое, чтобы разобраться.
Замерьте скорость вашего сайта и смотрите видео:
100: Как настроить HTTP/2 + Server Push, что значит пушить шрифты/стили
Временные метки для видео:
- 0:00 – Сегодня в эфире: о HTTP/2 + Server Push, как он влияет на скорость загрузки сайта, визуальная демонстрация работы и в конце делимся готовыми скриптами
- 5:43 – Первые вопросы из зала: «TLS 1.3 + HTTP3 — есть ли смысл уже внедрять?»
- 7:13 – Вопрос зрителя: «У PageSpeed снова сменился алгоритм? В последнюю неделю он стал видеть скрипты, которые были отложены на 5.5 сек (VK, Яндекс Директ) БЕЗ использования ‘scroll’ в таймауте»
- 7:57 – Об обновлениях Google PageSpeed Insights. Испытайте новейшую версию Lighthouse 6.1.1 на LOADING.express при проверке скорости загрузки своего сайта https://lh.loading.express/
- 9:50 – Демонстрация презентации. Что такое HTTP/2 + Server Push или как происходит обмен данных между сервером и клиентом
- 12:06 — Разница HTTP/2 с привычным HTTP/1. Насколько широко применим новый протокол обмена данных
- 14:50 — Пошаговый разбор системы работы технологии HTTP/2, об альтернативных решениях подробно: 17:58
- 16:37 — Вопрос из зала о push-notification: «Каким плагином заблочить пуш в Chrome и Mozilla?», объясняем разницу в значениях «пуш»
- 17:42 — Комментарий из зала: «Выяснили, что пушить — делать пушистым, очень просто и не спутаешь»
- 19:18 — Оптимальное использование кэш браузера
- 20:32 — Как HTTP/2 push влияет на скорость загрузки сайта, сравнительный анализ с альтернативными решениями
- 23:23 — Показатели DOMContentLoaded Time (параметр оценки времени полной загрузки страницы) на примерах HTTP/1 и HTTP/2
- 24:11 — Вопрос из зала: «Что мешает скорости? На новый протокол перееду. Там только html. Это Joomla. Хост менять?»
- 24:50 — Значения Page Load Time параметра демонстративно на диаграмме
- 27:10 — Вопрос зрителя: «Крутящийся прелоадер — чем является по метрике?»
- 27:50 — Типичные ошибки при повторном запросе контента. Как их избежать или найти решение
- 29:41 — Чем больше информации, тем медленнее сайт или как регулировать HTTP/2 + Server Push
- 33:05 — Вопрос от зрителя о кэшировании: «Вот, сайт обновляется каждый час. А данные нужны прямо сейчас, допустим цены»
- 34:26 — Вопрос из зала о сохраненных данных: «Local storage?»
- 35:13 — Вопрос от зрителя: «На новый PHP 7.4 стоит переходить?»
- 36:14 — Вопрос от зрителей о прошлом эфире: «В предложенном вами коде для Adsense не используется setTimeout. При применении setTimeout блок не будет выводиться?«. Получить скрипт для Google AdSense по ссылке https://pay.loading.express/ob/ord/advertisement
- 37:50 — Продолжение вопроса: «Если использовать link rel= “preload” для Адсенса, то при чистом КЭШе не появляется реклама. Она появится если перезагрузить страницу. У Вас такого не было?». Эфир об отложке рекламы https://www.youtube.com/watch?v=_lBZf2BbJAY
- 38:32 — Вопрос о PHP последней версии: «При смене php может что-то необратимо сломаться, что даже при возврате на прежнюю версию останутся баги?»
- 39:20 — Preload или как сообщить HTTP/2 + Server Push для загрузки только необходимых данных
- 41:44 — О минимальных требованиях к сайту для использования HTTP/2
- 42:44 — Риски использования незащищенного соединения без SSL (Secure Sockets Layer — протокол шифрования)
- 48:18 — Как проверить работу Push скрипта
- 49:02 — Советы по выбору правильного хостинг провайдера
- 49:26 — Немного о HTTP/3 с использованием TCP/IP и UDP/IP (оба протоколы передачи данных)
- 50:46 — Вопрос из зала о скрипте: «А как проверить, выполняется оно или нет?»
- 51:33 — Демонстрация на Dev Tools (инструмент разработчика в Google Chrome) проверки Push
- 52:58 — «Сайт не загружается никогда и это хорошо!». Почему, вы узнаете в эфире с Михаилом Шакиным https://www.youtube.com/watch?v=VQD0PgLQpVs
- 54:55 — Важный вопрос из зала: «А куда вставлять этот код?»
- 57:04 — Совет для правильного использования технологии HTTP/2 + Server Push
- 57:43 — В каких случаях Brotli и GZip сжатие могут замедлить скорость сайта
- 1:00:50 — Итоги 100-ого эфира: скрипт для HTTP заголовок Preload, понятие HTTP/2 и его плюсы и минусы
- 1:03:26 — Вопрос зрителя: «Можете на глазах у изумленной публики показать как-нибудь пример борьбы с корнем всея зла: js-long_task?»
- 1:04:06 — Подробный ответ о Service Worker API: «Разбить (на какие куски, по сколько кб может), запуск в нужное свободное время (как определяется, что уже пора), service-worker?»
- 1:06:45 — Интерактивная и наглядная загрузка, для анализа скорости отправки файлов сайта на примерах HTTP/1 и HTTP/2 + Server Push, подробнее 1:08:03
- 1:07:15 — Продолжение вопроса 1:03:26 «Допустим, бесконечно грузится сайт как у вас reqidle никогда не наступит?»
- 1:14:16 — Самим пройти интерактив на сайте можно по ссылке https://evertpot.com/h2-parallelism/
- 1:14:35 — Вопрос из зала: «Тестировать надо в идеальной среде, отключить wp плагины, wifi или 3g и влияние время ответа сервера?»
- 1:16:16 — Почему оценка в LOADING.express отличается от времени реальной загрузки сайта клиента в браузере?
- 1:18:16 — Предложение от зрителя: «Парни вам надо свой продукт пилить, простенький но свой) самую быструю тему на wp например. Из серии :«Просто заткнись и возьми мои деньги« я б купил)». Немного об предстоящих новостях
- 1:21:51 — Вопрос из зала: «Московские студии часто заказывают вашу услугу? Много ли критики приходят?»
- 1:24:37 — Вопрос: «У вас получается ускорить сайты на wpbakery? Или чаще советуете переделать сайт с нуля?»
- 1:27:07 — Вопрос: «Сайты на тильде сама тильда не блочит за превышение допустимой нагрузки»
- 1:28:06 — До следующего выпуска! Пятиминутка тут https://www.youtube.com/watch?v=SgDaf8FeI2Q
