X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Добавить ответ в эту тему
> Как за 20 минут ускорить работу сайта на WordPress
jack
jack
Topic Starter сообщение 9.11.2020, 13:19; Ответить: jack
Сообщение #1


Всем известно, что скорость страницы важна. Это подтвержденный фактор ранжирования Google, который влияет на поведение пользователей, и может иметь прямое влияние на вашу прибыль. Медленные сайты на WordPress – это распространенная проблема.

Вот оценка одной из страниц сайта www.theseoproject.org в PageSpeed Insights для мобильных устройств.

До оптимизации:



При загрузке сайта в Ahrefs Site Audit, можно увидеть, что это не единственная страница, которая загружается медленно. Среднее время загрузки 570 мс.

До оптимизации:



Вот та же самая страница примерно через 20 минут после оптимизации скорости страницы:



И остальные страницы после оптимизации:



Разница значительная. Оценка PageSpeed Insights почти идеальна, и каждая страница загружается довольно быстро.

В этой статье я расскажу, как добиться таких результатов (ребят, это перевод статьи, если что).

ВАЖНО

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

Шаг 1. Удалите неиспользуемые плагины

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

Шаг 2. Измените DNS-провайдера на Cloudflare

Большинство людей используют бесплатные DNS своего доменного регистратора, которые обычно работают медленно. Для ускорения работы можно воспользоваться бесплатным DNS-провайдером – Cloudflare.

Для этого создайте учетную запись в Cloudflare. Введите имя своего домена и нажмите кнопку «Добавить сайт».



Выберите бесплатный тариф, затем нажмите «Подтвердить тариф».

Так можно будет просмотреть настройки DNS, прежде чем продолжить.

Теперь все, что осталось сделать, это изменить Name Servers домена. У разных регистраторов это делается по-разному, поэтому не стесняйтесь обращаться к ним за помощью, если не знаете, как это сделать.
Вот как выглядит данный процесс в Google Domains:



Шаг 3. Установите плагин кеширования

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

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

WPRocket упрощает процесс кеширования. Просто установите и активируйте его. Если ваш сайт адаптивный, перейдите в настройки кеширования и установите галочку, чтобы включить кеширование и для мобильных устройств.



Также есть бесплатный вариант - W3 Total Cache.

Шаг 4. Минифицируйте код

Минификация удаляет пробелы и комментарии из кода, уменьшая размер файла. А файлы меньшего размера сокращают время загрузки.



Если вы используете WPRocket, установите в настройках галочки, чтобы уменьшить размеры файлов CSS и JavaScript.



Если вы не используете WPRocket, установите и активируйте Autoptimize и сделайте то же самое.

Шаг 5. Объедините файлы CSS и JavaScript

Большинство сайтов на WordPress имеют несколько файлов CSS и JavaScripts. Одни предназначены для изображений, другие – для плагинов. У вас также могут быть такие файлы. Их объединение может ускорить процесс загрузки, но все зависит от настроек вашего сервера.
  • С HTTP /1.1 CSS и JavaScript файлы загружаются последовательно.
  • С HTTP / 2 файлы загружаются одновременно.

Если ваш сервер использует HTTP/1.1, объединение файлов ускорит процесс потому, что нужно будет загружать меньше файлов. Если он использует HTTP/ 2, то объединение файлов не всегда будет приводить к увеличению скорости, так как файлы все равно будут загружаться одновременно.

Чтобы узнать, какую версию использует ваш сайт, введите свой домен в тестер Key CDN.



Если HTTP / 2 не поддерживается, то файлы CSS и JavaScript стоит объединить.

Для этого в WPRocket установите в настройках галочки «Объединить файлы JavaScript» и «Объединить файлы CSS».



Шаг 6. Удалите ресурсы, которые блокируют рендеринг

Рендеринг – это процесс превращения кода в видимую веб-страницу. Поэтому контент, находящийся в верхней части сайта, должен загружаться первым. А для контента в нижней части сайта, можно отложить загрузку некритических файлов CSS и JavaScript на более позднее время. Установите в WPRocket галочки «Загрузить отложенный JavaScript» и «Оптимизировать CSS delivery».



Если вы не используете WPRocket, вам понадобятся два плагина: Autoptimize и Async JavaScript.

В настройках Autoptimize установите галочку «Inline and Defer CSS». Затем в настройках Async JavaScript нажмите «Enable Async JavaScript.

Шаг 7. Ленивая загрузка изображений и видео

Ленивая загрузка увеличивает скорость страницы, откладывая загрузку изображений и видео до тех пор, пока они не появятся на экране. Если вы используете WordPress 5.5+, то для изображений уже включена отложенная загрузка по умолчанию.

Если вы используете WPRocket, установите галочку «Enable for iframes and videos» в настройках LazyLoad.



Если вы не используете WPRocket, то воспользуйтесь бесплатным плагином Lazy Load for Videos.

Шаг 8. Оптимизируйте шрифты

Многие используют шрифты от Google, которые загружаются с сервера Google каждый раз, когда кто-то посещает ваш сайт. Это может занять много времени потому, что ваш сервер должен делать HTTP- запросы, загружать файл CSS, а затем загружать шрифт из места, указанного в таблице стилей.

Если вы используете WPRocket, он автоматически оптимизирует Google Шрифты. Также для этих целей отлично подойдет Swap Google Fonts Display.

Шаг 9. Установите приоритет загрузки файлов

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

Предположим, что ваш код выглядит так:

Код
<html>
<head>
<script type = ”text / javascript” src = ”somefile.js”> </script>
<link rel = ”stylesheet” href = ”/ style.css”>
</head>
<body>
Content
</body>
</html>

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

Код
<link rel = "preload" href = "/ style.css" as = "style">

Это покажет браузерам приоритет файла CSS перед файлом JavaScript, независимо от иерархии.

Шаг 10. Используйте CDN

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

Предположим, что сервер вашего хостинга находится в Великобритании. Если кто-то заходит на ваш сайт из США, и вы не используете CDN, соединение между его устройством и вашим сервером будет медленным. В случае использования CDN, устройство пользователя из США подключится к ближайшему серверу. Это увеличит скорость перехода на ваш сайт.

Шаг 11. Оптимизируйте свои изображения

Ленивая загрузка решает многие проблемы, связанные с изображениями, но она не помогает изображениям в верхней части экрана. Чем больше их размер, тем медленнее загружается сайт.
Для сжатия изображений можно воспользоваться плагином Shortpixel. Установите его, активируйте, перейдите к настройкам, введите свой ключ API, нажмите «Сохранить и перейти к массовому процессу», затем нажмите «Перезапустить оптимизацию».



Если качество окажется слишком низким, перейдите в настройки и измените тип сжатия на глянцевое или без потерь.



Результаты

Вот результаты сканирования сервисом Google PageSpeed Insights до и после оптимизации сайта:
До оптимизации:



После оптимизации:



А вот то же самое от GTMetrix до оптимизации:



После оптимизации:



Можно увидеть, что ранее страница полностью загружалась за 5,9 секунд с размером страницы 1,89 МБ. После оптимизации все показатели снизились. Теперь размер страницы составляет 695 килобайт, время полной загрузки – 4 секунды.

Послесловие

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


--------------------
Stimul-Cash и RX-Partners - лидеры фарма бизнеса!


Поблагодарили: (4)
6
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
_fan_
_fan_
сообщение 9.11.2020, 13:27; Ответить: _fan_
Сообщение #2


Можно продолжить для ру сегмента:

11. Убираем вебвизор на метрике - получаем +5% к скорости.
12. Убираем полностью код метрики - получаем +10-13% к скорости.

Спс яндексу, у меня сайт 95% по PageSpeed Insights только благодаря метрике.
Зато в вебмастере скорость 3 из 5, у них видимо свои стандарты..

Спасибо за материал.


--------------------
Услуги Крауд Маркетинга - ссылки, которые работают!
Делаю быстро, качественно и дорого.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
WoWeb
WoWeb
сообщение 9.11.2020, 13:29; Ответить: WoWeb
Сообщение #3


Цитата(_fan_ @ 9.11.2020, 13:27) *
11. Убираем вебвизор на метрике - получаем +5% к скорости.
12. Убираем полностью код метрики - получаем +10-13% к скорости.

Поставьте коды счетчиков в отложенную загрузку. Что бы счетчики загружались после загрузки основного контента.

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

У себя делал кеширование постов в файл и кеширование query запросов в файл, на ssd серваках прирост хороший.

Сообщение отредактировал WoWeb - 9.11.2020, 13:33


--------------------


Поблагодарили: (4)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
WGN
WGN
сообщение 9.11.2020, 22:01; Ответить: WGN
Сообщение #4


Спасибо за статью только помню в своё время я этот плагин снёс. Был конфликт с каким то из основных плагинов, которые мне больше были нужны.


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Ostromir
Ostromir
сообщение 10.11.2020, 13:34; Ответить: Ostromir
Сообщение #5


Цитата(WoWeb @ 9.11.2020, 13:29) *
С автором топика согласен, только сжатие скриптов и включение кеширования в большей части случаев ломает какой либо функционал, будь то какие то ajax рейтинги или загрузки контента, иногда коменты отваливаются.


А меня еще смутила вся эта автоматизация с минимизированием кода...
Оно точно ничего не похерит?

ну и WPRocket по 50$ за год на одинм домен - конечно покусывает немного....
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
kstnews
kstnews
сообщение 10.11.2020, 17:52; Ответить: kstnews
Сообщение #6


У всех свои условия. Заинтересовал пункт:
Цитата
Шаг 2. Измените DNS-провайдера на Cloudflare

Как относительно пользователей сайта, которые не "всемирные", а "рядышком" – ру, уа, кз, уз, бай...
Может невнятно, если клиенты/пользователи заходят не из "Антарктиды" (заранее извиняюсь), повлияет ли на эти сайты изменение DNS или использование CDN.


--------------------
Пессимист, это вооружённый знаниями оптимист.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
LigaGiga
LigaGiga
сообщение 13.11.2020, 0:14; Ответить: LigaGiga
Сообщение #7


kstnews, я так понимаю там сами по себе DNS более "быстрые", простите за мое непрофессиональное мненеи, но вроде как именно так указано в статье
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
GoogleDo
GoogleDo
сообщение 13.11.2020, 1:16; Ответить: GoogleDo
Сообщение #8


а тупо если плагины искользовать что не будет такой же оптимизации?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
VinogradOFF
VinogradOFF
сообщение 13.11.2020, 1:22; Ответить: VinogradOFF
Сообщение #9


GoogleDo, а теперь выйдите и зайдите в класс с нормальным понятным вопросом
какие плагины использовать? Какой оптимизации?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
kstnews
kstnews
сообщение 13.11.2020, 12:59; Ответить: kstnews
Сообщение #10


LigaGiga, тоже не сильно профессионал :). Теоретически правильно – быстрые DNS лучше (еще бы знать, как проверить), но географически... Пользователь в Мск, хостинг в СПб – помогут ли мне быстрые DNS-сервера в Америке, или CDN в Австралии?

PS А может я что-то неправильно понимаю... Но в Клаудфаре зарегистрировался, хотя пока сайт не съедение не отдал. :)

Сообщение отредактировал kstnews - 13.11.2020, 12:59


--------------------
Пессимист, это вооружённый знаниями оптимист.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Добавить ответ в эту тему
Быстрый ответ
2 чел. читают эту тему (гостей: 2, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Как вернуться к жене от любовницы
121 Fubuki 9800 Сегодня, 12:55
автор: Стэнли
Горячая тема (нет новых ответов) Как перестать толстеть?
190 DocAnton64 9525 Сегодня, 9:43
автор: zyzy
Открытая тема (нет новых ответов) Как продвигать сайт, если денег мало или их нет
21 dontfarm 1320 Вчера, 23:58
автор: WGN
Открытая тема (нет новых ответов) Ищу работу
12 orrion79 1895 Вчера, 19:52
автор: orrion79
Открытая тема (нет новых ответов) Правки сайтов на WordPress
11 dulesov 1054 3.12.2020, 18:07
автор: wagan


 



RSS Текстовая версия Сейчас: 5.12.2020, 15:42
Дизайн