Як групувати та зменшувати ресурси в WordPress

Краща продуктивність — це мрія кожного, хто керує веб-сайтом, групує та зменшує ресурси на WordPress — це одна з найкращих речей, які ми можемо зробити для цього, але це може бути дуже важко. Якщо ви не розробник, згрупуйте всі свої ресурси (переважно файли css і js), оскільки це може призвести до конфлікту.

WP Speed of Light є найкращим рішенням для роботи вашого сайту WordPress, тому що він має багато опцій для швидкого завантаження вашого сайту за допомогою дійсно зручної інформаційної панелі, і так, одним із цих варіантів є групування та мінімізація ресурсів. Включення/виключення одного файлу з групи та процесу мінімізації є ключовим фактором для індивідуальної оптимізації без конфліктів.

Ми збираємося використати приклад сайту WordPress для цієї публікації в блозі, і ми дізнаємося, як це зробити, щоб процес налаштування всього було простішим.

Як виконати мініміфікацію WordPress JS і CSS

Давайте навчимося виконувати мінімізацію Wordpress js і CSS, але спочатку нам потрібно знати, що означає мінімізація. «Мініфікація стосується процесу видалення непотрібних або зайвих даних, не впливаючи на те, як ресурс обробляється веб-переглядачем, наприклад, коментарі коду та форматування, видалення невикористаного коду, використання коротших імен змінних і функцій тощо».

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

Так, 2,79 секунди для завантаження сторінки, непогано, але могло б бути краще, просто давайте мінімізувати js і CSS і побачимо різницю, перейдіть до WP Speed of light > Прискорення > Групувати та мінімізувати , ви зможете щоб побачити меню з усіма параметрами для мінімізації. Безкоштовна версія плагіна включає опцію групи та мінімізації, але виключення візуальних файлів доступне лише у версії PRO Addon.

Параметри доповнення PRO: Виключити вбудований сценарій (Виключити вбудований сценарій із мініфікації), перемістити сценарії до нижнього колонтитула (це дозволяє пришвидшити ваш сайт, перемістивши всі скорочені сценарії до нижнього колонтитула), Групувати шрифт і Google Fonts (Групувати локальні шрифти та шрифти Google в одному файлі для швидшого обслуговування) і Розширене виключення файлів.
 
У вас є можливість мінімізувати, як бачите, JS, CSS, а також HTML, тепер просто активуйте ці параметри, натисніть «Зберегти», і всі ваші ресурси будуть мінімізовані відразу. Це може мати проблеми, оскільки це розширена конфігурація, але все можна виправити за винятком деякого коду та файлів (за допомогою аддона pro).

Тепер уся робота розробника, яка може тривати годинами, виконується всього за кілька секунд.

Наступним кроком буде оптимізація CSS і JS у WordPress

За допомогою цього плагіна ми дозволимо wordpress оптимізувати CSS та js, просто увімкнувши параметри групи на інформаційній панелі, перейдіть до WP Speed of Light > SpeedUp > Group & Minify , ви зможете побачити інформаційну панель з параметрами для групування CSS і js.

Ці параметри дозволяють:

• Групувати JS: групування кількох файлів Javascript в один файл мінімізує кількість запитів HTTP
• Групувати CSS: групування кількох файлів CSS в один файл мінімізує кількість запитів HTTP.

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

Щоб перевірити, скільки файлів, сценаріїв ви можете згрупувати на своєму веб-сайті, просто відкрийте консоль браузера (клацніть правою кнопкою миші > Перевірити або F12) і відкрийте мережеву панель .

Потім ви можете перерахувати всі завантажені файли за типом, тут у цьому прикладі я натиснув лише список файлів JS.

Тепер, коли ми перейшли до цих налаштувань, просто ввімкніть параметри групи (група CSS і група JS) і натисніть «Зберегти». Майте на увазі, що ці параметри слід використовувати з обережністю, і вам доведеться перевірити свою сторінку, оскільки це може спричинити конфлікти .

Давайте серйозно оптимізуємо щільність шрифту

Що? Інша оптимізація? Так! Ви зможете оптимізувати вагу шрифту, і це буде так само просто, як увімкнути опцію в налаштуваннях, просто перейдіть до WP Speed of Light > SpeedUp > Group & Minify > Group fonts та опцію Google Fonts.
Опція групових шрифтів і шрифтів Google дозволить вам згрупувати їх в одному файлі, щоб швидше обслуговуватись, це дуже зручно, оскільки більшість тем і макетів WordPress поставляються з 2 шрифтами або шрифтами за замовчуванням з усіма відхиленнями (звичайний, жирний, курсив). ...)

Просто ввімкніть цю опцію, натисніть «Зберегти», і всі шрифти будуть згруповані.

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

Яка різниця, від 2,8 до 0,56 секунди! Як ми вже говорили вам на початку цього допису, ми можемо покращити час завантаження;)

Як використовувати виключення мініфікації файлів

Мініфікація може викликати проблеми на вашому сайті, в основному це відбувається, коли ви групуєте певні файли, які містять помилку в синтаксичній помилці або подібну змінну, назву класу. Ось чому за допомогою параметра «виключення мініфікації файлів» ви зможете виключити файли з процесу мініфікації та групування, перейдіть до WP Speed of Light > SpeedUp > Group & Minify , ви зможете побачити параметр Розширений виключення файлів .

Щоб скористатися розширеним виключенням файлів, вам потрібно спочатку запустити сканування, увімкнувши опцію та натиснувши «Запустити сканування».

 Щоб мати можливість відобразити скрипт, завантажений на вашому веб-сайті, WP Speed of Light має просканувати вашу папку, щоб перерахувати їх. Зазвичай усі вони містяться у вашій папці /wp-content, яка групує всі ваші плагіни та теми. Виберіть цю папку (принаймні) і натисніть «Сканувати зараз»

Він запустить сканування, нарешті, натисніть на переглянути результати, коли сканування буде завершено.

Нижче має бути відображений список файлів, класифікованих за типами (Усі, JS, CSS, Шрифт). Якщо ви визначили один файл, який викликає проблеми, під час активації групи файлів і мінімізації ви можете виключити його звідси за допомогою простого перемикача ON/OFF .

Це допоможе вам виключити файли та, таким чином, легко вирішити будь-яку проблему, яка може виникнути під час мінімізації ресурсів… Процес групування та мінімізації все ще потребує певної роботи, особливо під час тестування, але це точно варте зусиль, і ви це зробите. будьте завжди в змозі перевірити, як це працює, запустивши тест швидкості безпосередньо з WP Speed of Light .
 
Спробуйте WP Speed of Light : https://www.joomunited.com/wordpress-products/wp-speed-of-light

×

×

Не йдіть, не поділившись електронною поштою!

Ми не можемо гарантувати, що ви виграєте в лотерею, але ми можемо пообіцяти кілька цікавих інформаційних новин щодо WordPress або Joomla та періодичні знижки.

Твоє ім'я:

Ваша електронна адреса:

Підпишіться на наш блог