Щоб покращити швидкість сторінки, часто потрібна підтримка різних інструментів. Деякі з цих інструментів використовуються для вимірювання швидкості сторінки, тоді як інші використовуються для зменшення розміру ресурсів вашої сторінки. У цій статті ми створили бібліотеку, яка слугуватиме зручним довідником.
Якщо нам потрібно перерахувати області, охоплені інструментами в цій статті:
- Інструменти для визначення швидкості сторінки
- Інструменти для зменшення розміру зображення
- Інструменти оптимізації CSS, JavaScript, HTML
Інструменти для визначення швидкості сторінки
- Google Pagespeed Insights: Найвідоміший інструмент швидкості сторінки. Він оцінює сайти за допомогою інфраструктури Lighthouse і надає дані за останні 28 днів.
- Тест веб-сторінки: платформа, яка виконує три різні тести на своїй інфраструктурі, щоб отримати середні результати, і пропонує більш технічний звіт з API.
- Treo.sh: єдина платформа, яка представляє візуальні дані за останні 12 місяців на основі інфраструктури Pagespeed та CrUX.
- GTmetrix: інструмент, який надає інформацію про швидкість сайту за допомогою інфраструктури Lighthouse і дає власну оцінку.
- Dareboost: інструмент, який надає інформацію про швидкість сайту щодо його інфраструктури.
- Додаток Calibri: інструмент, який дозволяє порівнювати кілька сторінок із конкурентами за допомогою інфраструктури Lighthouse.
- SpeedCurve: Платний інструмент, де можна знайти RUM і синтетичні дані про швидкість сайту.
- Yellowlab: корисний інструмент, який надає унікальні покращені показники своєї інфраструктури.
- Комплект швидкості: один із рідкісних інструментів, який не тільки діагностує, але й лікує проблеми сайту, доступний як плагін WordPress і для звичайних сайтів.
- Perfmatters.io: легкий плагін продуктивності для WordPress.
Інструменти для зменшення розміру зображення
- Imagify.io: інструмент для зменшення розмірів зображень із API та плагіном WordPress.
- Squoosh.app: дуже простий і швидкий інструмент для перетворення зображень у такі формати, як MozJPEG, OptiPNG і WebP.
- TinyJPG: Простий інструмент для зменшення розмірів JPG.
- TinyPNG: PNG-версія попереднього інструменту.
- Compressor.io: платформа, яка стискає формати JPEG, PNG, GIF і SVG і виділяється своїми порівняльними візуальними ефектами.
- Кракена: один із найстаріших і найнадійніших інструментів із підтримкою API, що пропонує формати JPEG, PNG, GIF, анімований GIF і SVG, а також плагіни WordPress і Magento.
- Optimizilla: простий і дуже корисний компресор файлів JPEG і PNG.
- ImageOptim: онлайн-інструмент, особливо корисний для пакетного стиснення зображень на комп’ютерах Mac.
- Crush Pics: інструмент, що пропонує оптимізацію зображень без втрат за допомогою плагінів Shopify і WordPress, також доступних через API.
- Мініфікатор: зручний для SEO інструмент для Shopify, який генерує теги alt для зображень.
- GIMP Save for Web: програма для Windows, яка дозволяє пакетне стиснення зображень.
- Інструмент аналізу зображень веб-сайту: інструмент, який повідомляє вам, який формат зображення є більш оптимізованим на основі вхідної URL-адреси.
Інструменти оптимізації CSS, JavaScript, HTML
- Refresh-SF: інструмент, який стискає CSS, JS і HTML на одному сайті.
- CleanCSS: широко використовуваний інструмент для стиснення CSS.
- Охайний стиль: інструмент, який стискає формати CSS, JS і HTML на одній платформі.
- Оптимізатор CSS: платформа, яка забезпечує оптимізацію CSS.
- Табіфікатор: платформа, яка стискає структури коду HTML, CSS і JSON.
- Мініфікатор: платформа, яка стискає структури CSS і JS.
- Критичний CSS: вихідний код GitHub, розроблений Адді Османі для вилучення критичного CSS зі сторінок.
- PurifyCSS: дуже корисний інструмент, який відокремлює невикористаний CSS на сторінці.
Ці інструменти можуть значно покращити вашу продуктивність веб-сайту шляхом оптимізації різних аспектів, від вимірювання швидкості сторінки до зменшення розміру активів і оптимізації коду.
