Поделиться на 1ТП1Ц
Поделиться на 1ТП1Ц
Поделиться на 1ТП1Ц
Поделиться на 1ТП1Ц
Поделиться на 1ТП1Ц

Содержание

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

Требования

  1. Автоматическая оптимизация. Получить плагин Вот
  2. Кэш LiteSpeed, установленный на вашем сервере (необязательно)
  3. PerfMatters. Получить плагин Вот
  4. ShortPixel (вы можете использовать Litespeed для замены этого плагина)

Я настоятельно рекомендую вам использовать эти плагины для оптимизации вашего сайта WordPress. Они могут быть чрезвычайно полезными и оптимизировать страницы вашего веб-сайта по низкой цене.

ВНИМАНИЕ: это может сломать ваш сайт WordPress. Перед применением на работающем веб-сайте создайте песочницу, чтобы опробовать эти настройки.

Автоматическая оптимизация

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

Параметры JavaScript

Некоторые варианты могут сломать ваш сайт. Я указал цвета, настройки которых вы, вероятно, захотите применить к своему сайту. Зеленые с меньшей вероятностью сломают ваш сайт, а красные с большей вероятностью. Если вы знаете, что ваш сайт ломается, посмотрите .js, который сломан, и попробуйте добавить его в «исключить из автоптимизации». Это устранит большинство проблем.

Также агрегировать встроенный JS?
Агрегировать JS-файлы? Сгруппировать все связанные JS-файлы, чтобы они загружались без блокировки рендеринга? Если этот параметр отключен, отдельные JS-файлы останутся на месте, но будут уменьшены.
Также агрегировать встроенный JS? Пусть Autoptimize также извлекает JS из HTML. Предупреждение: это может привести к быстрому увеличению размера кэша Autoptimize, поэтому включайте это только в том случае, если вы знаете, что делаете.
Принудительно использовать JavaScript? Загрузите JavaScript заранее, это потенциально может исправить некоторые JS-ошибки, но делает блокировку рендеринга JS.
Исключить скрипты из Autoptimize:
Список сценариев, разделенных запятыми, которые вы хотите исключить из оптимизации, например, «something.js, another.js» (без кавычек), чтобы исключить эти сценарии из агрегирования с помощью Autoptimize. Важно: исключенные неминифицированные файлы по-прежнему минимизируются с помощью функции Autoptimize, если эта опция в разделе «разное» не отключена.
Добавить упаковку try-catch? Если ваши скрипты ломаются из-за JS-ошибки, вы можете попробовать это.

Параметры CSS

Параметры CSS

Встроенный и отложенный CSS?
Агрегировать CSS-файлы? Сгруппировать все связанные CSS-файлы? Если этот параметр выключен, отдельные файлы CSS останутся на месте, но будут уменьшены.
Также агрегировать встроенный CSS? Отметьте эту опцию для Autoptimize, чтобы также агрегировать CSS в HTML.
Сгенерировать данные: URI для изображений? Включите это, чтобы включать небольшие фоновые изображения в сам CSS, а не как отдельные загрузки.
Встроенный и отложенный CSS? Вставьте «CSS над сгибом» при загрузке основного автоматически оптимизированного CSS только после загрузки страницы. Проверьте FAQ для получения дополнительной информации. Это можно полностью автоматизировать для разных типов страниц на КритическийCSS таб.
Встроить весь CSS? Встраивание всего CSS - простой способ предотвратить блокировку отображения CSS, но обычно не рекомендуется, поскольку размер HTML значительно увеличивается. Кроме того, он может подтолкнуть мета-теги к тому месту, где, например, Facebook и Whatsapp больше не найдут их, что приведет к разрыву миниатюр при совместном использовании.

Не рекомендуется использовать "inline all css", поскольку это увеличивает время загрузки. Хотя он может быть загружен «асинхронно», он загружается на страницу и может задерживать время до первой отрисовки.

Оптимизация HTML

Оптимизировать HTML-код?
Оставить HTML-комментарии? Включите это, если хотите, чтобы комментарии HTML оставались на странице.

Я не предлагаю вам не хранить html-комментарии, потому что они не имеют никакой функциональности.

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

Сделайте свой сайт значительно быстрее, просто отметив несколько флажков, чтобы оптимизировать и отложить загрузку изображений, включая поддержку WebP!

Оптимизировать изображенияОптимизируйте изображения на лету и обслуживайте их через глобальную сеть CDN Shortpixel. Получите больше любви от Google и улучшите скорость загрузки своего веб-сайта, оптимизируя общедоступные изображения на лету (также в формате изображений WebP следующего поколения) с помощью ShortPixel а затем кэшируются и быстро обслуживаются из глобальной сети CDN Shortpixel. Войти Сейчас чтобы получить 1 000 бонусов + 50% дополнительных кредитов на оптимизацию изображения независимо от используемого трафика. Дополнительные оптимизации изображений можно приобрести, начиная с $4.99.Вопросы? Взгляните на ShortPixel FAQ! Работает только для общедоступных сайтов / изображений. Использование этой функции зависит от Shortpixel's Условия эксплуатации и Политика конфиденциальности.
Ленивая загрузка изображений?Ленивая загрузка изображений задержит загрузку невидимых изображений, чтобы браузер мог оптимально загрузить сначала все ресурсы для страницы, расположенной "в верхней части страницы".

Это должно помочь вам настроить ваш сайт. Легко и без особых хлопот. Этот плагин тоже бесплатный.

Как я уже сказал, обязательно тщательно протестируйте. Это может нарушить некоторые функции.

Дополнительные оптимизации

Google шрифтыОставить как есть
Удалить шрифты Google
Объединить и связать в заголовке (шрифты загружаются быстро, но блокируют рендеринг), включает display: swap.
Комбинирование и предварительная загрузка в заголовке (шрифты загружаются поздно, но не блокируют рендеринг), включает display: swap.
Комбинируйте и загружайте шрифты асинхронно с webfont.js
Удалить смайлыУдаляет встроенный CSS "core emojis" WordPress, встроенный JavaScript и другие неавтоматизированные файлы JavaScript.
Удалите строки запроса из статических ресурсовУдаление строк запроса (или, более конкретно, вер параметр) не улучшит время загрузки, но может улучшить показатели производительности.

А теперь самое сложное. Эту часть следует выполнять, только если вы уверены в том, что делаете.

Перейдите на tools.pingdom.com и протестируйте свой сайт.

Простое руководство по оптимизации Wordpress менее чем за 1 час. 1

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

fonts.gstatic.com, fonts.googleapis.com

Также не забудьте прислушаться к аналитике скорости Google, поскольку она сообщит вам, нужно ли предварительно загружать какой-либо запрос. Если они предлагают вам предварительно загрузить какие-либо .js или .css, то поместите его в «Предварительная загрузка конкретных запросов» и введите его. В моем случае я поставлю шрифт, так как они предполагают, что он загружается первым, чтобы сократить время до первого рендеринга.

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

Perfmatters

Этот плагин стоит. Но оно того стоит.

Опции

Выберите, какие параметры производительности вы хотите включить.

Отключить эмодзивключить
Отключить встраиваниевключить
Удалить строки запросавключить
Отключить XML-RPCвключить
Удалить jQuery Migrateвключить
Скрыть версию WPвключить
Удалить ссылку wlwmanifestвключить
Удалить ссылку RSDвключить
Удалить короткую ссылкувключить
Отключить RSS-каналывключить
Удалить ссылки на RSS-каналвключить
Отключить самостоятельные пингбекивключить
Отключить REST APIвключить
Удалить ссылки REST APIвключить
Отключить дашиконывключить
Отключить Google Картывключить
Отключить шрифты Googleвключить
Отключить измеритель надежности паролявключить
Отключить комментариивключить
Удалить URL-адреса комментариеввключить
Ленивая загрузкаБЕТАвключить
Использовать роднойвключить
Отключить сердцебиениеDefaultDisable Everywhere Разрешить только при редактировании сообщений / страниц
Частота сердцебиения15 секунд (по умолчанию) 30 секунд 45 секунд 60 секунд
Ограничить количество редакций сообщенийDefaultDisable Post Revisions123451015202530
Интервал автосохранения1 минута (по умолчанию) 2 минуты 3 минуты 4 минуты 5 минут
Изменить URL-адрес для входаМожет быть полезно в целях безопасности.

Это будет во многом зависеть от вашего сайта. Если у вас есть карты Google или вам не нужны шрифты Google, сделайте так, как это лучше всего подходит для вашего сайта. Точно так же тщательно протестируйте и убедитесь, что это не влияет на работу.

На вкладке Дополнительно включите «диспетчер сценариев».

Эта часть очень полезна, потому что в Google вы часто получаете предупреждение «удалите файлы css, которые не используются» или «удалите файлы js, которые не используются».

Простое руководство по оптимизации Wordpress менее чем за 1 час. 2

В этом примере вы видите несколько файлов, которые почти полностью не используются. Говорят, что возможна экономия 10,3 из 10,6 КБ, значит, возможно, удалить безопасно. При этом тщательно проверьте. Здесь нам помогают Perfmatters, потому что вы можете напрямую отключить их.

Перейдите на http://yourwpdomain.com/yourwpdirectory/fileyouwanttoedit.? perfmatters

или просто добавьте ? perfmatters на страницу, которую вы хотите оптимизировать.

Здесь вы увидите загружаемые скрипты.

Простое руководство по оптимизации Wordpress менее чем за 1 час. 3

Некоторые будут иметь следующую информацию:

Простое руководство по оптимизации Wordpress менее чем за 1 час. 4

Там вы можете сопоставить его с предложениями Google о неиспользованном .css. Отключите все неиспользуемые CSS, которые, по вашему мнению, не повлияют на ваш сайт. То же самое проделайте и с файлами .js. Но, как я сказал ранее, вам в значительной степени нужно проверять настройки, настраивая и постранично, чтобы увидеть, какой из них работает, а какой нет. Этот плагин удалит все неиспользуемые файлы .js и .css, что значительно повысит вашу производительность.

Shortpixel - Оптимизация изображения

Shortpixel - один из лучших оптимизаторов изображений на рынке. Это мои настройки:

Оптимизация изображения коротких пикселей

В моем личном случае я очень забочусь о качестве изображения. Следовательно, я решил изменить размер своих изображений до 1025x1024. Большинство представленных здесь настроек будут чрезвычайно полезны для вашего сайта.

В расширенных настройках страницы я предлагаю вам включить эти параметры:

Преобразование CMYK в RGB Отрегулируйте цвета изображений для отображения на экране компьютера и мобильного устройства. Для изображений в Интернете нужен только формат RGB, а преобразование их из CMYK в RGB делает их меньше.
Изображения WebP:Доставьте WebP-версии изображений во внешний интерфейс:
Также создайте Версии WebP изображений, бесплатно.
 С использованием синтаксис тега
 Глобальный (обрабатывает весь выходной буфер перед отправкой HTML в браузер)
Оптимизировать изображения Retina Также оптимизируйте изображения Retina (@ 2x), если они существуют. Если у вас есть плагин Retina, который генерирует изображения, специфичные для Retina (@ 2x), ShortPixel также может оптимизировать их, наряду с обычными изображениями и миниатюрами библиотеки мультимедиа.  Больше информации 
Оптимизировать другие превью Также оптимизируйте неуказанные миниатюры, если они найдены. Некоторые плагины создают миниатюры, которые не регистрируются в метаданных, а вместо этого создают их только вместе с другими миниатюрами. Пусть ShortPixel их тоже оптимизирует. 
Оптимизировать PDF-файлы Автоматическая оптимизация PDF-документов.

Вы должны быть очень осторожны, если хотите включить «Преобразование изображений PNG в JPEG», потому что иногда он может искажать изображения с прозрачным фоном.

Вы также должны включить их:

Оптимизировать медиа при загрузке Автоматически оптимизировать элементы библиотеки мультимедиа после их загрузки (рекомендуется). По умолчанию ShortPixel автоматически оптимизирует все недавно загруженные изображения и файлы PDF. Если вы снимете этот флажок, вам нужно будет либо запустить Bulk ShortPixel, либо перейти в медиа-библиотеку (в виде списка) и щелкнуть справа кнопку (кнопки) «Оптимизировать сейчас». 
Процесс в интерфейсе Автоматическая оптимизация изображений, добавляемых пользователями в интерфейсе. Установите этот флажок, если у вас есть пользователи, которые добавляют изображения или документы PDF из пользовательских форм в интерфейсе пользователя. Это может увеличить нагрузку на ваш сервер, если у вас одновременно подключено много пользователей.

LiteSpeed Cache

Этот плагин следует использовать только в том случае, если у вас есть сервер Litespeed. Это значительно сокращает время отклика.

Зайдите в Кэш и включите все настройки в «Настройках контроля кеша». Точно так же включите настройки управления кешем. Для получения дополнительной информации перейдите на Сайт Litespeed.