Увеличение скорости загрузки блога. Сервис Web Optimizator

Как известно, посещаемость блога, а также лояльность читателей очень сильно зависит от скорости загрузки блога. Бывает так, что некоторые интересующиеся просто не будут ждать когда белый экран загрузки сайта сменится замечательным дизайном вашего блога и интереснейшими анонсами ваших статей. Маленькая скорость загрузки может просто отпугнуть нового читателя. Скорость загрузки надо оптимизировать.

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

Дружелюбность и бескорыстие сервиса Web Optimizator приятно удивляют. Форма ввода адреса испытуемого сайта расположена в шапке на каждой странице сервиса.

скорость загрузки блога

Вводим наш адрес http://www.eavasi.ru/ (это мой, вы вводите свой). Через несколько секунд появляется солидный список с пунктами, над которыми надо работать, а в верхнем виджете высвечиваются оценки, определяющие в относительных величинах скорострельность вашего блога, а также, как главный показатель, процент того, насколько можно разогнать исследуемый сайт.

скорость загрузки блога

Давайте разберем каждый из пунктов рекомендаций по оптимизации моего блога.

1. Загружается более 1 HTML-файла.
Стоит подумать над реорганизацией структуры страницы, чтобы не выполнять дополнительные запросы к серверу.
Здесь же приводится ссылка на переводную статью «Обходим ограничения браузера на число соединений» , в которой даются весьма грамотные советы по оптимизации сайта, которые грамотные веб мастера вполне могут применить в жизнь.

2. Загружается более 1 CSS-файла.
Рекомендуется объединить все файлы в один внешний или даже включить его в итоговый HTML. Это позволит сократить количество запросов к серверу.
Это вполне применимо к движку WordPress, но только если всегда пользоваться одним и тем же шаблоном и не искать ничего нового.

3. CSS-файлы загружаются через условные комментарии.
Обнаружено несколько (всего 2) CSS-файлов, которые загружаются с помощью условных комментарии. Рекомендуется объединить все файлы в один внешний, спрятав характерные для Internet Explorer свойства с помощью линейных (inline) хаков, например, * html или даже включить их в итоговый HTML. Это позволит сократить количество запросов к серверу.

4. CSS-файлы можно уменьшить в размере.
Рекомендуется воспользоваться инструментом для сжатия CSS-файлов (основанном на проекте CSS Tidy). После этого можно отдавать CSS-файлы в виде архивов с сервера (общий выигрыш до 85%). Подробнее о сжатии CSS-файлов.
Здесь дается ссылка на сервис сжатия CSS файлов, я еще не пользовался, надо обязательно попробовать. Неужели заработает. Только надо не забыть сделать резервную копию файла перед обработкой.

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

6. Не включено кеширование для статических файлов.
Рекомендуется отдавать все ресурсы (картинки, CSS- , JS- и мультимедиа файлы) с кеширующими заголовками (Cache-Control, уменьшая тем самым количество запросов с клиента при последующих посещениях или использовании этих файлов для просмотра других страниц сайта). Подробнее о включении кеширования для Apache и форсированном отключения кеширования. Всего файлов не из кеша: 203.
На моем блоге установлен и включен плагин Hyper Cash, точнее, та его версия, в которой, ничего не говориться про кеширование статических страниц. Необходимо разобраться с этим вопросом. А может стоит просто увеличить периодичность очистки кеша? Можно поэкспериментировать...

7. На сайте не включены ETag или Last-Modified.
Некоторые файлы на сайте уже имеют ETag / Last-Modified (всего: 198). Рекомендуется отдавать все статические файлы c кеширующим ETag- или Last-Modified-заголовком (уменьшая тем самым количество запросов с клиента при последующих посещениях или использовании этих файлов для просмотра других страниц сайта). Подробнее о включении ETag для Apache. Всего файлов без ETag / Last-Modified: 4.
Здесь же ссылка на статью, которая написана в таком стиле, чтобы запутать неискушенного манимейкера и отбить у него охоту что-то делать в плане оптимизации скорости загрузки, самому, а заказать эту самую оптимизацию на сайте рассматриваемого сервиса.

8. Загружается более 1 JS-файла.
Рекомендуется объединить все файлы в один внешний или даже включить его в итоговый HTML. Это позволит сократить количество запросов к серверу. Также для загрузки JS-файлов можно воспользоваться техникой «ненавязчивый» Javascript, которая позволит уменьшить число первоначальных запросов к серверу.

9. JS-файлы можно уменьшить в размере.
Рекомендуется воспользоваться инструментом для сжатия JS-файлов от Dean Edwards или YUI Compressor (подробнее о минимизации JS-кода). После этого можно отдавать JS-файлы в виде архивов с сервера (общий выигрыш до 70%).

10. JS-файлы слишком велики.
Может быть, стоит попробовать разбить их на несколько и подгружать только по необходимости, используя технику «ненавязчивый» Javascript или модульную загрузку.

11.Присутствуют дублирующиеся запросы.
Дублирование CSS- и JS-файлов необходимо устранить. Многократного использования одних и тех же картинок можно избежать, используя стили.


12. При загрузке страницы запрашивается слишком много хостов.
Слишком большое количество различных хостов при обращении к ресурсам страницы способно замедлить ее загрузку (потому что уходит определенное время на установление соединения с каждым). Рекомендуется ограничиться 4 хостами. Зафиксированное число хостов: 10.
А куда тут денешься от лишних ссылок – это же блог, а не обычный сайт.

13. При загрузке вебсайта обнаружены редиректы.
Каждое перенаправление (redirect) увеличивает время загрузки конечного ресурса на клиенте, необходимо устранить все таки перенаправления. Всего зафиксировано редиректов: 1.
Редирект – это полезная штука, если по-простому, то это – перенаправление. Без него никуда не денешься.

14. Обнаружены 404-ошибки.
При загрузке сайта обнаружены ссылки на несуществующие ресурсы (всего 2), все такие ссылки необходимо убрать или исправить их на действующие.
Иногда записи и страницы приходится удалять или переименовывать.

15. Некоторые GIF-изображения можно уменьшить в размере.
На сайте обнаружены GIF-изображения (всего: 57), размер которых можно уменьшить, если преобразовать их в PNG (например, с помощью gif2png или gifsicle). Подробнее о преимуществах формата PNG.

16. Некоторые PNG-изображения можно уменьшить в размере.
На сайте обнаружены PNG-изображения (всего: 9), размер которых можно уменьшить, если убрать из них ненужную информацию (например, с помощью pngcrush). Подробнее о преимуществах формата PNG.

17. Некоторые JPEG-изображения можно уменьшить в размере.
На сайте обнаружены JPEG-изображения (всего: 9), размер которых можно уменьшить, если убрать из них лишние комментарии без потери качества (например, с помощью jpegtran или портированного под Windows пакета jpeg).
Я бы, все таки, отдал предпочтение Adobe Photoshop, чем этим никому неизвестным программам, в плане оптимизации изображений для веб ему нет равных.

Короче, выводы такие – все эти рекомендации очень хороши и полезны, но не все применимы для WordPress, можно использовать их, как руководство к размышлению, но не к действию. Пунктов 15-17 это, конечно, не касается.

  1. Зайва Игорь Леонидович

    Хорошо отписали, как время будет, на днях тоже нужно бы залезть посмотреть, чего мой тормозит... Пора бы оптимизировать, да что-то руки никак не доходят, приходится миллион мелочей изучать.

    1. eavasi

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

  2. Зайва Игорь Леонидович

    Хорошо отписали, как время будет, на днях тоже нужно бы залезть посмотреть, чего мой тормозит... Пора бы оптимизировать, да что-то руки никак не доходят, приходится миллион мелочей изучать.

    1. eavasi Автор записи

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

  3. Зайва Игорь Леонидович

    Походу, 3 последних комментария можно удалить, включая этот... 🙂 sunnybear — либо спамщик, либо прибег к помощи школьников для ручного спама. Я у себя такие удаляю вручную, если акисмет не ловит 😉

  4. Зайва Игорь Леонидович

    Походу, 3 последних комментария можно удалить, включая этот... 🙂 sunnybear — либо спамщик, либо прибег к помощи школьников для ручного спама. Я у себя такие удаляю вручную, если акисмет не ловит 😉

  5. osminog

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

    1. eavasi

      @osminog, средства для уменьшения фото без потери качества нет лучше чем Фотошоп (Сохранить для ВЕБ). Там же есть пакетная обработка данных, где по шаблону можно обрабатывать хоть миллиард изображений никак в этом процессе не участвуя.

  6. osminog

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

    1. eavasi

      @osminog, средства для уменьшения фото без потери качества нет лучше чем Фотошоп (Сохранить для ВЕБ). Там же есть пакетная обработка данных, где по шаблону можно обрабатывать хоть миллиард изображений никак в этом процессе не участвуя.

Добавить комментарий

Ваш e-mail не будет опубликован.

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.