Чтение RSS каналов

Форум

Открыть Ответить

PageSpeed Insights от Google – Ускорение и оптимизация сайта

5

5
1
27.06.2015 14:27:1327.06.2015 14:56:39
В связи с большим количеством вопросов поступающих к нам на почту, а так же на форуме проекта, решил уделить время вопросу ускорения сайта и инструменту тестирования скорости PageSpeed Insights от Google.

Как же победить PageSpeed Insights и ускорить загрузку сайта?

1. Сжать код в JavaScripts, для этого существуют специальные программы или сервисы типа: http://closure-compiler.appspot.com

2. Сжать код CSS файлов, так же есть онляйн сервисы: http://csscompressor.com

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

3. Сократить размер графических файлов, можно воспользоваться программой для редактирования графики, в том же Photoshop такая возможность есть, при сохранении графики для Web выберите процент оптимизации/сокращения. Рекомендую сжатие не ниже 50%, как правило, этого достаточно для jpg, png форматов, в противном случае будет видимо ухудшение качества.

4. Наверное, самые важные параметры, которые от вас не зависят, это использование модов для сервера. Проконсультируйтесь у хостера, установлены ли у него модули Apache mod_deflate и mod_expires, есть альтернативы для Nginx.

Как вариант, можно проверить непосредственно в PHP, функция phpinfo();

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

# Deflate compression and expires by mime type
<IfModule mod_deflate.c>
<FilesMatch "\.(js|jpg|jpeg|gif|png|css)$">
ExpiresActive On
ExpiresDefault "access plus 1 month"
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>

Что они делают?

• mod_deflate - В данном случае, сжатию подвергаются все текстовые файлы, типа: js, jpg, jpeg, gif, png, css.

• mod_expires - Устанавливает время актуальности кэшированных данных (сроком на один месяц), в нашем случае на файлы типа: js, jpg, jpeg, gif, png, css.

Указанный выше метод является универсальным. Есть несколько других модов, позволяющих производить вышеуказанные манипуляции, это: mod_gzip, mod_pagespeed, mod_headers. В данной инструкции обсуждаться не будут в виду их не высокой популярности.

5. Можно перенести JavaScripts в низ сайта, оптимизация не значительная, но прибавит PageSpeed Insights один пункт. В SLAED CMS 6 Pro это возможность существует, настройка в конфигурациях системы.

6. Как рекомендует PageSpeed Insights, вынести содержание CSS и JavaScript файлов непосредственно в код страницы, вариант весьма спорный, так как, на мой взгляд, не соответствует современным стандартам. Но почему бы и нет, можно попробовать, даже если только в качестве эксперимента.

В качестве теста, на нашем проекте воспользовались только четвёртой рекомендацией, получили «Зелёный 88/100» результат для варианта Desktop от PageSpeed Insights.

При соблюдении как минимум первых четырёх рекомендаций, подымите процент соответствия PageSpeed Insights как минимум до 90%. Которых достаточно для попадания в «зелёную зону».

Немного позже подготовлю более подробную статью по оптимизации сайтов под PageSpeed Insights от Google. Инструкция будет размещена в отделе документации системы.

О сколько нам открытий чудных,
Готовит просвещенья дух,
И опыт, сын ошибок трудных,
И гений, парадоксов друг...
3.24

3.24
2
17.03.2016 11:35:45
все понятно, спасибо. Фотки дают самый большой трабл (надо по умолчанию ставить загрузку фоток не более мегабайта-двух)

Seo просування сайтів Львів
0

0
Открыть Ответить
Хотите опробовать SLAED CMS в действии?

Технологии

PHP MySQL HTML 5 CSS 3 jQuery jQuery UI

Контакты

  • D-49179, Deutschland
    Ostercappeln, Im Siek 6
  • +49 176 61966679

  • https://slaed.net
Идеи и предложения
Обратная связь