Реально ускорить сайты WordPress [#5]

Эта небольшая серия статей о вещах, которые действительно ускоряют веб-сайты WordPress, приближая их к миллисекундной скорости загрузки. Требуется много ручной работы, как мы выяснили в прошлой статье. В этой части мы будем делать штрихи, которые еще остались. Мы настроим URL-адреса, посадим Jetpack на диету, преобразуем веб-сайт в статические HTML-страницы с помощью кэширования и заставим видео загружаться последними.

Производительность: правильная структура постоянных ссылок

Постоянные ссылки в WordPress можно менять по желанию. WordPress позволяет нам создавать любую структуру, о которой мы только можем подумать. Естественная структура постоянных ссылок WordPress называется беспорядочными URL-адресами, поскольку невозможно распознать четкую структуру. Ссылка сразу после новой установки будет выглядеть так:

https://www.noupe.com/?p=123

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

https://www.noupe.com/example-post/

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

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

Google Pay почти не обращает внимания на «говорящие» URL-адреса

Времена изменились, и сам Google, кажется, больше не заботится о говорящих URL-адресах. Дело обстоит наоборот, поскольку сам Google начал использовать простые идентификаторы в своих URL-адресах вместо ключевых слов. Это можно увидеть, например, на YouTube и Google+. Google переключается на удобство использования, быструю загрузку и качественный контент. Старые трюки с говорящим адресом, оптимизированным с помощью ключевых слов, уже не работают. Таким образом, имеет смысл рассмотреть возможность использования коротких и быстрых URL-адресов, а также изменения структуры для существующих проектов.

Переключение постоянных ссылок на простые идентификаторы

В последнее время Google, кажется, ценит короткие URL-адреса больше, чем другие. Это мое личное наблюдение, так как я переключил свою структуру постоянных ссылок с разговоров на простые идентификаторы в своей Демократической почте. С тех пор я получаю больше трафика через Google. Поэтому я рекомендую использовать простую структуру постоянных ссылок с идентификаторами. Изменение структуры для существующих проектов также не является проблемой, поскольку WordPress позаботится о необходимых перенаправлениях со старого на новый URL-адрес. Идентификатор ссылки будет выглядеть так:

http://andreas-hecht.com/466/

На следующем снимке экрана показаны соответствующие настройки:

Сделать видео загружаемым последним

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

Фрагменты кода для functions.php вашей темы:

Часть 1: Функция PHP

Один клик открывает Gist на GitHub

Часть 2: Код JavaScript

Один клик открывает Gist на GitHub

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

Кэширование: переключение блога на статические HTML-страницы

Даже обычное кэширование значительно ускоряет работу вашего сайта. Однако интерпретатор PHP по-прежнему вызывается при каждом посещении страницы. Если вы хотите действительно быстрый веб-сайт, вам нужно переключить кэширование вашего веб-сайта на создание статических веб-сайтов. Затем интерпретатор PHP избегается, а требуемая страница сразу же вызывается. Это действительно имеет значение, но у него есть свои недостатки.

Преимущество:

Каждая страница загружается намного быстрее; сайт становится очень быстрым.

Недостатки:

Запланированные статьи больше не возможны, так как интерпретатор PHP не используется.

Решение:

Достойной альтернативой будет вызов файла WordPress. wp-cron.php (находится в основном индексе объекта WordPress), используя cronjob сервера (спросите хостера) или поставщика услуг, такого как cronjob.de. — Качифай Вики

Создание статических HTML-страниц с помощью плагина Cachify

Бесплатный плагин WordPress Cachify — это самый быстрый плагин кэширования для веб-сайтов WordPress, если он настроен правильно. В сочетании с расширением .htaccess он создает сжатую GZIP HTML-версию каждой страницы блога.

Cachify Скачать на WordPress.org

Файл .htaccess можно найти в главном индексе WordPress. Необходимое расширение для Cachify должно быть скопировано выше правил WordPress. Пожалуйста, сделайте резервное копирование перед редактированием файла.

Один клик открывает Gist на GitHub

Необходимые настройки плагина Cachify

Диета для реактивного ранца

Jetpack — отличный плагин, если вы внимательно относитесь к тому, что активируете. Я использую плагин очень сознательно, и у меня включено только несколько модулей. На моей Демократической почте активны следующие модули:

Вложения шорткодов — для Youtube, Flickr и других сервисов
Статистика сайта — для быстрого обзора самых просматриваемых статей в личном кабинете
Дополнительные виджеты боковой панели — для отображения самых популярных статей (Top Post Widget)
Резервное копирование данных — для резервных копий VaultPress

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

Я скопировал CSS, необходимый для виджета верхнего сообщения, из CSS-файла Jetpack и реализовал его в моем style.css. После этого Jetpack CSS не загружался.

Часть 1 оптимизации Jetpack: контроль над модулями

Модули Jetpack можно легко контролировать с помощью плагина, а также можно предотвратить их автоматическую активацию. Каждый деактивированный модуль больше не загружает скрипты. Обзор настроек:

Скачать модуль управления для Jetpack

Часть 2 оптимизации Jetpack: предотвращение загрузки CSS, когда он не нужен

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

Один клик открывает Gist на GitHub

Конечный результат: действительно быстрый веб-сайт

Первый запуск с инструментами Pingdom

Второй запуск с инструментами Pingdom

Со всеми настройками, которые мы сделали, мы создали веб-сайт, который загружается за миллисекунды. Тем не менее, на этом мы еще не закончили, так как возможно гораздо больше. Я мог бы отказаться от виджета верхнего сообщения или изображений большого формата для своих электронных книг. Плагин de:comments для комментариев можно было деактивировать, и я мог использовать комментарии WordPress с кэшированием для Gravatar. Кроме того, я мог выбить рекламные блоки из Google Adsense и Plista.

Время загрузки 300 миллисекунд, безусловно, возможно. Но это нецелесообразно, на мой взгляд.