предисловие
Как фронтенд-разработчик🐶, HTTP является неотъемлемой частью нашей карты знаний, а также обязательным пунктом знаний для собеседований. HTTP2 претендует на то, чтобы сделать наши приложения быстрее, проще и стабильнее.Он отлично решает многие проблемы в версии 1.1.В этой статье мы с вами поговорим об улучшениях HTTP2.
История HTTP
Прежде чем мы официально поговорим о HTTP2, давайте поговорим об истории развития HTTP.
- HTTP/0.9 — однострочный протокол
HTTP был опубликован в 1990 г. В то время HTTP был очень простым: поддерживал только метод GET, заголовка не было, можно было получить только обычный текст. - HTTP/1.0 — платформа для построения протоколов
В 1996 году HTTP был официально выпущен в качестве стандарта, и версия была HTTP/1.0.В версии 1.0 были добавлены такие спецификации, как заголовки, коды состояния, разрешения, кэширование и длинные соединения (по умолчанию короткие соединения), которые, можно сказать, создают основная структура протокола. - HTTP/1.1 — дальнейшие улучшения
В 1997 году последовала версия 1.1. Основным улучшением версии 1.1 является длинное соединение по умолчанию, заставляющее клиента предоставлять заголовок Host, конвейер, Cache-Control, ETag и другие связанные расширения кэша.
существующие на данный момент проблемы
Сейчас не будем говорить о HTTP2, а посмотрим, какие проблемы существуют при разработке HTTP до 1.1:
- Блокировка начала строки: по TCP-соединению может быть отправлен только один запрос. Прежде чем предыдущий запрос будет выполнен, последующие запросы ставятся в очередь.
- Несколько TCP-соединений
Хотя конвейеризация HTTP/1.1 может поддерживать параллелизм запросов, для браузеров это сложно реализовать, а Chrome, Firefox и т. д. отключают конвейерную обработку. Таким образом, параллелизм запросов версии 1.1 зависит от нескольких TCP-соединений, стоимость установления TCP-соединения высока, и возникнет проблема с медленным запуском. - Избыточные заголовки в текстовом формате
Версия HTTP/1.X представлена в текстовом формате, заголовок несжатый, и каждый запрос будет содержать один и тот же заголовок, такой как cookie, пользовательский агент и т. д. - Клиент должен активно запрашивать
Наступила эра HTTP/2.0
Давайте рассмотрим демонстрацию HTTP/2.0 Hang Zhuangtian. В этой демонстрации загружаются 379 изображений для сравнения производительности HTTP/1.1 и HTTP/2.0.Сравнение производительности HTTP/1.1 и 2.0
Теоретически HTTP/2.0 будет иметь более чем двукратное повышение производительности по сравнению с HTTP/1.1, а в слабой сетевой среде улучшение производительности будет более очевидным. На следующих двух рисунках показано сравнение производительности между быстрым и медленным 3G при настройке сети.
Двоичный слой кадрирования
Ядром повышения производительности HTTP2 является уровень двоичного кадрирования. HTTP2 является бинарным протоколом, он использует бинарный формат для передачи данных вместо текстового формата 1.x.
Здесь мы упоминаем три концепции.
- Поток: Двунаправленный поток байтов по установленному TCP-соединению, который может передавать одно или несколько сообщений.
- Сообщение: полный HTTP-запрос или ответ, состоящий из одного или нескольких кадров. Кадры для определенного сообщения отправляются в одном потоке, что означает, что HTTP-запрос или ответ могут быть отправлены только в одном потоке.
- Фрейм: основная единица коммуникации.
В TCP-соединении может быть любое количество потоков.
мультиплексирование
Как упоминалось выше, проблема блокировки заголовка строки HTTP/1.1 и множественных TCP-соединений прекрасно решается с помощью мультиплексирования HTTP2. HTTP2 позволяет осуществлять всю связь по одному TCP-соединению, что действительно реализует параллелизм запросов. Давайте посмотрим, как реализован HTTP2:
В этом примере мы можем интуитивно увидеть, что мультиплексирование играет роль оптимизации. Поскольку HTTP2 реализует параллелизм запросов, последующие запросы не должны ждать, и время загрузки, конечно же, намного короче. Сделайте снимок экрана с подробностями загрузки изображения HTTP2, отнимающими много времени (см. более поздние запросы):
сжатие заголовка
Сжатие заголовков также является изюминкой HTTP2. В версии 1.X заголовок передается в текстовом формате, что обычно добавляет 500-800 байт служебных данных к каждой передаче. Теперь нормально открывать сотни запросов на веб-странице, и некоторые поля заголовка для каждого запроса одинаковы, например, файлы cookie, пользовательский агент и т. д. HTTP2 использует формат сжатия HPACK для сжатия заголовка для этой цели. Сжатие заголовков должно происходить между браузером и сервером:
- поддерживать идентичный статический словарь общих имен заголовков и общих комбинаций имени заголовка и значения
- Поддерживая тот же динамический словарь, вы можете динамически добавлять контент
- Кодировать переданное поле заголовка с помощью статического кодирования Хаффмана.
Статический словарь HTTP2 выглядит так (перехватывается только часть,Полная форма здесь):
После того, как пользовательский агент будет передан в первый раз, браузер и сервер добавят его в свой динамический словарь. Последующие передачи могут передавать индекс, выполняется один байт.
Давайте используем WireShark для захвата пакетов для проверки:
В настоящее время HTTP2 – это все HTTPS-запросы. Информацию о захвате и расшифровке пакетов HTTPS веб-сайтов с помощью WireShark см.здесь.
- Первая передача пользовательского агента и вторая передача пользовательского агента
- Первая прочность на сжатие HPACK
отправка на стороне сервера
Нажатие на стороне сервера позволяет серверу прогнозировать ресурсы, необходимые клиенту, и активно направлять их клиенту.
Например: клиент запрашивает index.html, и сервер может дополнительно продвигать script.js и style.css.
Принцип реализации заключается в том, что когда клиент отправляет запрос страницы, сервер может проанализировать другие ресурсы, которые зависит от страницы, и активно подтолкнут ее к кеше клиента. Когда клиент получает оригинальную веб-страницу, ресурсы, которые необходимо уже в кэше.
Для каждого ресурса, который он хочет отправить, сервер отправляет кадр PUSH_PROMISE, а клиент может отклонить отправку (когда ресурс уже находится в кэше), отправив кадр RST_STREAM. Операция этого шага предшествует родительскому ответу (index.html), и клиент знает, какие ресурсы сервер намеревается протолкнуть, и не будет создавать повторные запросы для этих ресурсов. Когда клиент получает ответ от index.html, script.js и style.css уже находятся в кеше.
Если вы хотите создать сервер HTTP2, рекомендуется использовать узел, это очень просто.Связь
Справочная статья
- Введение в HTTP/2
- HTTP/2 за кулисами
- Введение в технологию сжатия заголовков HTTP/2
- Отладка трафика HTTP/2 с помощью Wireshark
- Каковы основные улучшения HTTP/2.0 по сравнению с 1.0?
- Анализ новых возможностей HTTP/2
Эпилог
Я кратко рассказал о важных улучшениях HTTP2 по сравнению с версией 1.1 и ощутил мощь h2. Есть также некоторые функции, такие как приоритизация потоков, которые не описаны в тексте, если вам интересно, вы можете посмотреть в справочной статье. Если есть какая-то ошибка, пожалуйста, поправьте меня!