YSlow - оптимизация загрузки сайта

С появлением быстрого интернета веб-разработчики забыли о временах, когда изображения нарезались в несколько слоев, комбинируя достоинства многоцветного JPEGа и четкого GIFа, а HTML код упрощался не из-за блочной верстки. Не успели привыкнуть к скоростям, как опять сайты начали медленно грузиться.

Плагин не делает никакой магии, но позволяет составить хоть какое-то мнение о том, насколько все плохо.

Поехали:

1. Get Firefox . com.
2. Get Firebug . com.

Упомянул шаги только из-за забавных доменов.

Теперь устанавливаем сам YSlow. Плагин находится в централизованном хранилище (Tools → Add-ons → Закладка «Get Add-ons» → Поиск «yslow» → Add to Firefox… → Перезапускаемся).

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

Чем он полезен? Он оценивает уровень оптимизации сайта. По шкале, которая применяется в американской системе образования, надо полагать. Ну, и по 100-бальной шкале тоже. Критериев много: одна часть бесполезных, другая — банальных и известных.

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

73/100 — По Уфе
67/100 — Желтые страницы
61/100 — Вся Уфа
58/100 — Уфанет
52/100 — Башинформ

На первой вкладке, кроме самой оценки, плагин дает советы по оптимизации. Детально они изложены на сайте разработчика.

На второй вкладке отображается информация о каждом из ресурсов сайта (изображения, скрипты). Заголовки, время отклика, размер — все здесь же можно посмотреть.



На третьей вкладке отображается то, что многочисленные баннеры на сайте желтых страниц все таки кешируются :-)

Четвертая вкладка содержит какие-то инструменты для ускорения загрузки сайта.

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

8 комментариев

avatar
  • MFD
  • +1
73/100 — По Уфе
67/100 — Желтые страницы
61/100 — Вся Уфа
58/100 — Уфанет
52/100 — Башинформ

странная оценка
avatar
  • akhmetov
  • 0
По Башинформу думаю такая оценка по большей части из-за того, что сервер не отдает Expires в заголовках — из-за этого при каждом переходе со страницы на страницу браузер делает 122 запроса, из которых 121 не несут никакого содержания, а просто ответы Not-Modified. То есть браузер ничего не грузит, но ответы на запросы все равно ожидает.

Ну, и 9 файлов стилей и 11 файлов с JS. Возможно и это.
avatar
  • MFD
  • 0
По Башинформу думаю такая оценка по большей части из-за того, что сервер не отдает Expires в заголовках — из-за этого при каждом переходе со страницы на страницу браузер делает 122 запроса, из которых 121 не несут никакого содержания, а просто ответы Not-Modified. То есть браузер ничего не грузит, но ответы на запросы все равно ожидает.

это битрикс… хотя думаю надо смотреть настройки сервака
Ну, и 9 файлов стилей и 11 файлов с JS. Возможно и это. 

это критично? кроме лишнего http-запроса?
avatar
  • akhmetov
  • 0
1. Можно настроить.
2. Не критично. Там других запросов хватает.
avatar
  • MFD
  • 0
а как еще можно оптимизировать?

все мелкие картинки какие возможно в спрайты перенес
www.bashinform.ru/bitrix/templates/binf.final/img/menuheaders/h.png
www.bashinform.ru/bitrix/templates/binf.final/img/dd.media.gif

avatar
  • akhmetov
  • 0
Да, видел. YSlow не я придумал ) Это не самая главная оценка.
Логично конечно же запрос «If-Modified-Since» у браузера и ответ «Not-Modified» — все по правилам. Но все ж лучше кешировать, а если надо принудительно обновить, то к файлу как ".css?123" обращаться.
avatar
  • akhmetov
  • 0
Еще на отсутствие сжатия статики жалуется. Но это опять все к настройкам сервера. В битриксе есть модуль «Компрессия», но он только сам HTML сжимает (Content-Encoding: gzip).
avatar
  • akhmetov
  • 0
Но вообще оценка требует и человеческого обоснования. Вот у Apex.ru незаслуженные 72/100, но при этом напрочь забыли про кеширование изображений. В статье их на 2 мегабайта. И каждый раз грузятся.
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.