Статьи

Ускорение WordPress: оптимизация изображения

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

Давайте начнем!

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

  1. Нам нужно использовать изображения экономно.
  2. Нам нужно сохранить размеры изображения маленькими.

Это где методы оптимизации изображения вступают в игру.

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

Если вы похожи на меня и хотите максимально контролировать свои изображения, вам следует оптимизировать изображения вручную. Существуют буквально сотни методов и приложений для оптимизации изображений для различных форматов изображений (в основном, JPEG и PNG). Я рекомендую два:

  1. JPEGmini — это отличное приложение, которое оптимизирует ваши файлы JPEG с помощью интеллектуального алгоритма оптимизации с потерями. У него нет никаких настроек (что очень обидно), но он отлично справляется с работой, уменьшая размеры файлов (не менее 30%). Он поставляется в приложениях для Windows и Mac вместе с веб-сервисом.
  2. RIOT (Radical Image Optimization Tool) — старый, но очень эффективный инструмент оптимизации для Windows. Он может обрабатывать JPEG, PNG и GIF с различными алгоритмами. Я использую его для оптимизации моих файлов PNG. Хотя его инструменты оптимизации PNG довольно медленные (особенно для больших файлов PNG), он отлично справляется со своей задачей.

Лично мне нравится работать вручную, а не автоматически. Я готовлю и редактирую свои изображения в Adobe Photoshop, сохраняю свои изображения «для Интернета» в 100% качестве, затем открываю JPEGmini для JPEG и RIOT для PNG, чтобы уменьшить размеры файлов.

Если вы не хотите заниматься всеми видами ручного труда, есть автоматические решения, которые вы можете использовать. Существуют опции на стороне сервера, такие как Kraken PRO и JPEGmini Server , но мы сосредоточимся на двух очень полезных плагинах для повседневного использования (или даже некоторых тяжелых):

  • WP Smush.it : Будучи самым популярным плагином для оптимизации изображений для WordPress, WP Smush.it автоматически запускает каждое изображение, которое вы загружаете через API Smush.it , и сжимает ваши изображения с помощью алгоритма с потерями. Вы также можете массово оптимизировать свои существующие изображения, что является огромным плюсом.
  • Оптимизатор изображения EWWW : хотя у него, безусловно, есть эксцентричный выбор для заголовка, оптимизатор изображения EWWW мне больше всего нравится с точки зрения оптимизации изображения. Он отлично работает из коробки, но вы можете настроить некоторые дополнительные параметры, чтобы максимально использовать его. Все алгоритмы, которые он использует (jpegtran, optipng, pngout и gifsicle), являются алгоритмами без потерь, что означает, что он не будет изменять пиксели, но уменьшит размеры ваших изображений путем перекодирования и очистки файлов. Он может не оптимизировать изображения, как WP Smush.it, но если вы не можете выдержать оптимизацию с потерями, EWWW Image Optimizer — ваш парень.

Обновление: похоже, что Yahoo! перестал поддерживать Smush.it, поэтому плагин не будет сжимать ваши изображения начиная с версии 1.7.1.1. Тем не менее, плагин не будет заброшен — разработчики плагина объявили, что они исправляют плагин:

Согласно неофициальным, но довольно надежным сообщениям, Yahoo прекратила поддерживать Smush.it 🙁 Однако, еще не все потеряно! Мы работаем как маньяки здесь, в WPMU DEV, чтобы предоставить вам бесплатную, более надежную и лучшую бесплатную игру в шутки, созданную нашими профессионалами. версия плагина и завернутая в следующем обновлении. Мы надеемся, что он будет доступен вам очень и очень скоро … а пока, пожалуйста, оставайтесь с нами, оно того стоит, обещание.

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

Что я имею в виду под «здравым смыслом»? Главным образом «быть осторожным и осторожным», но позвольте мне остановиться подробнее.

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

  • Не просто проверяйте, сколько гигабайт пространства и пропускной способности они обещают, но и технические характеристики сервера.
  • Выберите пакет хостинга, который подходит вашему сайту. Если у вас есть популярный сайт электронной коммерции, не используйте пакет общего хостинга.
  • И самое главное, поиск в Интернете и прочитать некоторые отзывы о компании: как их время работы? Как служба поддержки клиентов?

Я видел много тем WordPress — как бесплатных, так и платных — которые выглядели красиво, но были ужасно закодированы. Красивые, но плохо закодированные темы WordPress могут быть одними из главных виновников медленного сайта WordPress. Вы должны либо выбрать одну из тем с учетом производительности или создать свою собственную тему WordPress (или сделать это).

Вы можете спросить: «Как я должен знать, насколько оптимизирована тема?» но это не сложно, на самом деле. Выберите тему, затем отсканируйте демонстрационные страницы (не только домашнюю страницу!) В GTmetrix, чтобы увидеть их Google PageSpeed ​​и Yahoo! Низкие оценки и эффективность загрузки активов с помощью представления «Временная шкала». Что касается нагрузки на сервер, вам не нужно много проверять, не можете ли вы проверить это самостоятельно, и вам нужно полагаться на плагины для кэширования.

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

Вы также можете запустить тест производительности на плагинах с помощью плагина P3 (Plugin Performance Profiler) и посмотреть, какие плагины требуют много ресурсов.

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

  • Что касается того, чтобы идти в ногу со временем, сказать особо нечего: просто обновите.   Обновление может ускорить ваш сайт, потому что разработчики ядра, плагинов и тем постоянно работают над тем, чтобы сделать их код более эффективным.
  • Что касается безопасности, вы можете найти различные плагины безопасности в WordPress.org . Не забудьте проверить их, сравнить их отзывы и использовать тот, который подходит вам больше всего. Обеспечение безопасности вашего сайта не ускорит ваш сайт, но он может поддерживать скорость вашего сайта, если (или когда ) ваш сайт подвергается атаке.

В век информации очень важно быстро предоставлять информацию. Мы не можем терпеть ничего, что не отвечает быстро — мы чувствуем, что наше время тратится впустую. И мы говорим о секундах и миллисекундах здесь. Это не обязательно хорошая вещь, но в мире, подобном этому, мы должны играть по книге.

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

У вас есть что добавить? Поделитесь с нами своими мыслями, комментируя ниже. И если вам понравилась эта серия, не забудьте поделиться статьями со своими друзьями!