Рано или поздно все начинающие веб-мастера сталкиваются с проблемой скорости загрузки страниц сайта. Владельцы сайтов на платформе WordPress не являются исключением. Спустя месяц-два все сайты на WordPress начинают “тупить”, причиной того может стать много факторов. В данной статье мы разберем основные причины и способы как ускорить сайт на wordpress.
10 советов по ускорению загрузки сайта на WordPress
Для того что бы ускорить наш сайт нужно предпринять ряд действий. Для начала давайте проанализируем нашу скорость загрузки страниц с помощью pingdom.com.
Это будет нашей отправной точкой для начала работы. И какой бы не была страшной первоначальная цифра, не беда, благодаря нашему руководству вы снизите скорость загрузки сайта в разы.
Давайте перечислим как возможно ускорить сайт на wordpress:
- gZIP сжатие;
- уменьшаем css и JavaScript;
- сокращение размера заголовка отзыва;
- очистка базы данных от мусора;
- убрать лишний JavaScript;
- использовать кэширование для статического контента;
- расположение css и JavaScript;
- пользуйтесь поддоменами для паралельного скачивания;
- откажитесь от ненужных плагинов;
- выберите быстрый хостинг для своего сайта.
На первый взгляд работы предстоит много, но разобравшись что к чему это не займет у вас больше полу часа, а “выхлоп” от проделанного пути будет колоссальным. Давайте разберем каждый предложенный пункт более детально и проведем ускорение сайта на WordPress.
Совет 1. Ускорение WordPress с помощью GZip сжатия
Браузеры имеют свойство получать страницы сайта в сжатом, GZip виде. То-есть, при запросе клиента, ваш сервер посылает данные вашей страницы сайта в архиве. После чего браузер пользователя успешно извлекает данные из архива и показывает их на экране монитора. Этот процесс значительно ускорит загрузку вашей страницы, по этому не стоит пренебрегать этим методом.
Как проверить включено ли gzip сжатие
Для того что бы проверить включено ли сжатие на вашем сервере можно воспользоваться сайтом whatsmyip.org который покажет сжимаются ли ваши данные и на сколько эффективно.
Если по результатам проверки вы получите следующее:
Значит ваши данные сжимаются и у вас все правильно работает.
Как использовать qzip сжатие, можно прочитать в отдельной статье.
Совет 2. Уменьшение CSS и JavaScript
Для формирования страницы мы используем наши каскадные таблицы стилей (CSS) и JavaScript, это все отнимает массу времени для загрузки нашей страницы. Что бы улучшить и ускорить наши стили и скрипты нужно их уменьшить, и придать им минимального размера.
Для того что бы уменьшить объем кода и ускорить загрузку страницы WordPress сайта существует несколько вариантов. Инструкции по которым можно прочитать у нас на сайте.
Совет 3. Уменьшайте количество http запросов
Чем больше у нас на загружаемой странице компонентов, таких как:
- картинки;
- скрипты;
- флеш анимации и т.д.
тем медленнее она грузиться. Ведь правило протокола HTTP/1.1 ставит ограничение одновременной загрузки компонентов с одного хоста на уровне 2 штук. Таким образом у наши части страницы грузятся медленно и частями. Решение этой проблемы так же есть, и его мы детально разберем в следующей публикации.
Совет 4. Очистка базы данных от мусора
Бывает так, что веб-мастер по незнанию или забывчивости забывает чистить базу данных, которая имеет свойство чрезмерно расти, особенно в WordPress.
Загрязненная БД приведет к огромным задержкам при загрузке, из-за того что количество переборов будет очень велико. Правильно настроена корректировка внесения данных в базу и своевременная очистка ее от “шлака” поможет вам сохранить скорость и чистоту, позволит неплохо ускорить сайт на wordpress.
Совет 5. Убрать лишний JavaScript
В наше время существует масса разных дополнений к нашим страницам, всевозможные виджеты подгружают огромное количество данных из сторонних ресурсов что значительно усложняет загрузку страницы. Главное правило откажитесь от ненужных вам скриптов! Не стоит бросаться на каждую красивую картинку и каждое дополнение вашего сайта, сначала обдумайте и протестируйте его и проверьте как оно повлияет на вашу скорость.
Совет 6. Использование кэширования позволит как ускорить сайт на wordpress
Используйте кэширование браузера, так же является ключевым моментом ускорения работы WordPress. Добавляйте в кэш как можно больше данных которые будут передаваться пользователю в готовом виде, а не создаваться каждый раз заново, тратя драгоценное время вашего посетителя.
Для использования кеширования существует несколько методов внедрение которых позволит вашим постоянным пользователям уверенно переходить по вашим страницам сайта без значительных задержек.
Для кэширования можно использовать плагин WP Super Cache, или другой понравившийся вам плагин.
Совет 7. Правильно располагайте ваши css и JavaScript включения.
Для лучшей загрузки сайта подключайте все свои стили в верхней части документа, в теге <HEAD>. Данная методика позволит браузеру постепенно загружать весь ваш стиль, без потери и нежелательных скачков картинок. Очень не красиво выглядит когда сначала подгружается текст, а уж потом его начинает бросать со стороны в сторону добавляя ему отступы и замещая навигацией и прочей добавочной стилистикой сайта.
В то же время Google рекомендует опускать все файлы стилей вниз документа, якобы они мешают загрузке контента, по сути так оно и есть. Что же выбрать в данном случае? Этот спор поможет решить небольшой эксперимент. Если у вас “тяжелый” CSS файл, с огромным количеством правил, и при загрузке страницы сайта, все элементы прыгают, тогда размещайте в хедере, если же при расположении подключения стилей в футере ничего такого не происходит, тогда лучше оставить его внизу. Нужно из двух зол выбирать меньшее.
Все JavaScript по возможности нужно опускать вниз документа, что бы они срабатывали в самую последнюю очередь и не замедляли загрузки основного контента. Это не так ускорит полную загрузку страницы, как уменьшит затраченное время на формирование основы, приемлемой для просмотра, а уж потом загрузится функционал.
Совет 8. Пользуйтесь поддоменами для параллельного скачивания
Как уже упоминалось существует ограничение на одновременное скачивание компонентов, поэтому используйте как можно больше поддоменов для быстрой загрузки вашей графики. Для вас это будет все тот же хост, а для браузера разные, что позволит ему быстрее загружать ваши данные и размещать в выделенных местах.
Совет 9. Откажитесь от ненужных плагинов
Каждый плагин и каждый его модуль замедляет загрузку страницы, откажитесь от лишних, ненужных плагинов действия которого можно заменить внедрением небольшого кода в ваш движок. Это позволит не только ускорить но и обезопасить вас от потенциального взлома.
Пересмотрите свои плагины, по экспериментируйте и отключите их по очереди и проследите за изменениями в скорости загрузки страницы. Если разница большая тогда либо откажитесь полностью, либо попробуйте заменить дополнение на другое схожее по функционалу.
Статья по данной теме представлена отдельно.
Совет 10. Выберите быстрый хостинг для своего сайта
Вопрос довольно сложный, ведь все хостинг провайдеры обещают вам наилучшую скорость для вас, но не спешите и проанализируйте несколько вариантов. Почитайте отзывы клиентов и постарайтесь выбрать лучший для вас по меркам “цена — качество”.
Конечно же лучшим вариантом для большого проекта будет выделенный хостинг или же VPS, затраты на которые значительно выше обычного хоста, но и преимущества огромные.
В заключение: в статье подробно рассказано как ускорить сайт на wordpress, воспользовавшись данными советами вы в разы, а то и в десятки раз сможете ускорить ваш сайт. Затраты на внедрения изменения в основном ложатся на временные активы, а выгода от них выше любых ожиданий.
Дорогие, Вебгуру все вместевзятые и Вы Александр!
Для начала хочу сказать, что бесконечно уважаю Вас и ваш труд. Однако, мне до сих пор не понятно ПОЧЕМУ все и Вы Александр постоянно с завидным упорством пишете:”Подключайте все свои стили в верхней части документа, в теге . Данная методика позволит браузеру постепенно загружать весь ваш стиль, без потери и нежелательных скачков картинок. ”
Это неправда. Потом вы выложите в интернет сайт и старина Гугл вас обломит вот тест моего лендинга: https://developers.google.com/speed/pagespeed/insights/?hl=ru&url=http%3A%2F%2Feslawintl.ru%2F&tab=desktop
И предложит вам перенести все в низ страницы. И только после этого выставит вам зеленые значки и будет вас любить.
Может быть лучше (и я был бы бесконечно благодарен) если бы вы написали статью о том как закрыть загрузку сайта на WP с помощью gif или css прелоадера? Я знаю примерно как, но лишними знания не бывают.
Извините, вы только не обижайтесь. Сайт ваш интересный и информативный, но вот такое пожелание от нас.
И еще – Jetpack – пошаговое руководство по установке и какие общепринятые и рекомендуемые плагины WP можно после его установки убрать. Тема просто была бы убойная.
Сам раньше на Джумле сидел, потом bootstrap, MODX. Недавно познакомился с WP. Очень нравится – это как с жигуленка на японца пересесть – поэтому если не трудно напишите пожалуйста. Ведь прелоадеры реально решают проблему с красотой загрузки сайта.
А сайт ваш добавил в закладки. Еще раз спасибо. Залогин О.А. Благовещенск
Здравствуйте, очень благодарен вам за такой конструктивный и умесный комментарий. Действительно гугл рекомендует опускать стили и скрипты вниз, что собственно я и делаю. Я далеко не гуру) сам ежедневно стараюсь учиться и пытаюсь делиться с этим с вами. Сегодня же подправлю эту статью. Так же благодарен вам за ряд идей для статьи. Обязательно использую их. По поводу прелоадера, постараюсь в течении недели написать об этом, праздники сами понимаете) и о джетпак так же не забуду)
Уважаемый, Александр! Кидаю вам ссылку на элементарный прелоадер. Очень удобный и простой. Сам использую на alconarco.net (пишу без http, чтобы не выглядело как ссылка).Пробовал разные и css в том числе. Но как вставить в WP не знаю. Нашел курс Бернацкого по ускорению сайта на WP. Может там есть.
http://popel-studio.com/blog/article/preloader-saita-svoimi-rukami.html – после того как пользовал css прелоадеры решил, что так проще.
От себя – не смотря на размеры грузятся они по разному, поэтому нужно тестировать. Вот и на алконарко у меня нужно менять – он на мобильниках тупит до невозможности.
И если будете писать напишите пожалуйста какой плагин лучше выбрать для кеширования. Гиперкеш, суперкеш или фастестс кеш (там целый комбайн).
Спасибо, Олег.
Суть статьи показать способы ускорения загрузки страниц сайта. Прелоадер не лечит, а лишь скрывает медленную загрузку. Мое мнение: использовать прелоадер нужно на сайтах, которые работают с большой базой данных, на обработку которой нужно много времени. Для информационных сайтов, блогов, форумов и т.д. лучше работать над ускорением, прелоадеры подойдут для крупных интернет магазинов или миллионных порталов.
У меня есть статья по суперкэшу //yrokiwp.ru/wp-super-cache-nastroyka/. Дело в том что плагины нужно тестировать, не на всех серверах могут корректно работать. Суть у всех одинаковая, суперкэш отличный плагин попробуйте его. Гиперкэш более простой в использовании.
Доброго времени суток! Что-то инструкцию по уменьшению CSS и JavaScript я у вас на сайте не нашел