Тормозит сайт. Много мелких HTTP запросов?


Тормозит сайт.  Много мелких HTTP запросов?

Из чего состоит сайт?

Красивые современные сайты состоят не только из html-кода, как правило современный сайт состоит из множества файлов загружаемых в браузер пользователя при входе на сайт. Это сам файл с html-кодом страницы, файлы JavaScript, таблицы стилей CSS и CSS3, фотографии, графики, иллюстрации и др. изображения, дополнительные объекты Flash, Java, Silverlight, а также содержимое iframe или динамический контент.

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

 

Почему много файлов тормозят загрузку?

Загрузка каждого отдельного файла  CSS, JavaScript или отдельного изображения производится созданием отдельный запроса из браузера к серверу,  а это требует время на установление соединение и передачу запрошенного файла с сервера. Чем больше подгружается изображений и файлов, тем больше времени уйдет на обработку всех запросов и тем медленнее будет сайт у пользователя.

По статистике, на продвинутом сайте может быть 20-30 CSS файлов (стилей сайта),   10-20 файлов кода javascript и до 50 файлов различных изображений. Каждый из перечисленных в html-странице файлов начинает загружаться после отправки запрос на предшествующий файл и он был передан с сервера в браузер.

 

Как оптимизировать сайт?

Загрузку страницы можно оптимизировать слудующими шагами:

  • Объединить все файлы стилей в один CSS файл;
  • Объединить все файлы Javascript в один файл;
  • Cжать файлы CSS и Javascript;
  • Включить асинхронную загрузку;
  • Включить отложенный запуск джава-скриптов;
  • Переместить загрузку css и js файлов вниз html-страницы.

 

Интересный момент:  можно поступить иначе – включить все CSS, javascript прямо внутрь html-страницы. Страница получится большая, однако если на сервере включено сжатие трафика то такое можно сделать без потери скорости сайта.