Статья обновлена 3 марта, 2022
Что такое Brotli и как влияет на увеличение скорости загрузки сайта
Что такое Brotli? Brotli — это алгоритм сжатия без потерь с открытым исходным кодом, разработанный Google. Первоначально разработанный для уменьшения размера веб-шрифтов, Brotli теперь работает как формат общего назначения для сжатых данных. Brotli выступает в качестве альтернативы gzip и Deflate, создавая файлы меньшего размера и распаковывая так же быстро. Как установить и настроить Brotli в Nginx.
Краткая история Brotli
Изначально Brotli был создан для сжатия веб-шрифтов WOFF2. Это продолжение Zopfli, другого разработанного Google алгоритма сжатия, созданного для обратной совместимости с gzip, zlib и Deflate. Zopfli и Brotli обеспечивают гораздо лучшую степень сжатия, чем gzip, zlib или Deflate, хотя и с гораздо большей загрузкой ЦП. Со временем Brotli отказалась от обратной совместимости в пользу собственного формата файла, в котором используется .br расширение.
Brotli уникален тем, что его можно использовать только через зашифрованные соединения. Это связано с тем, что посредники (или «средние ящики») перехватывают и считывают незашифрованный HTTP-трафик. Столкнувшись с файлом Brotli, некоторые из этих посредников попытались передать файл как gzip, изменив его Content-Encoding заголовок с br на gzip. Ограничивая Brotli протоколом HTTPS, Google предотвращает это вмешательство, чтобы обеспечить более быстрое внедрение Brotli.
Ориентиры
Brotli предлагает значительно более высокие коэффициенты сжатия, чем Deflate, за счет более высокой загрузки ЦП. В исследовании Google, проведенном в 2015 году, самый высокий уровень сжатия Brotli обеспечивает коэффициент сжатия на 29% выше, чем самый высокий уровень Deflate. Однако скорости сжатия и распаковки Brotli на этом уровне были на 97% и 17% ниже, чем у Deflate соответственно (0,5 и 289,5 МБ/с по сравнению с 15,5 и 347,3 МБ/с).
Из-за относительно низкой скорости сжатия компании используют Brotli для предварительного сжатия файлов. В 2017 году Dropbox преобразовал статический контент на dropbox.com в Brotli, уменьшив размер своих активов в среднем на 20–25% . Поскольку содержимое статично, Dropbox может предварительно сжимать файлы в процессе сборки и предоставлять их пользователям напрямую.
Как использовать Бротли?
Несколько самых популярных веб-серверов поддерживают Brotli либо изначально, либо с помощью модулей. Несколько CDN также предлагают поддержку Brotli.
Подобно gzip, zlib и Deflate, Brotli предлагает несколько уровней сжатия. Более высокие уровни обычно обеспечивают лучшую степень сжатия при более низких скоростях, при этом уровень 1 является самым быстрым, а уровень 11 — самым медленным. Уровень 5 рекомендуется как хороший баланс между размером файла и скоростью, особенно для динамического сжатия.
Апачи
Apache поддерживает Brotli через модуль mod_brotli, добавленный в версии 2.4.26. Чтобы включить Brotli, добавьте в конфигурацию виртуального хоста следующее:
# Сжать распространенные текстовые типы MIME
AddOutputFilterByType BROTLI_COMPRESS text/html text/plain text/xml text/css text/javascript application/javascript
# Пропустить уже сжатое
содержимое SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-brotli
# Устанавливает уровень сжатия (по умолчанию 5)
BrotliCompressionQuality 6
mod_brotli повторно сжимает содержимое при каждом запросе. Чтобы обслуживать предварительно сжатые файлы, скопируйте файлы Brotli в папку, доступную для Apache. Затем добавьте условие перезаписи в конфигурацию вашего виртуального хоста, которое обслуживает эти файлы вместо их эквивалентов gzip.
<FilesMatch>
# Подавать сжатые CSS-файлы brotli, если они существуют и клиент принимает brotli.
RewriteCond "%{HTTP:Accept-encoding}" "br"
RewriteCond "%{REQUEST_FILENAME}\.br" "-s"
RewriteRule "^(.*)\.css" "$1\.css\.br" [QSA ]
# Подавать сжатые JS-файлы brotli, если они существуют и клиент принимает brotli.
RewriteCond "%{HTTP:Accept-encoding}" "br"
RewriteCond "%{REQUEST_FILENAME}\.br" "-s"
RewriteRule "^(.*)\.js" "$1\.js\.br" [QSA ]
# Обслуживайте правильные типы контента и предотвращайте двойное сжатие.
RewriteRule "\.css\.br$" "-" [T=text/css,E=no-brotli:1]
RewriteRule "\.js\.br$" "-" [T=text/javascript,
Header append Content-Encoding br
# Заставить прокси-серверы
отдельно кэшировать файлы brotli и # не-brotli css/js.
Добавление заголовка Vary Accept-Encoding
</FilesMatch>
Nginx
Nginx поддерживает Brotli через модуль ngx_brotli. Модуль фактически состоит из двух отдельных модулей: один для сжатия на лету, а другой для предварительно сжатых файлов. Вам нужно будет скомпилировать Nginx с включенным модулем, чтобы использовать Brotli.
Microsoft IIS
Вы можете использовать Brotli в IIS через модуль Brotli Compression Scheme Plugin с открытым исходным кодом. С помощью сценария установки Brotli автоматически устанавливается и настраивается для всех сайтов IIS. Вы можете настроить параметры сжатия, открыв свой applicationHost.config файл и перейдя в <httpCompression> раздел:
<httpCompression directory="%SystemDrive%\inetpub\temp\Временные сжатые файлы IIS">
<scheme name="br" dll="%windir%\system32\inetsrv\brotli.dll" dynamicCompressionLevel="5" staticCompressionLevel="11 " />
<scheme name="gzip" dll="%windir%\system32\inetsrv\gzip.dll" dynamicCompressionLevel="4" staticCompressionLevel="9" />
<staticTypes>
<add mimeType="text/*" enable ="true" />
...
</staticTypes>
<dynamicTypes>
<add mimeType="text/*" enabled="true" />
...
</dynamicTypes>
</httpCompression>
На момент написания этой статьи единственными настраиваемыми параметрами являются уровни статического и динамического сжатия.
CDN
Несколько CDN предлагают прозрачную поддержку Brotli, включая KeyCDN и Akamai. Однако другие CDN не распознают файлы, закодированные Brotli, и могут даже попытаться вернуться к gzip. Когда LinkedIn развернула Brotli на своем сайте в 2017 году, они обнаружили, что все пять их CDN вернули Accept-Encoding заголовок с Vary на gzip даже при обслуживании файлов Brotli. CDN также не могли кэшировать контент, поскольку контент-серверы LinkedIn содержали Content-Encoding: br в своих ответах информацию, которую CDN не могли понять.
Чтобы обойти это, LinkedIn переместил свои файлы Brotli на совершенно отдельный URL-адрес и удалил Content-Encoding: br заголовок. После того, как файл кэшируется CDN, они добавляют заголовок обратно в каждый ответ клиенту. Хотя это обходной путь, он повысил производительность на 2–6,5%, причем наибольший прирост наблюдается у мобильных пользователей.
Браузеры
Brotli поддерживается большинством современных браузеров, за исключением Internet Explorer 11 и Opera Mini. Chrome добавил поддержку в версии 50, Firefox в версии 44, Edge в версии 15, Opera в версии 38 и Safari в версии 11. 84,25% браузеров во всем мире поддерживают Brotli.
К счастью, браузеры, не поддерживающие Brotli, будут использовать альтернативные алгоритмы сжатия, просто не запрашивая Brotli в заголовке Accept-Encoding.
Заключение
Brotli представляет новое поколение средств сжатия и хранения данных. Благодаря возможности уменьшить размер веб-страницы на 20 %, Brotli сделает Интернет более быстрым и компактным. Вы можете узнать больше о Brotli на официальной странице GitHub.
Выводы
При установки на свой интернет проект (сайт) нового алгоритма сжатия Brotli большого прироста в скорости загрузки Вы не увидите. Но уже очень быстро наступит завтра! И данный инструмент сжатия вытеснит старые алгоритмы. Без установленного модуля Brotli, Ваш сайт возможно просядет в скорости. Соответственно необходимо озаботится заранее и установить данный модуль.
Надеюсь в этой статье мне удалось рассказать Вам, что такое Brotli.
Понравился материал? Подписывайтесь на наш блог.
Только полезная информация и реальные кейсы
