Сколько статей о скорости загрузки сайта вы уже прочитали? Наверное, много. Я также опубликовал пару статей на эту тему здесь, в Noupe, и еще больше на нашем дочернем немецком сайте Dr.Web. Важной частью оптимизации производительности является сервер, так как ни одна оптимизация не может работать без надлежащего сервера с современной операционной системой.
Это было бы похоже на борьбу с ветряными мельницами. Поскольку никто из нас не Дон Кихот, нам не следует начинать с этого, верно?
Содержание
Что такое HTTP и для чего он нужен?
В общем, HTTP (протокол передачи гипертекста) — это способ связи между веб-сервером и браузером. Это означает, что HTTP — это язык, на котором сервер и браузер общаются друг с другом.
Я не буду вдаваться в подробности в этой статье, поэтому, если вы хотите узнать об этом больше, посмотрите статью в Википедии. Первая версия HTTP, версия 0.9, была создана в 1991 году, в так называемый юрский период Интернета.
С тех пор многое произошло. Веб-сайты в основном состояли из цвета фона, одного или двух изображений, связанных в HTML, и большого количества текста. Первые веб-сайты были размером всего несколько КБ, в то время как сегодняшние веб-сайты толстые и весят до нескольких МБ.
Развитие веб-сайтов легко проследить на примере Dr.Web, который мы создали еще в 1997 году. Ноупе моложе его более чем на десять лет.
Сегодня фактическое количество файлов, формирующих веб-сайт, резко увеличилось. Тогда нужно было загрузить всего несколько файлов, а сегодня их десятки. Этот прогресс увеличивает ограничения старого протокола HTTP/1. Результатом является повышенная задержка или медленный современный веб-сайт.
Это заставило разработать HTTP/2. HTTP/2 определенно можно считать эволюцией старого протокола, поскольку основной целью было сокращение задержки, что приводит к увеличению скорости загрузки в современных веб-браузерах.
Ограничение HTTP/1
В настоящее время браузерам приходится загружать десятки или даже сотни файлов для отображения веб-сайта. Для отображения загружено следующее:
- HTML-код веб-сайта
- Таблицы стилей (CSS)
- JavaScript
- Изображения
- Видео
- Внешние файлы для Google Analytics, рекламы и всего подобного
- Решения для социального обмена
Большая проблема HTTP/1 заключается в том, что браузер создает запрос для каждого отдельного файла, который упоминается в HTML, CSS и JavaScript. Это могут быть сотни запросов и подключений. Необходимо выполнить сотни HTTP-запросов, что может значительно замедлить работу веб-сайта.
Оптимизация скорости под HTTP/1
Из-за этого ограничения была создана специальная концепция, как сделать сайты быстрее. Файлы были объединены в пакеты, чтобы уменьшить количество запросов, размер был уменьшен с помощью сжатия, а графика была скомпилирована в спрайт. Предполагается, что HTTP/2 решит эти проблемы, а также предоставит другие способы.
Разница между HTTP/1 и HTTP/2
Пожалуйста, посетите FAQ HTTP/2 GitHub для получения точной спецификации HTTP/2. HTTP/2 был разработан для чтения машинами, а не людьми. Таким образом, новый протокол является бинарным, так как это оптимизирует процесс связи между браузером и сервером.
Кроме того, он гораздо менее подвержен ошибкам и способен гораздо лучше интерпретировать такие вещи, как пробелы, пустые строки, концы строк, использование заглавных букв и другие вещи.
Однако большая разница между этими двумя протоколами заключается в соединениях. HTTP/1 допускает только одно соединение за раз, в то время как HTTP/2 может обрабатывать несколько соединений одновременно, поскольку использует мультиплексирование.
- HTTP/1 должен создавать запрос для каждого отдельного файла.
- HTTP/1 загружает один файл за раз
- HTTP/2 способен загружать много файлов за одно соединение.
- HTTP/2 позволяет использовать несколько подключений одновременно
Процедура отправки сервера HTTP/2
Процесс push-сервера — это функция, при которой сервер фактически знает, какие файлы требуются браузеру, прежде чем запрашивать файлы. Затем сервер отправляет файлы в браузер, не дожидаясь, пока браузер запросит их. Это ускоряет весь процесс отображения веб-сайта.
Найдите более подробную информацию В разделе Apache.org/Server Push
Те, кто хочет поэкспериментировать с процедурой отправки сервера, могут найти здесь бесплатный плагин для WordPress. Сервер HTTP/2 Push.
Почему HTTP/2 намного эффективнее
- Он может намного быстрее устанавливать соединения между клиентом и сервером.
- Соединение между сервером и браузером стало более эффективным и быстрым.
- Файлы и ресурсы передаются одновременно
- Файлы могут быть отправлены в браузер через server-push
- Позволяет загружать и отображать больше файлов одновременно
Онлайн-демонстрация: Разница между HTTP/1 и HTTP/2
Как я могу использовать HTTP/2 на своем веб-сайте?
Можете ли вы уже использовать HTTP/2 или нет, зависит от вашего веб-хостинга. Новый протокол является частью операционной системы сервера (Apache, NGINX или ILS), и, таким образом, хостер должен позаботиться о нем.
Если у вас есть собственный сервер, вы можете обновить его до HTTP/2 в любое время.
Конечно, уже есть пара хостингов, которые поддерживают и предлагают HTTP/2. Однако, похоже, это пока исключение. Можно проверить, поддерживает ли ваш веб-сервер или пакет хостинга новый турбо-HTTP. Для этого используйте онлайн-инструмент от KeyCDN:
Инструмент тестирования HTTP/2
Как использовать HTTP/2 на вашем сайте
Теоретически HTTP/2 можно использовать в любом браузере без особых настроек. В теории. К сожалению, на практике все обстоит иначе, так как крупные создатели браузеров решили включить поддержку нового протокола только через TLS (HTTPS). Вот обновленный список браузеров, которые уже поддерживают HTTP/2:
Один клик открывает интерактивный список на Caniuse.com
Итак, вам нужен SSL-сертификат для вашего домена.так как только тогда вы сможете насладиться высокоскоростным протоколом.
Тест: какой сайт уже использует HTTP/2
Существует расширение Google Chrome, которое позволяет увидеть, какой сайт уже использует HTTP/2.
Расширение «HTTP/2 и индикатор SPDY»
Расширение размещается рядом с адресной строкой браузера и использует цвета, чтобы показать вам, используется протокол или нет. Синяя вспышка означает, что веб-сайт активно использует HTTP/2. Серый означает, что поддержка недоступна.
Новые способы оптимизации скорости
Старые способы оптимизации скорости больше не эффективны при использовании HTTP/2, поэтому потенциал будет потрачен впустую. Однако ежедневное использование протокола не означает, что файлы больше не должны быть сжаты, а только означает, что вы должны подумать о том, какие файлы не будут сжиматься.
Возможное преимущество загрузки многих ресурсов одновременно может также привести к замедлению работы веб-сайта, когда все файлы больше не сжимаются и не сжимаются. Доставка JavaScript в файл, сжатый с помощью Autoptimize, например, приводит к более быстрому времени загрузки, поскольку благодаря оптимизированному кэшированию файл загружается только один раз, когда доступен соответствующий файл .htaccess.
После очень многих тестов мой способ оптимизации скорости для продвинутых пользователей показал себя оптимальным.
Заключение
Использование HTTP/2, безусловно, того стоит, хотя вам необходимо приобрести SSL-сертификат для веб-сайта. Также вполне достаточно бесплатного сертификата от Let’s Encrypt. Прирост скорости может быть огромным, в зависимости от существующей концепции оптимизации скорости. На веб-сайтах, предназначенных для высокой производительности, с серверами, которые уже используют PHP7, рост скорости будет намного менее значительным.