• Перевод

Скорость и отказоустойчивость – одни из тех факторов, что неизменно влияют на популярность вашего ресурса, ведь даже с лучшим в мире контентом медленно работающий сайт будет раздражать читателей и рано или поздно вы их потеряете. В этой статье мы будем оптимизировать самый популярный блоговый движок - Wordpress, работающий на PHP. А заодно рассмотрим несколько общих моментов в оптимизации сайтов.

1 Тестируем текущую скорость

Не забудьте обновить до последней версии PHP и Apache .

3.1 Отключите неиспользуемые сервисы

• Удалите ClamD;
• Настроить SpamD на использование только 1 дочернего процесса;
• Удалите Mailman, если, конечно, вы не собираетесь запускать почтовый сервис.

3.2 MYSQL Query Cache

query_cache_type = 1
query_cache_limit = 2M
query_cache_size = 20M

3.3 Кэш компилятора: XCache или Eaccelerator?

3.4 Увеличьте максимальное число соединений на Apache

max_connections = 150

4 Оптимизация кода и графики

4.1 Отключите хотлинки

< IfModule mod_rewrite .c >
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www\.)?example\.com/.*$
RewriteRule .*\.(gif|jpg|png|ico)$ -

4.2 Используйте внешний хостинг для хранения изображений

4.3 Сжимайте java-скрипт код

4.4 Javascript в начале страницы

4.5 Используйте кэш браузера

FileETag MTime Size
< ifmodule mod_expires .c >
< filesmatch "\.(jpg|gif|png|css|js)$" >
ExpiresActive on
ExpiresDefault "access plus 1 year"

4.6 Сжимайте статические данные

AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml application/xhtml+xml text/javascript text/css application/x-javascript
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0 no-gzip
BrowserMatch bMSIE !no-gzip !gzip-only-text/html

4.7 Используйте CDN для статических файлов

5 Wordpress

5.1 Обновитесь до последней версии

5.2 Отключите Post Revisions

define("WP_POST_REVISIONS", false);

DELETE a,b,c
FROM wp_posts a
LEFT JOIN wp_term_relationships b ON (a.ID = b.object_id)
LEFT JOIN wp_postmeta c ON (a.ID = c.post_id)
WHERE a.post_type = "revision"

5.3 Сократите количество запросов

< meta http-equiv ="Content-Type" content ="< ?php bloginfo ("html_type" ); ?> ; charset= " />

< meta http-equiv ="Content-Type" content ="text/html; charset=UTF-8" />

6 Wordpress Plugins

План статьи

Для Google, Яндекса и других поисковых систем скорость загрузки сайта является важным фактором ранжирования. Рассмотрим ускорение загрузки и работы сайта на CMS WordPress. Результаты работы можно увидеть в конце поста.

Цель: Ускорить загрузку и работу сайта на CMS WordPress плагинами (без правки кода).

Шаг 1. Анализ текущей ситуации со скоростью загрузки.

Ускорение этого блога я делал еще в феврале 2015 года, поэтому скриншота прошлого состояния не сохранилось. По памяти помню, что сервис PageSpeed Insights показывал скорость загрузки 50/55 для мобильных/ПК. Состояние было плачевное и я задумался про ускорение.

Проанализируйте свой сайт на WordPress с помощью сервиса Google PageSpeed Insights и если результат загрузки сайта меньше 85 — читайте дальше.

Шаг 2. Устанавливаем плагины для ускорения.

WP Fastest Cache

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

Зайдите в админке сайта на WP в «Плагины» -> «Добавить новый». Впишите название плагина, нажмите «Поиск». Первый плагин с изображением животного кошачьего типа — наш плагин. Устанавливаем.

EWWW Image Optimizer

Плагин для оптимизации изображений. Сжимает существующие и загружаемые картинки без потери качества.

Зайдите в админке сайта на WP в «Плагины» -> «Добавить новый». Впишите название плагина, нажмите «Поиск». Первый плагин с изображением молотка, который бьет по картинкам — наш плагин. Устанавливаем.

Шаг 3. Настройка ускорения сайта на WordPress

Настроим кеширование и минимизацию css, js файлов. В панели администратора новым пунктом меню у вас появился WP Fastest Cache. Зайдите по ссылке, внизу вы увидите поле language, установите русский язык. Установите галочки во всех пунктах, как на скриншоте ниже. В другие вкладки плагина можете не заходить — там платные функции, за которые вам вряд ли захочется отдавать деньги.

После этого сожмём картинки на сайте. В панели админки WP наведите на медиафайлы, выберите пункт «Оптимизировать». В выбранном окне воспользуйтесь двумя функциями — оптимизацией картинок из библиотеки и оптимизация других картинок (шаблона, движка и т.д.). Этими действиями вы сжимаете уже существующие изображения на сайте, загружаемые после установки плагина картинки будут сжиматься автоматически при загрузке на сервер.

Всего 2 этих шага существенно ускорит загрузку страниц, что увеличит лояльность поисковых машин и улучшит отношение людей к вашему сайту на WordPress.

Шаг 4. Результаты ускорения сайта.

Результаты шикарные. С 50 сразу стало 81 (опять-таки, по памяти). Почитав рекомендации Гугла нашел множество проблем загрузки, связанной с плагином, который предназначен для красивого вывода программного кода на блоге. После того, как я его снес — это значение поднялось до 91! Вот, что показала Яндекс Метрика — отчет по загрузке страниц:

По скриншоту четко видно, что скорость загрузки страниц снизилась с 1 секунды от 0.1 . Отмечу, что улучшились позиции в Google и даже в Яндексе, уменьшилось число отказов (некоторые люди, особенно с мобильным интернетом, не желают долго ждать и покидают сайт, если после перехода на сайт он сразу не начинает загружаться).

Дополнительно

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

Это заметно снижает скорость загрузки и отношение Google к сайту. Простой пример — в моем блоге на главной вы увидите над лентой последних постов текст и небольшое фото. Если бы я поставил в атрибут src тега img ссылку на изображение оригинал разрешением ~1000×2000 и вывел картинку 100×100, серверу пришлось бы загружать изображение 1000×2000, браузер сжал бы ее до нужных размеров, которые я прописал в стилях отображения, но реально-то загружался оригинал. Поэтому я не поленился отресайзить её в Photoshop и только после этого использовать в шаблоне. Загружайте изображения ровно в таком разрешении, в котором хотите её отобразить.

Меньше графики — быстрее сайт.

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

Меньше плагинов — меньше запросов к базе данных.

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

Если у вас возникли проблемы с ускорением сайта на WordPress или возникли вопросы по теме — пишите в комментарии или на почту через форму слева — постараюсь помочь.

Всем нужно, чтобы их сайты загружались и работали как можно быстрее. Но это не будет происходить само по себе, особенно если сайт наполнен довольно тяжелым контентом и его посещает огромное количество людей. CMS WordPress — не образец идеально быстрой платформы, но есть способы, которые помогут ускорить загрузку сайта. Помните, что это влияет не только на лояльность посетителей, но и на место вашего сайта в поисковых результатах, так как Google использует время загрузки страниц как один из факторов ранжирования.

Проверить скорость загрузки сайта можно с помощью инструмента Google Page Speed , чтобы отследить степень влияния каждого шага, который мы разберем далее.

Оптимизация изображений WordPress

Без изображений ваш сайт вряд ли обойдется, поэтому важно, чтобы они были оптимизированы.

Используйте изображения соответствующих размеров. Не загружайте большие картинки, чтобы потом масштабировать их под HTML. Убедитесь, что вы загружаете фотографии и другие изображения размером не больше, чем тот, который должен отображаться.

Удаляйте всю лишнюю информацию из фотографий (дата создания, камера, GPS- координаты и прочее, что можно найти в свойствах файла). С этим вам поможет плагин для оптимизации изображений WordPress WP Smush.it.

Ускорить WordPress помогут CSS-спрайты — техника CSS, которая позволяет объединить все элементы дизайна на странице в одно изображение. В результате вместо того, чтобы загружать множество отдельных изображений, каждый раз делая HTTP-запрос, сайт откроет одно изображение. Использовать CSS-спрайты можно в том случае, если текущая тема вашего сайта их поддерживает.

Существует множество плагинов, которые помогут вам уменьшить размер изображений. Например, EWWW Image Optimizer или уже упомянутый WP Smush.it. Можно использовать и сторонние сервисы для уменьшения размера картинок. Например, сервис Tinyjpg отлично уменьшает размер изображений без потери качества.

Покажем, как обработать все ваши изображения С EWWW Image Optimizer всего в несколько кликов:

После того, как вы установили и активировали плагин, зайдите в администраторскую панель WordPress и перейдите в меню Медиафайлы >> Массовая оптимизация:


Вы увидите опцию для оптимизации всех изображений в библиотеке. Нажмите кнопку “Начать оптимизацию”.

Если вам нужно оптимизировать изображение вне библиотеки медиафайлов (например, графические элементы активной темы), воспользуйтесь кнопкой “Сканировать и оптимизировать”.


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

Сжатие файлов

Оптимизация сайта WordPress возможна и через сжатие файлов. Если вы пользуетесь хостинговой панелью cPanel, то можете воспользоваться меню “Оптимизировать веб-сайт”.


Пользоваться им очень легко: просто выберите опцию “Сжать все содержимое” и нажмите “Обновить параметры”. Таким образом все файлы вашего сайта сожмутся. Если же вы хотите сжать только определенный тип файлов, то воспользуйтесь опцией “Сжать указанные типы MIME”.

Кэширование браузера

Используя.htaccess файл вашего сайта, вы можете настроить период хранения статического контента (CSS, Javascript, изображение и прочее) в браузерах. Это значительно сократит время загрузки вашего сайта для постоянных посетителей.

Откройте.htaccess файл, расположенный в корневой директории сайта, и добавьте следующий код:

ExpiresActive on
ExpiresByType image/jpg "access plus 60 days"
ExpiresByType image/png "access plus 60 days"
ExpiresByType image/gif "access plus 60 days"
ExpiresByType image/jpeg "access plus 60 days"
ExpiresByType text/css "access plus 2 weeks"
ExpiresByType image/x-icon "access plus 2 weeks"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType audio/x-wav "access plus 1 month"
ExpiresByType audio/mpeg "access plus 1 month"
ExpiresByType video/mpeg "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/quicktime "access plus 1 month"
ExpiresByType video/x-ms-wmv "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType text/javascript "access plus 2 weeks"
ExpiresByType application/x-javascript "access plus 2 weeks"
ExpiresByType application/javascript "access plus 2 weeks"

Срок хранения можно изменить в зависимости от ваших требований.

Важно: перед внесением любых правок в.htaccess сделайте бэкап этого файла. Если с файлом.htaccess что-то пойдет не так, сайт не будет работать.

Кэширование WordPress

Такие плагины значительно улучшат скорость загрузки страниц. Самые популярные — W3 Total Cache и WP Super Cache. Главное отличие между ними — это то, что W3 Total Cache поддается более гибкой настройке.

Рассмотрим пример настройки W3 Total Cache:

После того, как вы установили плагин, в панели управления WordPress перейдите в меню Плагины >> Установленные >> W3 Total Cache >> Settings.


Важно: если вы являетесь пользователем виртуального хостинга, помните, что все возможные варианты кэширования не должны быть включены одновременно (избегайте использовать опцию Toggle all caching types on or off (at once)). Если Object caching и Database caching включены, они могут вызвать проблемы с использованием ресурсов вашего хостингового аккаунта без улучшения скорости загрузки страницы. Но если ваш сайт находится на VPS или выделенном сервере, то вас это не коснется.

В меню Settings включите следующие опции:

• Page Cache
• Minify
• Browser Cache

И после этого нажмите на кнопку “Save All Settings”.

Используя плагин кэширования для WordPress, сайт будет загружаться быстрее.

Использование CDN

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

Одним из самых популярных сервисов CDN является Cloudflare . Именно его мы и советуем использовать нашим клиентом и предлагаем вместе со всеми пакетами виртуального хостинга.

Все остальные пункты ниже влияют не так влияют на скорость загрузки страницы, как на оптимизацию использования ресурсов и общий пользовательский опыт, поэтому они не менее важны.

Оптимизация домашней страницы

Первое, что люди видят на вашем сайте — это домашняя страница. А если пользователь попал сразу на какую-то другую страницу, то всё равно многие переходят после этого на главную. Несколько советов по оптимизации домашней страницы:

LazyLoad — плагины, которые помогают осуществлять отложенную загрузку изображений. Это актуально для сайтов, на которых изображений очень много. Загрузка изображения начинается только тогда, когда пользователь долистывает до определенного места на странице. Следовательно, если на странице есть изображение в самом конце, а пользователь просто не долистал до этого места, то загрузка изображения не произойдет. Пример такого плагина — jQuery Image Lazy Load.

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

Включение защиты от хотлинкинга

Если прямая ссылка на изображение, которое находится на вашем сервере/сайте, помещается на какой-нибудь другой сайт, то каждый раз, когда кто-то открывает это изображение, запрос будет идти на ваш сервер и потреблять ресурсы вашего аккаунта. Решением этой проблемы станет полная блокировка таких запросов.

Если вы являетесь пользователем cPanel, вы можете воспользоваться встроенной опцией “Защита Hotlink”.


Также вы можете включить защиту от хотлинкинга при помощи.htaccess кода:

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^http://(.+\.)?yourdomain\.com/ RewriteCond %{HTTP_REFERER} !^$
RewriteRule .*\.(jpe?g|gif|bmp|png)$ /images/nohotlink.jpg [L]

При помощи этого кода ваш сервер проверяет, откуда именно пришел запрос: если со страниц вашего сайта, то он отдаст изображение пользователю без проблем; если же с чужого сайта – то сервер показывает изображение с ошибкой (nohotlink.jpg – любое изображение, которое вы захотите использовать с этой целью).

Вот и все! Это те базовые опции по оптимизации сайта на WordPress, которые не потребуют от вас много времени, но смогут улучшить работу вашего сайта.

Здравствуйте дорогие читатели! В этом уроке мы с Вами поговорим о том, как увеличить скорость загрузки страниц сайта на WordPress и снизить нагрузку сайта на сервер .

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

А если к этому всему добавить еще и большое количество посетителей сайта, нагрузка на сервер хостинга будет просто огромная.

В случае если Ваш сайт и так быстрый, у вас есть возможность с помощью этого урока разогнать его до скорости света 🙂

Как ускорить работу сайта WordPress?

1. Оптимизируйте базу данных сайта WordPress

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

2. Отключите неиспользуемые плагины

Большое количество неиспользуемых плагинов также создает дополнительную нагрузку . Отключите ненужные плагины, и по возможности уменьшите использование ненужных скриптов.

3. Оптимизируйте изображения

Изображения на странице сайта обычно занимают много места и весят больше всего. Чем больше сжато изображение, тем быстрее браузер сможет показать страницу посетителю сайта. Благодаря оптимизации изображений Вы можете значительно улучшить работу веб-ресурса.

Данную ошибку допускают обычно новички, но не сказать о ней нельзя. Скоро я планирую посвятить этому отдельный урок.

4. Используйте нормальный хостинг

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

Лично я пользуюсь хостингом ukraine.com.ua . Пользуюсь им уже почти два года без каких-либо нареканий. С плюсов могу отметить низкую цену , надежность и качество предоставляемых услуг (+ круглосуточная поддержка).

5. Сделайте кэширвание сайта

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

С помощью кэширования Вы значительно увеличите скорость загрузки страниц и снизите нагрузку на сервер . Рекомендую к обязательному использованию .

6. С мира по нитке

Для тех кому описанного выше (не дай Бог) оказалось недостаточно, рекомендую следующее:

• Сократите CSS и JavaScript код
• Сократите количество забросов в БД
• Обновите WordPress до последней версии
• Используйте VPS-хостинг

Друзья, желаю Вам большой посещаемости и стабильной работы сайта.

Если у Вас возникли вопросы или хотите поделится опытом решения данной задачи — пишите в комментариях!

Здравствуйте дорогие читатели! В этом уроке мы с Вами поговорим о том, как увеличить скорость загрузки страниц сайта на WordPress и снизить нагрузку сайта на сервер. Я думаю Вы согласитесь, что скорость работы сайта является практически самым важным показателем. Даже если на Вашем сайте самый лучший и полезный контент, но страницы загружаются по 8-10 секунд, то рано или поздно это начнет раздражать посетителей. А если к этому всему добавить еще и большое количество посетителей сайта, нагрузка на сервер хостинга будет просто огромная. В случае если Ваш сайт и так быстрый, у вас есть возможность с помощью этого урока разогнать его до скорости света:) Сразу хочу…

Ускоряем Wordpress

• WordPress

Wordpress в стандартной установке довольно медленный. По умолчанию движок не использует некоторые возможности современного Веба для значительного своего ускорения. Существует целая куча плагинов для оптимизации Wordpress"a. Давайте наведем в них порядок и проведем капитальную оптимизацию.

Прежде чем приступить, посмотрим, что показывает голая установка Wordpress по Pagespeed :

Результат 76 из 100 довольно низкий. Посмотрим, насколько можно увеличить этот показатель.

Серверная часть

Nginx

Server { server_name wp.com; root /var/www/wp; # путь к WP index index.php; location ~* ^.+\.(ogg|ogv|svg|svgz|eot|otf|woff|mp4|ttf|rss|atom|jpg|jpeg|gif|png|ico|zip|tgz|gz|rar|bz2|doc|xls|exe|ppt|tar|mid|midi|wav|bmp|rtf)$ { access_log off; log_not_found off; expires max; # кеширование статики } location / { try_files $uri $uri/ /index.php?$args; # permalinks } location ~ \.php$ { fastcgi_pass unix:/var/run/php5-fpm.sock; fastcgi_index index.php; include fastcgi_params; } }

PHP кеш

Php -i | grep apc

В версиях PHP после 5.5 есть встроенный модуль opCache, так что APC ставить не прийдется.

Тюнинг Mysql

Размер буфера InnoDB лучше поставить в половину доступной оперативной памяти:

Innodb_buffer_pool_size = 256M

Не забываем включить кеширование MySQL:

Query_cache_size = 32M query_cache_limit = 1M

Более расширенная настройка MySQL для Wordpress.

Кеширование

Ab -c 10 -n 500 http://wordpress/

Получаем среднее время на запрос около 50мс:

Total transferred: 4183000 bytes HTML transferred: 4074500 bytes Requests per second: 17.62 [#/sec] (mean) Time per request: 567.421 (mean) Time per request: 56.742 (mean, across all concurrent requests) Transfer rate: 143.98 received

Хром показывает среднее ожидание ответа на уровне 150мс (сервер находится в Нидерландах):

WP Super Cache

С включенным WP Super Cache получаем уменьшение среднего времени на запрос в 25 раз(!):

Total transferred: 4293500 bytes HTML transferred: 4146500 bytes Requests per second: 499.01 [#/sec] (mean) Time per request: 20.040 (mean) Time per request: 2.004 (mean, across all concurrent requests) Transfer rate: 4184.61 received

Cреднее ожидание ответа в Хроме уменьшилось в 3 раза:

В качестве серверной альтернативы WP Super Cache можно использовать Varnish . Он позволяет снизить время на обработку запроса еще почти на порядок, но само решение менее гибкое (хорошо подойдет для блогов без элементов динамики).

Стили, скрипты и картинки

Минификация и сжатие

Server { ... gzip on; gzip_disable "msie6"; gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript; ... }

Оптимизация картинок

Apt-get install imagemagick php5-gd

Хорошие практики и опыт

• Лучше всего выбирать VPS для хостинга Wordpress. На Shared хостинге многое из описанного выше сделать невозможно. Кроме этого, VPS сейчас достаточно дешевый.
• Проверяйте темы с помощью Pagespeed перед использованием
• Очищайте корзину
• Удаляйте старые ревизии постов
• Удаляйте спам-комментарии
• Отключайте трекбеки в моменты, когда все становится совсем медленно
• Раздавайте RSS через feedburner

В результате