HTTP / 2: быстрый и надежный фундамент для будущего SEO

1. От эксперимента к стандарту
2. Какую проблему пытается решить HTTP / 2?
3. Решение: HTTP / 2
4. Будущее сегодня!
5. Поддержка браузера
6. Поддержка веб-сервера
7. Добавление поддержки HTTP / 2
8. Заключение

В предыдущих статьях мы много писали о производительность сайта а также защита вашего сайта Google объявил оба фактора как факторы ранжирования поиска , Эти статьи содержат подробные советы по использованию существующих инструментов и технологий для повышения производительности и безопасности вашего сайта (советы, которые мы настоятельно рекомендуем вам соблюдать). Но знаете ли вы, что Google также разработал и поддерживает новый протокол веб-транспорта под названием SPDY что устраняет многие из присущих сегодня недостатков производительности и безопасности в сети?

В этой статье я более подробно расскажу о том, как работает этот новый протокол, почему он важен для вас и как вы можете начать использовать его сегодня.

От эксперимента к стандарту

Google создал протокол SPDY в качестве многолетнего эксперимента, чтобы найти быстрый способ общения между браузером и серверами , Результаты были настолько положительными, что Целевая группа по инженерным вопросам интернета (IETF) использует SPDY в качестве основы для HTTP / 2 замена существующего сетевого протокола, который сегодня поддерживает весь интернет-трафик. Хотя технически HTTP / 2 все еще является развивающейся спецификацией, многие веб-браузеры, веб-серверы, сетевые устройства и веб-сайты уже поддерживают как SPDY, так и HTTP / 2 в его текущей форме.

Хотя между SPDY и HTTP / 2 есть некоторые тонкие различия, для целей этой статьи безопасно использовать эти термины взаимозаменяемо. Поскольку HTTP / 2 становится популярным в популярном словаре, язык SPDY перестает использоваться в пользу HTTP / 2. По этой причине я просто буду называть SPDY HTTP / 2 до конца этой статьи.

Какую проблему пытается решить HTTP / 2?

Чтобы понять, почему Google и IETF создают новую версию HTTP, нам необходимо понять основные ограничения производительности, которые мы имеем сегодня. Это помогает рассмотреть эту аналогию:

Представьте, что все дороги в современном мире были построены еще в эпоху конных экипажей: узкие, ухабистые и с низкими скоростными ограничениями (все еще актуально в некоторых городах…). Конечно, потребовалось некоторое время, чтобы добраться куда угодно, но задержка была в основном из-за скорости вашей лошади. Перенесемся в будущее: такие же ухабистые дороги, но теперь все водят машины. Теперь лошадь не является узким местом, но вместо этого все эти машины накапливаются на одной и той же дороге, застрявшей в бревне!

Хотите верьте, хотите нет, но большая часть трафика на сегодняшний день находится недалеко от этой аналогии. Оригинал Протокол HTTP датируется почти 25 лет. Самым последним обновлением является HTTP / 1.1, который был стандартизирован еще в 1999 году. Интернет время !

Подобно тем узким, ухабистым дорогам прошлого, тогда Интернет был совсем другим местом: меньшие веб-страницы, более медленные интернет-соединения и ограниченное серверное оборудование. В некотором смысле, «лошадь» была узким местом. HTTP / 1.1 был продуктом того времени.

Например, когда веб-браузер загружает веб-страницу с использованием HTTP / 1.1, он может запрашивать ресурс (например, изображение, файл JavaScript и т. Д.) По одному для каждого подключения к серверу. Это выглядит так:

Вы заметите, что браузер тратит много времени на ожидание каждого запроса. Хотя HTTP / 1.1 не позволяет нам делать несколько запросов одновременно по одному и тому же соединению, браузеры могут попытаться ускорить процесс, установив 2 соединения с одним сервером, как показано на диаграмме ниже:

Использование двух подключений немного лучше, но браузер все еще тратит много времени на ожидание загрузки. И мы можем загрузить только 2 ресурса одновременно. Мы могли бы попытаться создать больше соединений, чтобы параллельно загружать больше ресурсов. Современные браузеры пытаются это сделать и могут устанавливать от 2 до 6 соединений на сервер. К сожалению, это все еще плохой подход, потому что каждое соединение само по себе используется неэффективно. Поскольку средняя веб-страница имеет более 100 ресурсов добавляется задержка выполнения всех этих индивидуальных запросов по одному за несколько подключений, и ваша страница загружается медленно.

Вы можете увидеть эту неэффективность, посмотрев на карту водопада. Мы обсуждали водопады в предыдущем посте Moz на Оптимизация времени до первого байта и у нас также есть подробное руководство по как читать карты водопада , Большинство графиков с водопадом будут отображать длинные зеленые секции, представляющие время, в которое браузер ожидает загрузки ресурса. Все это время, потраченное на ожидание, а не загрузку, является основной причиной медленной загрузки сайтов.

Это неэффективное ожидание ресурсов, поэтому оптимизации как объединение файлов JavaScript или CSS может помочь вам быстрее загрузить сайт. Но оптимизация, подобная этой, является всего лишь мерой ограничения. В то время как вы можете (и должны) продолжать оптимизировать наши страницы, чтобы делать все меньше и меньше запросов, мы не собираемся по-настоящему переходить на следующий уровень производительности, пока не «исправим пути» и не улучшим фундаментальный способ общения в Интернете. , В частности, нам нужно найти лучший способ использования этих сетевых подключений. Это где HTTP / 2 приходит.

Решение: HTTP / 2

По своей сути HTTP / 2 предназначен для более эффективного использования базовых сетевых подключений. HTTP / 2 меняет порядок передачи запросов и ответов по сети, что является основным ограничением в предыдущих версиях HTTP.

HTTP / 2 работает, устанавливая одно соединение с сервером, а затем «мультиплексирует» несколько запросов по этому соединению для одновременного получения нескольких ответов. Это выглядит так:

Браузер использует одно соединение, но больше не запрашивает элементы по 1 за раз. Здесь мы видим, что браузер получает заголовки ответа для файла № 3 (возможно, изображения), а затем он получает тело ответа для файла № 1! Затем он начинает получать тело ответа для файла № 3, прежде чем перейти к файлу № 2.

Думайте о мультиплексировании, как о походе в продуктовый магазин и вызове вашего супруга только один раз, чтобы получить полный список: «Хорошо, нам нужно молоко, яйца и масло. Проверьте». Сравните это с HTTP / 1.1, который напоминает вашему супругу много раз: «Нужно ли нам молоко? Хорошо, пока». «Привет мне снова - нам тоже нужны яйца? Да, хорошо». "Хорошо, извини, последний вопрос, нам тоже нужна мука? Нет, хорошо".

Все эти данные намного эффективнее связаны в одном соединении. Сервер может предоставить браузеру данные, когда он будет готов. Больше нет цикла «сделать запрос; ничего не делать во время ожидания; скачать ответ». Хотя этот подход немного сложнее для понимания, он имеет несколько преимуществ.

Прежде всего, сетевые подключения не работают без дела, пока вы ждете, пока один ресурс завершит загрузку. Например, вместо ожидания загрузки одного изображения перед началом следующего, ваш браузер может фактически завершить загрузку изображения 2 до того, как изображение 1 даже завершится!

Это также предотвращает так называемую блокировку заголовка: когда большой / медленный ресурс (например, фоновое изображение размером 1 МБ) блокирует загрузку всех других ресурсов до завершения. Под HTTP браузеры будут загружать только 1 ресурс за одно соединение. Подход мультиплексирования HTTP / 2 позволяет браузерам загружать все остальные 5 КБ изображений параллельно через одно и то же соединение и отображать их по мере их появления. Это намного лучший пользовательский опыт!

Еще одно большое преимущество производительности HTTP / 2 - это «Сервер Пуш» особенность: это позволяет серверу активно передавать контент посетителю без их запроса! Так, например, когда браузер посещает ваш сайт, ваш сервер может «протолкнуть» ваше изображение логотипа в браузер, прежде чем он даже узнает, что это нужно! За счет активного извлечения необходимых ресурсов с сервера браузер может загружать страницы гораздо быстрее, чем это было возможно ранее.

И последнее, но не менее важное: HTTP / 2 лучше всего работает с HTTPS. Как мы уже упоминали ранее, производительность и безопасность являются постоянно растущим компонентом поискового рейтинга. Хотя техническая спецификация HTTP / 2 допускает использовать не-HTTPS-соединения , Более ранний протокол SPDY от Google требуется HTTPS , По причинам совместимости большинство программного обеспечения веб-сервера будут использовать HTTP / 2 только через зашифрованное соединение HTTPS. Вступление в широкополосный HTTPS-сервер не только защищает безопасность ваших пользователей и полезен для вашего рейтинга в поиске, но также является наиболее эффективным способом использования HTTP / 2. Для получения дополнительной информации см. Наш предыдущий пост на включение HTTPS ,

Будущее сегодня!

Очевидно, что HTTP / 2 предлагает некоторые большие преимущества как по скорости, так и по производительности, но что это значит для вас прямо сейчас? Что ж, вы можете быть удивлены, узнав, что HTTP / 2 уже доступен и может быть поддержан вами, не влияя на ваших старых пользователей, работающих на HTTP / 1.1!

Вы можете думать о HTTP / 2 так же, как о любом другом протоколе или даже о разговорном языке. Чтобы это работало, вам просто нужно согласие отправителя и получателя говорить на одном языке. В этом случае «отправитель» - это веб-браузер, а получатель - ваш веб-сервер.

Поддержка браузера

Поскольку маловероятно, что вы создадите свой собственный веб-браузер, такой как Microsoft, Google, Apple или Mozilla, вам не нужно беспокоиться об «отправляющей» стороне уравнения. Поддержка HTTP / 2 в веб-браузере уже широко используется в современных современных браузерах, и их использование только увеличивается по мере старения старых версий браузеров.

Фактически, последние версии всех основных настольных веб-браузеров уже поддерживают HTTP / 2! Chrome и Firefox поддерживают его уже несколько лет. яблоко добавлена ​​поддержка Safari осенью 2014 года с Safari 8. IE 11 поддерживает HTTP / 2, но только если вы используете Windows 8.

Точно так же уже широко распространено использование HTTP / 2 на смартфонах. Более старый веб-браузер Android, называемый Browser , уже несколько лет поддерживает HTTP / 2. Текущий браузер по умолчанию для Android - браузер Google Chrome. Мобильные версии Chrome используют тот же сетевой код, что и Desktop Chrome. Это означает, что оба устройства Chrome на устройствах Android, а также Chrome на устройствах iOS поддерживают HTTP / 2. Apple добавила поддержку iOS-версии Safari с iOS 8.

Лучше всего взглянуть на аналитику вашего сайта и посмотреть, какие веб-браузеры используют ваши посетители. Скорее всего, большинство посетителей имеют веб-браузеры с поддержкой HTTP / 2 (Вы можете проверить этот список настольные и мобильные браузеры, поддерживающие HTTP / 2 ). В этом случае вы можете смело переходить к следующему шагу.

Поддержка веб-сервера

Хотя у вас мало контроля над тем, какие браузеры используют ваши посетители, у вас есть прямой контроль над вашим веб-сервером. Проще говоря, для поддержки HTTP / 2 вам нужно выбрать веб-сервер, который поддерживает HTTP / 2, и включить его. И, конечно, этот сервер также должен продолжать поддерживать HTTP / 1.1, потому что у вас всегда будут пользователи, использующие старые браузеры.

Продолжая нашу аналогию с «разговорной речью», вы можете думать о HTTP / 1.1 и HTTP / 2 как о разных языках, таких как английский или французский. Пока обе стороны могут говорить на одном языке, они могут общаться. Если ваш сервер поддерживает только HTTP / 1.1, то посетители могут общаться только с HTTP / 1.1. Но если ваш сервер также поддерживает HTTP / 2, браузер вашего пользователя также выберет говорить (быстрее) HTTP / 2. И, наконец, если ваш сервер говорит по HTTP / 2, а браузер пользователей - нет, то они будут продолжать говорить по HTTP / 1.1, как и раньше, поэтому нет опасности «сломать» своих старых пользователей.

В настоящий момент веб-серверы Apache и nginx поддерживают HTTP / 2. nginx поддерживает HTTP / 2 изначально и Apache поддерживает это через модуль mod_spdy Поскольку Apache и nginx обслуживают трафик для 66% всех активных веб-серверов Вполне возможно, что сервер вашего сайта может поддерживать HTTP / 2 прямо сейчас!

Если вы не используете nginx или Apache, у вас все еще есть другие варианты. Есть ряд меньшие, более специализированные проекты которые поддерживают HTTP / 2. Вы также можете разместить обратный прокси, поддерживающий HTTP / 2 например, HAProxy перед существующим веб-сервером, чтобы получить то же преимущество, что и наличие веб-сервера, который напрямую поддерживает HTTP / 2.

Если вы запускаете свой сайт через хостинг-провайдера, узнайте у них, какую версию веб-сервера они используют. Основные сайты, такие как WordPress.com а также CloudFlare все уже предлагают поддержку HTTP / 2. Если ваш провайдер еще не поддерживает HTTP / 2, сообщите им, что это важно!

Добавление поддержки HTTP / 2

HTTP / 2 - это просто другой язык, который ваш веб-сервер может использовать для общения. Точно так же, как человек может выучить новый язык, помня свой родной язык, ваш веб-сервер будет по-прежнему знать, как общаться HTTP / 1.1 после того, как вы добавите поддержку HTTP / 2. Вы не рискуете запретить кому-либо говорить с вашим сайтом. Люди, использующие новые браузеры, будут общаться через HTTP / 2, а старые браузеры будут продолжать использовать более старый HTTP / 1.1 - ничего не сломается! Если у вас есть время, нет никаких причин не обновлять ваш сайт для поддержки HTTP / 2.

Помните, HTTP / 2 - это просто лучший способ передачи веб-контента, чем HTTP / 1.1. Все остальное в вашем веб-сайте (URL-адреса, ваша HTML-разметка, ваши перенаправления или 404 страницы, содержимое вашей страницы и т. Д.) Остается неизменным. Это делает добавление поддержки HTTP / 2 довольно простым:

1. Убедитесь, что ваш сайт использует HTTPS. Смотрите нашу предыдущую статью на реализация HTTPS без ущерба для производительности ,
2. Убедитесь, что ваше серверное программное обеспечение или инфраструктура могут поддерживать HTTP / 2.
3. Обновите и настройте серверное программное обеспечение или инфраструктуру для поддержки HTTP / 2.

Это оно! Ваш сайт сейчас использует HTTP / 2!

Ну, надеюсь, это так. Шаги, необходимые для обновления / настройки вашего веб-сайта, зависят от того, какое программное обеспечение вы используете, поэтому мы не можем предоставить вам подробное руководство. Тем не менее, мы создали бесплатный инструмент, SPDYCheck , который вы можете использовать, чтобы убедиться, что вы правильно настроили свой сайт для HTTP / 2 (он же SPDY). SPDYCheck работает как контрольный список, проверяющий каждый шаг того, как браузер договаривается с вашим сервером о взаимодействии через HTTP / 2. Он может сказать вам, где в процессе ничего не работает, а также предоставляет полезные рекомендации, такие как включение строгой транспортной безопасности , С SPDYCheck вы можете быть уверены, что все работает правильно, и убедиться, что ваш сайт поддерживает HTTP / 2.

Заключение

Мы все знаем, что более быстрые сайты помогают улучшить рейтинг в поисковых системах, но более быстрые сайты также предлагают лучший пользовательский опыт , Более быстрые сайты дольше привлекают ваших пользователей и способствуют дальнейшему обмену и обмену ссылками. HTTP / 2 - это удивительный шаг вперед, который может помочь повысить производительность и удобство работы вашего сайта. Однако HTTP / 2 не является серебряной пулей. Оптимизации как оптимизация изображений вашего сайта без потерь может иметь большое влияние на производительность вашего сайта и все еще будет необходимо. Короче говоря, хотя вы должны добавить поддержку HTTP / 2 на свой веб-сайт, убедитесь, что вы проводите другие оптимизации и следуйте рекомендациям по повышению производительности, чтобы обеспечить наилучшее взаимодействие с пользователем. Если вы ищете место для начала или хотите узнать, как работает ваш сайт, Zoompf's бесплатный отчет о производительности это отличный способ понять, что вы можете сделать, чтобы сделать ваш сайт быстрее.

Похожие

Комментарии