Скорость загрузки сайта

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

У меня нет точных статистических данных, но и без этого должно быть понятно, что плохая скорость загрузки сайта снижает конверсию (пруфы). А ещё скорость загрузки влияет на ранжирование этого сайта в поисковых системах (общеизвестный факт, так что пруфы гуглите самостоятельно).

Сама же скорость загрузки, которая, как выяснилось, много на что влияет, зависит тоже от огромного множества факторов. Нам повезло, т.к. на многие из них мы вполне можем повлиять.

Сервисы для проверки скорости загрузки

loading.express — сервис, дающий хорошую статистику по главной странице сайта. Частенько использую его, чтобы указать заказчику на проблему со скоростью загрузки.
be1.ru/site-speed/ — сервис, где можно узнать текущую скорость загрузки вашего сайта. Если цифра больше одной-двух секунд, то это желательно исправить.

Как увеличить скорость загрузки сайта?

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

Остальным могу предложить только теоретические знания, описанные ниже.

Кэширование для CMS

Если вы используете CMS, то по умолчанию страница генерируется только во время запроса пользователя.

Представьте, что вы пришли в библиотеку, и вам там не дают готовую книгу, а печатают её при вас.
Было бы глупо и долго, не правда ли?

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

Такой подход значительно ускоряет загрузку страницы у конечного пользователя, иными словами must have.

Работа с CSS и JS

Когда браузер пользователя загружает страницу, то натыкаясь на CSS или JS он, как правило, останавливает загрузку html кода и переключается на загрузку этих файлов.
Таким образом выходит, что данные типы файлов блокируют загрузку основного контента.

У данной проблемы огромное множество решений:

  • Объединение и разъединение (когда создаются отдельные стили для верхней части страницы);
  • Минификация;
  • Асинхронная загрузка;
  • Перемещение в коде страницы ближе к концу;
  • Подставка их содержимого в html код.

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

Сжатие HTML кода

Чем меньше код – тем проще и быстрее его передать, логично же, да?

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

Сжатие изображений

Если на странице присутствуют изображения, то они тоже должны быть сжаты.

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

Cжатие gzip

Тоже интересная вещь, про которую не все знают.

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

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

Кеш браузера

Тоже полезная возможность, которую тоже нужно обязательно включить и которая тоже иногда не отображается как включённая.

Если коротко, то браузер клиента может кэшировать некоторые элементы сайта и не загружать их снова при повторном посещении.
С одной стороны — это, конечно, очень удобно, а с другой может возникнуть ситуация, когда у клиента закэшируется устаревшая версия какой-либо страницы. Для полного обновления ему нужно нажать Ctrl+F5.

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

Время ответа сервера

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

К сожалению, влияющих на время ответа сервера параметров так много, что тут я вам не помогу.
Тут и мощность сервера, и количество доступной памяти, и физическое его расположение…и ещё много чего, я уверен.

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

Поэтому, рекомендую проверять скорость ответа несколькими способами.
Например, вот сервис показывающий скорость для разных стран — mts.webopulsar.ru/test

CDN

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

Обычно такие сервисы платные, хотя вроде бы есть бесплатный CloudFlare, использование которого в России весьма сомнительная идея, если вам нужен только CDN.