Сжатие ресурсов с помощью функций gzip или deflate позволяет сократить объем данных передаваемых по сети – Gzip сжатие ресурсов CSS, JS, HTML — как его включить в файле htaccess для увеличения скорости загрузки сайта | Создание сайтов и заработок в сети

Содержание

Как включить gzip сжатие на хостинге?

Продолжаю тему ускорения сайта, хочу затронуть важный пункт — gzip сжатие. В чём суть этой технологии? Всё очень просто: включая такое сжатие, вы позволяете или даже принуждаете сервер сжимать данные в архив перед отправкой. А на стороне пользователя данные, полученные с сервера, опять распаковываются.

Лучшие SEO программы для вебмастера

лучшие SEO программы

И как понимаете, это ускоряет открытие сайта в браузере, так как информации передаётся значительно меньше, а время на распаковку не велико, так как мощность компьютеров сегодня достаточно велика.

Как включить gzip сжатие Как включить gzip сжатие

Как включить gzip сжатие?

Включить сжатие при помощи gzip очень просто, достаточно в файл .htaccess, который находится в корне сайта, вписать следующий код:

<ifmodule mod_deflate="" c="">
SetOutputFilter DEFLATE
Header append Vary User-Agent
</ifmodule>

После этого можно проверить, включилось сжатие или нет через этот сервис: HTTP Compression Test.

включить gzip сжатие включить gzip сжатиеКак видите, на испытуемом сайте сжатие включено и работает. Но не стоит думать, что теперь в этом отношении всё идеально. Сервис developers.google.com показывает, что не всё сжимается, в первую очередь некоторые скрипты:

Сжатие ресурсов с помощью функций gzip или deflate позволяет сократить объем данных, передаваемых по сети.

Включите сжатие для следующих ресурсов, чтобы уменьшить объем передаваемых данных на 20,7 КБ (58 %).

  1. Сжатие страницы http://w.uptolike.com/widgets-images/fonts/icomoon.svg?18ibhs уменьшит ее размер на 13,5 КБ (55 %).

  2. Сжатие страницы http://an.yandex.ru/…RjNCz0Lg_IA==&callback=Ya[1394467363552] уменьшит ее размер на 6,5 КБ (66 %).

  3. Сжатие страницы http://www.advertone.ru/…Advertone.cbr.f2791562392376363&animon=1 уменьшит ее размер на 633 Б (46 %).

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

В заключении могу сказать, что данный алгоритм требует от хостинга дополнительных ресурсов, и поэтому если у вас «хилый» хостинг, эту функцию вполне могут блокировать. Если это так, то просто поменяйте хостинг — зачем вам такой «хиляк»?

Буду рад услышать и ваши мысли и поправки по этой полезной теме, если они есть:)

Не нашли ответ? Воспользуйтесь поиском по сайту

Включаем gzip сжатие, ускоряем загрузку сайта

👁9 054 просм.

В этой статье рассмотрим как включить динамическое gzip сжатие в файле .htaccess на хостинге с поддержкой Apache и тем самым ускорить скорость загрузки вашего интернет ресурса.

Зачем включать динамическое gzip сжатие

Как вы наверное уже знаете, скорость загрузки сайта влияет и на позиции его выдачи в поисковых системах и на восприятие сайта пользователями. Сейчас интернет пестрит динамичными, супер крутыми и красивыми сайтами. Но когда начинаешь пользоваться подобным ресурсом и он начинает по 10 -15 секунд загружать свои странички, то потихоньку пропадает всякий интерес к нему. Так как мы не готовы столько ждать, ведь время один из самых драгоценных ресурсов, которым мы располагаем и не хотим его тратить попусту.

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

Так же дело обстоит и с поисковыми алгоритмами таких известных сервисов как Google, Яндекс и других. Чем быстрее загружается сайт, тем выше его позиция в поисковой выдаче среди конкурентов.

Преимущества и недостатки динамического gzip сжатия

Gzip – это сжатие на стороне web-сервера HTML страниц, которые получает браузер пользователя. Оно не отражается на внешнем виде сайта, и положительно влияет на передаваемый трафик, снижая его количество.

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

Gzip архивирует только текстовую информацию, видео, аудио, картинки и другие медиафайлы остаются без изменений. В процессе сжатия сервер сайта архивирует текстовые данные и посылает их в таком виде на компьютер пользователя. Получая данные архивы страниц от сервера, браузер автоматически распаковывает их.

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

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

В этой ситуации много зависит от используемого вами хостинга и от количества сжимаемых файлов на сервере.

Как проверить наличие gzip сжатия на сайте

Для того чтоб проверить, работает ли gzip сжатие на сайте достаточно посетить ресурс PageSpeed Insights от Google, и провести там анализ скорости загрузки сайта. Если у вас не включено сжатие то среди других советов по оптимизации загрузки сайта будет присутствовать пункт «Включите сжатие».

Проверка скорости загрузки сайта

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

Если вести диалог со службой поддержки вашего хостера сложно, то вы сами можете проверить запуск gzip на вашем хостинге воспользовавшись сервисом HTTP Compression Test. Для этого перейдите по ссылке.

Включение gzip через файл .htaccess

Когда вы убедились, что gzip работает у вас на хостинге, но при проверке скорости загрузки сайта через ресурс PageSpeed Insights от Google все равно появляется рекомендация включить сжатие, стоит проверить, возможно оно не включено у вас в файле .htaccess.

Обязательно сохраните резервную копию перед тем как проводить любые изменения в файле!

Для этого заходим в корневой каталог сайта на сервере и открываем для редактирования непосредственно сам файл .htaccess. Ищем в нем строки:

# Compress HTML, CSS, JavaScript, Text, XML and fonts

# Compress HTML, CSS, JavaScript, Text, XML and fonts

Или что то подобное, поскольку написание этой функции в вашем файле может отличаться.

Если подобных строк вы не нашли, то скорее всего у вас не включена функция сжатия. Чтоб ее включить вставьте следующий код в файл .htaccess и сохраните его.

<IfModule mod_deflate.c> # Compress HTML, CSS, JavaScript, Text, XML and fonts AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/x-font AddOutputFilterByType DEFLATE application/x-font-opentype AddOutputFilterByType DEFLATE application/x-font-otf AddOutputFilterByType DEFLATE application/x-font-truetype AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/otf AddOutputFilterByType DEFLATE font/ttf AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml # Remove browser bugs (only needed for really old browsers) BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html Header append Vary User-Agent </IfModule>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

<IfModule mod_deflate.c>

  # Compress HTML, CSS, JavaScript, Text, XML and fonts

  AddOutputFilterByType DEFLATE application/javascript

  AddOutputFilterByType DEFLATE application/rss+xml

  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject

  AddOutputFilterByType DEFLATE application/x-font

  AddOutputFilterByType DEFLATE application/x-font-opentype

  AddOutputFilterByType DEFLATE application/x-font-otf

  AddOutputFilterByType DEFLATE application/x-font-truetype

  AddOutputFilterByType DEFLATE application/x-font-ttf

  AddOutputFilterByType DEFLATE application/x-javascript

  AddOutputFilterByType DEFLATE application/xhtml+xml

  AddOutputFilterByType DEFLATE application/xml

  AddOutputFilterByType DEFLATE font/opentype

  AddOutputFilterByType DEFLATE font/otf

  AddOutputFilterByType DEFLATE font/ttf

  AddOutputFilterByType DEFLATE image/svg+xml

  AddOutputFilterByType DEFLATE image/x-icon

  AddOutputFilterByType DEFLATE text/css

  AddOutputFilterByType DEFLATE text/html

  AddOutputFilterByType DEFLATE text/javascript

  AddOutputFilterByType DEFLATE text/plain

  AddOutputFilterByType DEFLATE text/xml

 

  # Remove browser bugs (only needed for really old browsers)

  BrowserMatch ^Mozilla/4 gzip-only-text/html

  BrowserMatch ^Mozilla/4\.0[678] no-gzip

  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

  Header append Vary User-Agent

</IfModule>

Если же подобные строки нашлись, то проверьте чтоб код после них совпадал с приведенным выше. Если не совпадает, то добавьте отсутствующие параметры. В итоге код должен получиться именно таким, как на примере выше и ни в коем случае не должен повторяться в файле.

После чего проведите повторную проверку скорости загрузки сайта в PageSpeed Insights. Если все сделано правильно, то предупреждение о том, что нужно включить сжатие должно исчезнуть и оценка сайта должна повыситься.

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

Задавайте появившиеся вопросы по этой теме, постараюсь на них ответить.
Делитесь своими результатами в области оптимизации работы сайтов, предлагайте новые темы для публикаций, подписывайтесь на новости, чтоб всегда быть в курсе происходящего на блоге.

Благодарю вас за внимание и уделенное время! 🙂

 

Включаем gzip-сжатие с использование .htaccess

Gzip — наилучшая практика чтобы сжать контент, тем самым сохранив пользовательский трафик. В этой статье я покажу как сжимать статический контент с использованием Apache и файла .htaccess.

Позвольте начать с небольшого введения. Мы можем сжимать содержимое двумя различными способами: Gzip и deflate.

Введение

Метод Gzip использовался в ранних версиях Apache (до версии 1.3). Таким образом, на данный момент у вас должен быть Apache версии выше 1.3, если нет — обновите до последней версии.

Чтобы воспользоваться преимуществом этого средства сжатия, у вас должен быть установлен Apache с включенным модулем mod_deflate. Чтобы включить этот модуль вы просто должны разкомментировать эту строку в http.conf — конфигурационный файл Apache.

После включения этого модуля ваш сервер будет готов обеспечивать сжатие данных. Но, сервер будет делать это только тогда, когда он получит соответствующие заголовки от клиента. Таким образом, теперь, чтобы включить это вы должны поместить код ниже в файл .htaccess вашего сайта, чтобы сообщить серверу что должно быть сжато.

код .htaccess

<IfModule mod_deflate.c>
  # force deflate for mangled headers
  # developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping/
  <IfModule mod_setenvif.c>
    <IfModule mod_headers.c>
      SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
      RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
    </IfModule>
  </IfModule>

  # HTML, TXT, CSS, JavaScript, JSON, XML, HTC:
  <IfModule filter_module>
    FilterDeclare   COMPRESS
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/html
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/css
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/plain
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/xml
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $text/x-component
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/javascript
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/json
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/xml
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/xhtml+xml
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/rss+xml
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/atom+xml
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/vnd.ms-fontobject
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $image/svg+xml
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $application/x-font-ttf
    FilterProvider  COMPRESS  DEFLATE resp=Content-Type $font/opentype
    FilterChain     COMPRESS
    FilterProtocol  COMPRESS  DEFLATE change=yes;byteranges=no
  </IfModule>

  <IfModule !mod_filter.c>
    # Legacy versions of Apache
    AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
    AddOutputFilterByType DEFLATE application/javascript
    AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
    AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml
    AddOutputFilterByType DEFLATE application/atom+xml
    AddOutputFilterByType DEFLATE image/svg+xml application/vnd.ms-fontobject
    AddOutputFilterByType DEFLATE application/x-font-ttf font/opentype
  </IfModule>
</IfModule>

После размещения кода выше в файл .htaccess обратите внимание на заголовок ответа вашего сайта. Вы увидите один дополнительный заголовок Accept-Encoding. Это означает что запрашивающий клиент получит сжатый контент.

Accept-Encoding:gzip,deflate,sdch

Результат

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

Результат

На изображении выше вы можете увидеть, что фактический размер страницы составляет 707Кб, но после сжатия этот размер составляет 401Кб.

На этом все.

Оригинал

Теги: apache, .htaccess, перевод

Редактировать

Включаем GZIP сжатие в WordPress – Блог про WordPress

Чтобы добиться высокой скорости загрузки вашего WordPress-сайта, важно снизить размер его страниц. Есть ощутимая разница между сайтом, загружающимся в пределах одной секунды, и сайтом, который грузится «со скрежетом», еле-еле. Включение GZIP-сжатия позволяет снизить размер ваших веб-страниц, что отражается на времени загрузки всего ресурса в целом, ускоряет процесс передачи данных клиенту, а также помогает улучшить время до первого рендеринга страниц. Все современные браузеры поддерживают и автоматически согласовывают GZIP-сжатие для всех HTTP-запросов. Сегодня мы расскажем вам, как проверить и включить GZIP-сжатие на вашем веб-сервере.

Что представляет собой GZIP-сжатие?

GZIP – файловый формат, а также программное приложение, используемое для сжатия и декомпрессии файлов. Сжатие GZIP включается на стороне сервера и позволяет дополнительно снизить размер вашего HTML-кода, таблиц стилей и JavaScript-файлов. Оно не работает с изображениями, поскольку они уже сжаты несколько иным способом. Сжатие позволяет добиться снижения размера страниц вплоть до 70%, что подтверждается практическими примерами. Это, вероятно, одна из самых простых оптимизаций, которую вы можете сделать в WordPress.

Когда веб-браузер посещает сайт, он проверяет, включено ли на веб-сервере GZIP-сжатие. Делается это с помощью заголовка ответа «content-encoding: gzip». Если заголовок существует, то в таком случае браузеру передаются сжатые файлы меньшего размера. Если нет, то тогда браузер получает несжатые файлы. Если у вас нет включенного GZIP, то в таком случае вы, скорее всего, увидите предупреждения и ошибки в таких инструментах тестирования скорости, как Google PageSpeed Insights и GTmetrix.

Предупреждение GZIP в Google PageSpeed Insights

Как вы можете видеть, Google указывает на то, что сжатие ресурсов с помощью GZIP или Deflate позволяет снизить количество передаваемых по сети байтов.

Предупреждения GZIP в GTmetrix

GTmetrix также дает рекомендации по включению GZIP-компрессии для снижения передаваемого размера статичных ресурсов.

Как проверить, включено ли сжатие GZIP

GZIP в настоящее время очень распространен. Вам не нужно беспокоиться о браузерной поддержке, поскольку многие браузеры поддерживают его вот уже в течение 17 лет. Ниже представлен список браузеров, которые способны обрабатывать HTTP-заголовок «content-encoding: gzip»:

  • Internet Explorer 5.5+ (июль 2000)
  • Opera 5+ (июнь 2000)
  • Firefox 0.9.5+ (октябрь 2001)
  • Chrome (сразу после запуска в 2008)
  • Safari (сразу после запуска в 2003)

Вы должны убедиться, что GZIP включен у вашего WordPress-хостера, поскольку администраторы серверов нередко упускают из рассмотрения данную оптимизацию. Есть несколько простых способов, позволяющих проверить наличие сжатия GZIP:

  1. Проверка с помощью GZIP Compression Tool

Первый и самый быстрый способ проверки наличия GZIP-сжатия – это использование бесплатной утилиты Check GZIP compression. Просто укажите адрес вашего сайта и нажмите Search. Вы получите общий процент сжатия страницы сайта с помощью GZIP. Либо вы столкнетесь с ошибкой, указывающей на то, что GZIP не включен.  Как вы можете видеть из изображения, мы смогли сохранить 66,9% с помощью подключения компрессии.

Помните о том, что GZIP также применим и к вашим статическим ресурсам. Если вы получаете ресурсы из CDN, то в таком случае вам нужно убедиться, что провайдер CDN также поддерживает сжатие GZIP. Все современные провайдеры CDN поддерживают GZIP-компрессию – Cloudflare, KeyCDN, CloudFront и др. Вы можете также протестировать наличие GZIP, запустив один из ваших CSS или JavaScript-файлов в CDN с помощью инструмента.

  1. Заголовок ответа GZIP

Второй способ проверки – убедиться в том, что заголовок ответа «content-encoding: gzip» активен на вашем сайте. Именно его пытается найти браузер при отправке запроса серверу. Вы можете открыть Chrome Devtools и посмотреть первый заголовок ответа в разделе Network.

Также вы можете выбрать опцию «view large requests», и она покажет вам исходный и сжатый размер страницы. Вы можете видеть на скриншоте, что исходная страница имеет размер 51.6 KB, а сжатая с помощью GZIP страница – уже 17.7 KB.

Как включить GZIP сжатие

Если у вас не включено GZIP сжатие, вы можете сделать это несколькими путями.

Включаем GZIP с помощью плагина WordPress

Первый и самый простой способ – использовать плагин кэширования, который поддерживает GZIP. Плагин WP Rocket, к примеру, добавляет правила GZIP-компрессии в ваш файл .htaccess автоматически с помощью модуля mod_deflate. В W3 Total Cache также есть способ включения сжатия в разделе Performance. Плагины требуют разрешения для изменения файлов на вашем веб-сервере. Если у плагина кэширования нет такого разрешения, то вам нужно обратиться к вашему хостеру или использовать фрагмент кода, представленный ниже.

Включаем GZIP на Apache

Второй способ включения GZIP-сжатия – это редактирование файла .htaccess. Большинство виртуальных хостеров используют Apache. Вы можете просто добавить код ниже в файл .htaccess, который хранится в корневой папке вашего WP-сайта.

<IfModule mod_deflate.c>
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml

# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
</IfModule>

Убедитесь в том, что вы добавили этот код ниже существующего контента вашего .htaccess файла. Пример ниже:

Включаем сжатие GZIP в NGINX

Если вы работаете с NGINX, то в таком случае добавьте следующий код в файл nginx.conf:

gzip on;
gzip_disable "MSIE [1-6]\.(?!.*SV1)";
gzip_vary on;
gzip_types text/plain text/css text/javascript application/javascript application/x-javascript;
Включаем сжатие GZIP в IIS

Если вы работаете с IIS, то в таком случае вы можете использовать два вида сжатия: статичное и динамическое. Мы рекомендуем в этом случае ознакомиться с руководством от Microsoft.

Источник: kinsta.com

Gzip сжатие: что такое и как правильно использовать

Что такое Gzip?

Gzip - это программа для сжатия файлов, а также их распаковки. Основной ее особенностью можно считать, что она умеет сжимать\разжимать файлы "на лету" и не умеет работать с несколькими файлами (чтобы сжать несколько файлов есть хитрость - соединить несколько файлов в один tar-архив и запаковать его с помощью gzip в архив tar.gz).

Смотрите также: как ускорить работу сайта?

Как использовать Gzip?

Чаще всего эту программу применяют для ускорения работы сайтов. Этот процесс достаточно легко описать: например, если пользователь хочет увидеть страницу сайта (размером 100 кб), то в режиме реального времени она сжимается на сервере (например до 50 кб) и передается в браузер пользователя сжатой. Далее браузер распаковывает страницу и показывает пользователю. В итоге мы получаем значительное уменьшение размера страницы, и как следствие более быструю ее загрузку. Но здесь есть одно "но", выигрывая во времени загрузки страницы, мы увеличиваем нагрузку на сервер, т.к. ему нужно обработать операцию сжатия фактически "на лету".

Какие браузеры поддерживают Gzip?

Все популярные на сегодня браузеры поддерживают данную технологию и могут распаковать такие страницы.

Стоит ли мне включать gzip для своего сайта?

На этот вопрос ответ скорее "да", чем "нет". Ведь если ваш сайт (с включенным gzip-архивированием) будет очень сильно перегружать сервер, то часть посетителей попросту не смогут увидеть страницу сайта, на которую они зашли. Им просто будет выдаваться ошибка. Также gzip не всегда дает существенное ускорение загрузки страниц. Это как правило зависит от контента страницы и особенностей сервера на котором находится сайт. В итоге наш вам совет: с помощью сервиса проверки скорости сайта (от Google) измерьте Page Speed своего сайта до включения gzip и после этого. Если разница будет существенной, и Ваш сервер сможет тянуть такую нагрузку (проверить это можно самостоятельно - периодично посещая свой сайт, или же уточнить у хостинг-провайдера), то однозначно нужно использовать данную архивацию на своем сайте.

Как включить gzip сжатие?

Т.к. конфигурации серверов у каждого хостинг-провайдера разные, то нет единого способа включить gzip. Здесь нужно пробовать, т.е. добавлять определенный код в файл .htaccess и смотреть заработало ли ускорение. Посмотреть это можно на этом сайте. Как видно из скриншота, на нашем сайте получилось сжать страницу на 88%.

И так, берем файл .htaccess и добавляем в него такие строки:

<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
<IfModule mod_setenvif.c>
BrowserMatc

Включите gzip сжатие и ускорьте ваш сайт.

Включите gzip сжатие заставка
Привет всем на блоге wpsovet.ru. Следующая статья по оптимизации, разберем еще один пункт PageSpeed Insights. Пост будет короткий, потому что дел на две секунды, даже не буду делать содержание.  Теперь расправимся со сжатием, точнее пункт звучит так «Включите сжатие», а под ним описание «Сжатие ресурсов с помощью функций gzip.», я маленько сократил надпись, опять привожу скриншот.
сжатие gzip в pagespeed
Давайте начнем с самого определения.

Сжатие существует для того чтобы отдавать файлы не по отдельности, а одним архивом. Проще говоря ваш сервер запаковывает в архив файлы, отдает их другому серверу, а тот распаковывает и пользуется ими.

Данная функция очень положительно скажется на скорости блога. У меня есть три способа это осуществить, кодом, плагином, и с помощью своего сервера (но это если у кого есть).

Первый способ вставляем нужный код.

Помните прошлую статью, про кэш браузера, в нем мы так же вставляли код в файл  .htaccess,  тут будет тоже самое. Схема все та же:

  1. Заходим по FTP в свои файлы.
  2. В корне сайта находим .htaccess, скачиваем его.
  3. Открываем его любым редактором, и в самый низ перед тегом #EndWordpress, вставляем этот код.
<ifModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/css text/javascript application/javascript application/x-javascript
</ifModule>

Или

<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/css
  <IfModule mod_setenvif.c>
    BrowserMatch ^Mozilla/4 gzip-only-text/html
    BrowserMatch ^Mozilla/4\.0[678] no-gzip
    BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  </IfModule>
</IfModule>

У меня работали оба, но лучше использовать первый. Сохраняем, и загружаем обратно. Если все сделано хорошо, то вы увидите в PageSpeed Insights, зеленую галочку у пункта «включите сжатие», что говорит о том что gzip работает.

Второй способ, включаем сжатие с помощью плагина.

В прошлой статье мы разбирали плагин hyper cache, в нем есть пункт “Включить сжатие”, на главной странице настроек, ставим галочку и сохраняем.
gzip сжатие и кеширвание
Я читал много статей и отзывов, вроде все работает стабильно, негативных отзывов не слышал. Но я думаю, принцип вам понятен, просто одна галочка и все сделано.

Третий способ с помощью сервера.

Сразу говорю, не на всех хостингах есть эта функция, например на таймвебе ее нет, вообще он скудный на такие вещи, дополнительные программы не про его честь. Мой новый сервер работает на линуксе, и находится в англии, что тоже огромный плюс, но отвлекся. В моей cPanel’и есть пункт “Оптимизировать вебсайт”.
быстрое сжатие блога с помощью хостинга
Я в него захожу и выбираю “сжать все содержимое”, сохраняю и все начинает работать.
плагин сжатия сайта все содержимое

Проверяем работоспособность.

Для проверки предлагаю сервис whatsmyip. Просто заходите на него вводите в поле свой сайт, можете для надежности любую страницу, и смотрите, если вам показали зеленую галочку, то все в порядке и сжатие включено и работает отлично, если нет, то значит что-то сделали не так, проверяйте, все способы рабочие.

проверка на gzip

На этом закончу, если вас интересует, чем пользуюсь я, то отвечу, у меня третий способ, мой хостер уверил меня (я специально задал вопрос) что их программа будет работать лучше чем правила в файле доступа и плагины.

P.S. А какой способ пользуете вы отпишитесь в комментариях.

Источник

Как включить gzip сжатие файлов на хостинге

Скорость загрузки сайта — наиважнейшая весчь для процветания ресурса. Однако блог частенько виснет. А нервные клетки админа транжирятся попусту, ибо он склонен в подобной горести необдуманно ругать нерадивого хостера.

Хотя, по чести, большинство сайтов новичков нуждается в доработке.

Давайте же включим gzip сжатие файлов в.htaccess на сервере, а если понадобится то и на хостинге.

…работаем…


 

Следует сказать вот что: большинство хостеров намеренно не включают режим обслуживания gzip сжатия. Почему!? А потому что большинство админов, в начале своих славных дел, совершают какие-то ошибки в настройках сайта. В частности, страдает html код из-за прописки скриптов улучшалок и т.п.

 

И среди этих ошибок встречаются грубейшие недоработки, которые и ведут к постоянному завису блога, и соответственно нещадно перегружают cpu сервера на вашем хостинге.

Вот по этой причине, хостеры и страхуются, ограничивая…

 

Но мы сегодня говорим о другом… И коли вы уверены в своём детище — вперёд!

 

 

 

к оглавлению $

Как попросить хостера включить gzip сжатие файлов вашего сайта

 

 

 

Советую для начала убедиться в том, что ваш хостинг вообще включил сжатие gzip в режиме mod_deflate.

Для этого следует отправить ласковое коммюнике в техподдержку (Support) и попросить загваздырить соответствующее обслуживание вашему ресурсу.

 

Будьте внимательны! По ответу братии хостеров можно понять, стоит ли вообще связывать свою судьбу с выбранным хостом и его сжатием.

 

…через какое-то время придёт ответ, а вместе с ним (бандероль с кодом-скриптом) вам предложат прописать в ваш файл .htaccess какие-то на их усмотрение нужные строчки.

 

 

 

к оглавлению $

подготовка сайта к режиму gzip-сжатия

 

 

 

Ну а коли ваш хостер плут!! и ничего конкретного не предложит, кроме сухого ответа «gzip-сжатие на вашем аккаунте включено», то вот вам код, который необходимо прописать в .htaccess.

Чтоб не мудрить, прописывайте перед строкой # END WordPress.

 

Внимание! Редакцию файла .htaccess пока не сохраняйте!

 

 

#gzip сжатие
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/javascript text/css application/x-javascript
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0678 no-gzip
BrowserMatch bMSIE gzip-only-text/html
<ifmodule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_item_include file \.js$
mod_gzip_item_include file \.css$ </IfModule>
</IfModule>
# фин gzip сжатие

 

 

Далее целесообразно посетить консоль управления сайтом. А именно настройки какого-то вашего плагина кэширования. Хорошо бы если у вас был установлен WP Super Cache — в его настройках нужно поставить галочку в строке Сжимать файлы кэша чтобы ускорить работу. (Рекомендовано).

Ну а в иных подобных плагинах будет что-то принципиально похожее…

 

Это, возможно, вас избавит от ручного сжатия файлов css и js. А вообще всё проверяйте опытным путём. Тестируйте, ибо реализация правильного gzip сжатия файлов для каждого сайта индивидуальна.

 

Внимание! И регулировку плагина пока не сохраняйте!

 

Итак!! …теперь необходимо пройти вот по этой ссылке.

 

 

Включаем обслуживание gzip сжатия файлов сайта на хостинге и в htaccess

 

 

 

Далее откройте для чистоты экса и ЭТУ ссылку в новой вкладке… Тут неплохо проверять скорость загрузки и ответ сервера… который, к слову, должен быть 200.

 

 

подготовка сайта к режиму gzip-сжатия

 

 

 

Ну и …советую открыть этот модный тестер скоростей… (фото ниже) здесь возможно проверить оптимизацию чтения сайта и на мобильных устройствах !!

…хотя, думаю, на многие значения тестера обращать внимание не стоит…

 

К слову, на фотках показаны приличные значения, но !! если они будут у вас ниже, совсем не значит то, что нужно поднимать «пыль» и бить тревогу — я знаю достаточно сайтов, которые замечательно живут и много более низкими значениями — всё зависит от целей и сообразностей админа !  …но об этом подробнее в иной подходящий по теме раз…

 


подписка feedburner Online консультация по работе c сайтом на WordPress

 

 

 

 

как включить gzip сжатие на хосте и в файле htaccess

 

 

 

Идём дальше… .htaccess у нас поправлен… плагин кэширования включен, НО !! настройки пока не сохранены.

 

 

Ну что!?

Проверяем работу сайта без включенных вышеописанных настроек.

 

 

Вбейте домены вашего тестируемого сайта и жмите пуск. …

 

 

У вас вряд ли по началу будет так же как на фотках — но не отчаивайтесь! К результатам… нужно стремиться!! …и коли нынче не удастся достичь подобного, завтра подправите, и получится..!

 

 

 

Немного поясню по работе тестеров: примерные значения, на которые следует обратить взор, я подчеркнул, — в этом тестере-анализаторе нам потребуются именно они. А на скорость загрузки советую внимания не обращать — эта услуга частенько глючит.

 

На страничке же вглядитесь в информационные величины своего ресурса ( вес в кб вашего блога ВООБЩЕ — подчёркнуто вверху). Ну и на файлы стилей — style.css И js 1.11.3 (если он у вас в работе, то вес js-документа в несжатом состоянии 95кб).

Запомните эти величины… для дальнейшего сравнения работы правильного gzip сжатия.

 

 

 

Всё! Далее серьёзно… Давайте вернёмся в файловый менеджер и сохраним новую редакцию .htaccess (с кодом) и в админконсоли сохраним поставленную галочку в чекбоксе настроек плагина WP Super Cache.

 

 

Вновь вернёмся на странички анализаторов… Проверяем!

 

 

В некоторых случаях, вышеописанных регулировок по gzip-сжатию бывает достаточно, масса сайта значительно сокращается… а соответственно и сокращается же время скорости загрузки страниц блога.

 

 

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

 

 

Тогда следует поступить так:

 

 

 

 

к оглавлению $

Усиливаем gzip-сжатие в документе .htaccess

 

 

 

Вновь открываем файл и дописываем следующие кодированные примеры:

 

 

 

включаем кэширование в браузере на стороне пользователя

 

 

# Перенаправление на gzip файлы
AddEncoding gzip .gz
<FilesMatch "\.js.gz$">
ForceType text/javascript
Header set Content-Encoding: gzip
</FilesMatch>

<FilesMatch "\.js$">
RewriteCond %{HTTP_USER_AGENT} !".*Safari.*"
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule (.*)\.js$ $1\.js.gz [L]
ForceType text/javascript
</FilesMatch>

<FilesMatch "\.css.gz$">
ForceType text/css
Header set Content-Encoding: gzip
</FilesMatch>

<FilesMatch "\.css$">
RewriteCond %{HTTP_USER_AGENT} !".*Safari.*"
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule (.*)\.css$ $1\.css.gz [L]
ForceType text/css
</FilesMatch>
# Перенаправление на gzip файлы

 

 

 

 

к оглавлению $

Включаем gzip кэш-компрессию в браузерах посетителей

 

 

 

 

# Включаем кэш в браузерах посетителей
<ifModule mod_headers.c>
# Отключаем кеширование php и других служебных файлов
<FilesMatch "\.(pl|php|cgi|spl|scgi|fcgi)$">
Header unset Cache-Control
</FilesMatch>
</IfModule>
# Включаем кэш в браузерах посетителей

 

# кеширование в браузере на стороне пользователя
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access 7 days"
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType text/javascript "access plus 1 year"
ExpiresByType text/css "access plus 1 year"
ExpiresByType text/html "access plus 7 day"
ExpiresByType text/x-javascript "access 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/x-icon "access 1 year"
ExpiresByType application/x-shockwave-flash "access 1 year"
</IfModule>

# Cache-Control
<ifModule mod_headers.c>
# 30 дней
<filesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>
# 30 дней
<filesMatch "\.(css|js)$">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>
# 2 дня
<filesMatch "\.(xml|txt)$">
Header set Cache-Control "max-age=172800, public, must-revalidate"
</filesMatch>
# 1 день
<filesMatch "\.(html|htm|php)$">
Header set Cache-Control "max-age=172800, private, must-revalidate"
</filesMatch>
</ifModule>

#Запрет отдачи HTTP-заголовков Vary браузерам семейства MSIE
<IfModule mod_setenvif.c>
BrowserMatch "MSIE" force-no-vary
BrowserMatch "Mozilla/4.[0-9]{2}" force-no-vary
</IfModule>
# кеширование в браузере на стороне пользователя

 

Кстати сказать, этот пример у меня работает неплохо…

 

Строки от 4 — по 16 — время хранения форматов картинок: указан 1 год (возможно регулировать).

…далее время хранения и сброса кэша документации. Это если коротко (а вообще, все эти величины тема отдельной статьи).

 

 

А вот ещё один вариант: (новое решение)

 

# Настройка кэширования на медиа-файлов в течение 1 недели
<FilesMatch "\.(gif|jpg|jpeg|png|swf)$">
ExpiresDefault A604800
Header append Cache-Control "public"
</FilesMatch>
# Настройка кэширования на медиа-файлов в течение 1 недели

# Настройка 2 часа кэширование на часто обновляемых файлов
<FilesMatch "\.(xml|txt|html|js|css)$">
ExpiresDefault A7200
Header append Cache-Control "proxy-revalidate"
</FilesMatch>
# Настройка 2 часа кэширование на часто обновляемых файлов

 

 

 

к оглавлению $

Усиливаем выполненное кеширование в .htaccess

 

 

# Усиливаем кеширование
FileETag MTime Size
<ifmodule mod_expires.c>
<filesmatch ".(jpg|jpeg|gif|png|ico|css|js)$">
ExpiresActive on
ExpiresDefault "access plus 1 year"
</filesmatch>
</ifmodule>
# Усиливаем кеширование

 

 

Сохраняйте редакции!

 

 

После этого кэширование и gzip-сжате файлов должны включиться в нормальный режим работы.

 

Поздравляю…

 

НО! Ввиду разности ресурсов и их отработки с определённым скриптом, вам всё же предстоит подстроить свой блог. Попробуйте исключать какие-то показанные выше коды (очень возможно, что в вашем случае какие-то кодированные элементы не понадобятся), и таким образом, настроить более оптимальную работу, ибо незачем перегружать файлы лишним скриптом.

 

Можете перейти ещё на одну страничку тестера и справиться о результатах там.

 

 

 

Включаем кеш компрессию в браузерах посетителей

 

 

В последней строке показан процентный итог того, на сколь легче стал ваш блог или сайт. На картинке 75% сброшено, за счёт сжатия документации блога…

 

 

На этом занавес представления опускается… НО !!

 

 

Очень важно !!

Прописка кода в файл functions.php, это дело хорошее !! Однако не всё и вся стоит в него пихать – правильнее (и для скорости загрузки в том числе) сгруппировать некоторые циклы кода в оформленном плагине: легко, надёжно и правильно в плане создания сайта.

 

Все доказательства «ЗА» читать:

Вот ссылка – как сделать собственный плагин WordPress – добавочный файл my-functions.php

 

 


подписка feedburner Online консультация по работе c сайтом на WordPress

 


...город веб мастеров Михалика.ru © - запросто с WordPress

 

 

Кино: сохраняем все настройки браузера !! это на случай аварии или переустановки ОС или самого браузера Firefox.

 

...вопросы в комментариях - помогу, в чём дюжу...

mihalica.ru !

нужно знать создание сайта - начало контент важное wp ускоряем сайт htaccess - config.php

Отправить ответ

avatar
  Подписаться  
Уведомление о