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

В последнее время домашний интернет достиг серьезных скоростей. 40-60 мегабит в секунду - это нормально. С другой стороны, посмотрите на этот график -это статистика по посетителям сайта за последние 4 года.

Доля мобильного трафика за 2011-2015 год

Сейчас практически 25% трафика идет с мобильных устройств. Причем это сайт владимирской компании. Уверен, что в Москве доля мобильного трафика сейчас ещё выше. А теперь вспомните, как быстро у вас работает мобильный интернет? А если это полуподвальное помещение? А если отъехать от города на 20 километров?

В регионах быстрый интернет для юридических лиц стоит до сих пор дорого. Причём обычно это какие-нибудь 2 мегабита, которые распределяются на 20 компьютеров.

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

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

Влияние хостинга

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

Если ваш сайт расположен на хорошем VDS, либо на полностью выделенном сервере, то загружаться он будет с более высокой скоростью. Конечно, виртуальный хостинг дешевле, чем VDS. Если это корпоративный сайт, то переплатить 300-400 рублей в месяц не критично. Даже если на выделенном сервере 50 или 100 сайтов он все равно в большинстве случаев будет гораздо быстрее.

Серверы

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

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

На чем сделан сайт

Сайты бывают написанные с нуля, а также сделанные на основе систем управления сайтами или фреймворками. Самописные сайты на чистом HTML самые быстрые, но и самые не функциональные и сложно обновляемые. Если вы делаете 5-10 страничный сайт, информация на котором не будет меняться месяцами, а то и годами. Если его функциональность будет максимально простой, то можно использовать чистый HTML. Это обеспечит максимальную скорость.

Следующими по скорости идут сайты, сделанные с помощью фреймворков. Они могут быть написаны на разных язык программирования, будь то php, ruby или python. Примеры фреймворков: yii, lavarel, symphony, ruby on rails, django, node js и многие другие. Выбор фреймворка - это отдельная гигантская тема. Но могу сказать о том, что с помощью фреймворка для сайта пишется система администрирования именно под вас, функциональность сайта реализовывается именно в нужных объемах. То есть сайт получается полностью индивидуальным, в нём нет ничего лишнего. Естественно, это положительно влияет на его скорость. Но сделать такой сайт достаточно сложно и дорого. Требуются знания и опыт у веб-программистов.

Админка MODX

Самый распространенный и простой способ сделать сайт - это использовать систему управления сайтом (CMS). Между собой они достаточно сильно отличаются по функциональности. Самая популярная CMS в мире - это Wordpress. У неё просто огромное количество плагинов и готовых решений. Но за кажущейся простотой кроется громоздкость. 90% функциональности Wordpress ваш сайт скорее всего использовать не будет, но на скорость загрузки всё это влиять точно будет. Можно вручную удалять лишний функционал, но я предпочитаю использовать CMS, где изначально всё чисто и понятно. Примером такой системы является MODX Revo. Это одна из самых популярных CMS. Возможно она чуть сложнее в освоении, но гибкость MODX ставит её ближе к фреймворкам, чем к CMS.

Количество запросов к серверу

Каждая страница сайта состоит из множества небольших файлов. Обычно, это картинки, ccs и js-файлы. Текущие интернет-технологии не позволяют загружать все файлы одновременно. Они загружаются порциями. Пока не загрузилась одна порция, другая ожидает своей очереди. Чем меньше будет количество запросов, тем быстрее загрузится сайт. С помощью сайта GT Metrix можно посмотреть как проходит загрузка вашего сайта. Таблица с поочередно загружаемыми файлами, кстати, называется водопадом.

Водопад загрузки файлов

Варианты сокращения количества запросов:

  • объединить содержимое всех css файлов в один;
  • объединить все js файлы в один;
  • использовать js код внутри содержимого страницы;
  • при возможности объединить графические элементы сайта.

Пример объединения изображений

Размер загружаемых файлов

Практически каждый из загружаемых файлов можно сжать. Изображения сжимаются сервисами типа Compress jpeg или обычным фотошопом. В фотошопе используйте пункт меню "File->Save for web". Выбираете качество в районе 60. Файл будет очень мало.

CSS файлы сжимаем сервисом CSS Compressor. Javascript файлы сжимаем тут - jscompress.com. Поверьте, важен каждый килобайт. Главное не переусердствовать. Файлы должны быть читаемыми, самую максимальную степень выбирать крайне не желательно. Делать из качественных фотографий непонятно что - тоже не стоит. Надо найти компромисс.

Сервисы для проверки скорости сайта

Начать проверку своего сайта можно с сервиса Google PageSpeed Insights. Тут же будут даны рекомендации по устранению некоторых проблем, которые затрудняют загрузку сайта. Но некоторые их них исправить просто невозможно. Результат выше 90 баллов можно считать хорошим.

Результаты теста

Затем можно зайти на сайты webpagetest.org и gtmetrix.com. Там вы получите уже подробные результаты и пути их решения.

В яндекс метрике в разделе "Мониторинг" есть пункт "Время загрузки страниц". Здесь можно выбрать под графиком несколько значений, но нас в первую очередь интересуют "Время до полной загрузки" и "Ответ сервера". Ответ сервера должен быть до 200 мс. А время полной загрузки, чем меньше, тем лучше. Приведу график по сайту Диспетчерская 33. На нём видно как после оптимизации скорость загрузки главной страницы упала с 4 до 2 секунд.

Пример оптимизации сайта

Спасибо, что дочитали до конца. Надеюсь, что эта статья была вам полезна. Готов ответить на вопросы в комментариях.

Автор: . Дата публикации:

Больше материалов с сайта: