Оптимізація продуктивності сайту на WordPress

18

Від автора: вам не потрібен повільний сайт. Потенційні відвідувачі можуть піти з нього, не чекаючи кінця завантаження сторінки, а ви опуститеся в пошуковій видачі, що ще сильніше скоротить трафік. Вам потрібно, щоб сторінки вантажилися за дві секунди або менше. Як цього досягти? Поступово. У цій статті ми покажемо, що можна оптимізувати, щоб прискорити ваш сайт на WP. У наступній статті ми складемо список корисних плагінів.

Наскільки повільний мій сайт?

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

Нижче складений список сервісів, які інформують про тривалості завантаження сторінок і загальній вазі файлів на сторінці:

GTmetrix

YSlow

Google Insights PageSpeed

Pingdom

Заміряйте швидкість сайту до і після налаштування продуктивності. Якщо ви домоглися завантаження сторінок за 2 секунди, значить, ви все зробили правлиьно.

Слідкуйте за приростом продуктивності після виконання кожного кроку. Після якогось кроку спостерігається найбільший приріст?

Виберіть хороший хостинг

Неможливо прискорити сайт, якщо він зберігається на повільному сервері. Вибір правильного хостинг провайдера – перший важливий крок на шляху до швидкої завантаженні сайту.

Як вибрати компанію, в якій швидкості приділяється особлива увага? Подивіться чекліст продуктивності у статті «повне керівництво по вибору хостинг провайдера».

Не так давно SitePoint уклав угоду з SiteGround. Тепер SiteGround є офіційним рекомендованим хостингом сайту SitePoint. Сервери провайдера розкидані по декількох континентах, і на них використовуються новітні SSD-накопичувачі, а також вбудоване кешування. Також є безкоштовний CDN. SiteGround багато інвестує в прискорення. Їх гнучкі сервери постійно оновлюються як програмно, так і апаратно, а також підтримують PHP7 і HTTP/2.

Оптимізуйте тему

По-перше, використовуйте швидку тему. Теми з безліччю опцій спрощують життя в збиток сервера та браузера. Деякі теми WP важать кілька мегабайт, що додає кілька секунд до часу завантаження.

Кожна невживана функція уповільнює ваш сайт без будь-якої потреби. Якщо ви можете залізти в код і щось поправити, виберіть тему з мінімальною кількістю опцій, щоб прискорити сайт.

Теми WP за замовчуванням легко змінювати, вони мало важать, а їх код добре написаний. Виберіть одну з них і перепишіть код самі або найміть розробника.

Thesis і Schema – ще дві теми, які ставлять пріоритет продуктивність.

Нарешті, WordPress Base Theme, яка стоїть на SitePoint, також чудовий приклад для початку. Ця легка і дуже швидка тема, 98/100 на Pingdom Page Speed Test.

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

Адаптивні сайти подобаються Google, так що чекайте невеликого приросту в SEO при переході на адаптивний дизайн.

Слідкуйте за своїми плагінами

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

По-друге, перевірте плагіни на оптимізацію для вашої версії WP. Пошукайте інформацію перед установкою плагіна, особливо якщо у нього три або менше зірок. Плагін може бути погано розроблений, а також може використовувати невідповідні хуки. Такий плагін сповільнить сайт і може несприятливо вплинути на WP і інші плагіни. Також важливо постійно оновлювати плагіни, щоб бути впевненим, що у вас встановлені останні поліпшення продуктивності, патчі безпеки і функції.

Оптимізуйте свої віджети

Віджети мають бути легкими і максимально просто завантажуватись. Деякі з них при відображенні подгружают зовнішній JS і CSS. Зовнішні ресурси зазвичай завантажують віджети соціальних мереж типу Facebook, Twitter і Google+.

Якщо віджет буде рідко оновлюватися, завантажите його на свій сервер. Не покладайтеся на зовнішні сервери, так ви зменшите час завантаження.

Оптимізуйте статичний контент

По-перше, стисніть статичний контент за допомогою gZip. Стислі файли важать менше, а значить, завантажуються швидше.

Якщо сервер загальний, найкраще включити gZip-стиснення прямо через cPanel (якщо ваш хостинг провайдер пропонує таку панель).

Включити gZip-стиснення можна через плагін типу W3 Total Cache. Плагіни ми розглянемо в наступній статті.

В ідеалі, шукайте хостинг, пропонує в своїх тарифах CDN, як SiteGround. Існує безліч CDN-мереж: Amazon S3, max-cdn, Media Temple CDN, Cloudflare, Free CDN.

CDN зі списку вище працюють з плагінами кешування, про яких ми поговоримо наступного разу.

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

Зображення – один з найбільш важких елементів на сайті – вони становлять 65% всього контенту в мережі. Існує кілька способів оптимізувати завантаження зображення.

Перший, визначити максимальна роздільна здатність зображення для превью, середніх і великих розмірів. Ці опції розташовані у Settings/Media. Якщо ви завантажите зображення 1024px, а контентна область становить 604px, то зображення зменшиться через CSS. Отримане зображення 604px завширшки набагато простіше завантажити.

По-друге, стискайте! Ця техніка зменшує розмір файлів без втрати якості і зміни розмірів. Yahoo вбили сервіс Smush.it пару років тому, але в мережі є і інші сервіси типу reSmush.it, а також ряд плагінів, про які ми поговоримо в наступній статті.

По-третє, використовуйте ліниву завантаження. Ця техніка добре себе показала на сайтах з великою кількістю зображень. Зображення завантажуються тільки, коли стають видимими, а не після завантаження сторінки. Це може кардинально прискорити завантаження сторінок, однак техніка додає затримку перед відображенням зображень, що потрапили в область перегляду.

По-четверте, підбирайте кращий формат зображень для свого сайту. З деякими форматами зображень легше працювати, а інші менше важать. Наприклад, SVG мало важать, особливо якщо оптимізувати їх для вебу і стиснути через gZip. Вивчіть плюси і мінуси різних форматів.

По-п’яте, використовуйте CSS-спрайт. Об’єднайте безліч маленьких зображень з теми в мінімальну кількість файлів, це підвищить продуктивність.

Оптимізуйте базу даних

Сторінки WP завантажуються з бази даних mySQL. З часом база даних накопичує безліч непотрібної інформації. Оптимізація бази даних видаляє цю інформацію і підвищує продуктивність.

Базу даних можна оптимізувати безпосередньо через phpMyAdmin або за допомогою плагінів. Про плагіни ми поговоримо в наступній статті.

Прискорте високонавантажених сайти за допомогою кешування

Кешування сильно допомагає высоконагруженным сайтів. Кожен раз при завантаженні WP-сторінки інформація витягується з бази даних і CSS-файлів і змішується з HTML-файлом, який можна завантажити в браузер користувача. На все це потрібен час.

Кешування зберігає ці файли HTML, заощаджуючи час відвідувачам. Плагіни кешування ми розглянемо в наступній статті.

Обслуговуйте WordPress

Підтримуйте свій сайт в формі і проводите регулярне обслуговування. Деякі процедури можуть значно прискорити сайт, а зокрема:

оновлюйте WP і плагіни;

видаліть старі ревізії постів;

видаляйте спам в коментарях.

Додаткові поради

Видаліть сміття. В базі даних може бути багато сміття, уповільнює сайт. За замовчуванням WP автоматично видаляє сміття кожні 30 днів. Видалити сміття можна вручну в панелі адміністратора. У наступній статті ми покажемо парочку корисних плагінів.

Минифицируйте JS і CSS-файли, видаливши з них непотрібні дані. На CSS Minifier є кілька інструментів минификации.

Вимкніть трекбэк і пінґбек. Вони задіють сервера і бази даних кожен раз, коли хтось згадує ваш сайт. Відключення (налаштування WordPress Discussion ) не поламає зворотні посилання.

Пробуйте!

А наскільки ваш сайт повільний? Дізнайтеся це за допомогою одного з перерахованих вище інструментів. Потім спробуйте одну-дві стратегії і знову оцініть швидкість. І так ще раз.

Як ми сказали, в мережі повно WP-плагінів по оптимізації. У наступній статті ми детально розберемо їх, слідкуйте за виходом нових статей!

SiteGround, наш улюблений хостинг провайдер, який дозволяє використовувати потужні техніки оптимізації продуктивності в пару кліків. В керівництві по поліпшенню продуктивності WP є повноцінні уроки на безліч тем, які ми обговорили в цій статті, у тому числі за кешуванню, gZip-стиснення, використання CDN, оптимізації зображень і оптимізації бази даних WP.

А яка стратегія оптимізації дала вам максимальний приріст продуктивності на сайті? Пишіть в коментарях.