Як проаналізувати ефективність веб-сайту за допомогою Lighthouse

Перевіряйте ефективність веб-сайту вручну, програмно або автоматично

Lighthouse - це проект Google із відкритим кодом, який дає вам можливість виміряти ефективність веб-сторінок. Він має настроювані налаштування для відтворення різних умов. Наприклад, можна встановити для моделювання мережу та тип пристрою.

Ви надаєте Lighthouse URL-адресу для аудиту, вона проводить низку перевірок щодо сторінки, а потім створює звіт про те, наскільки добре це зробила сторінка. Звідти використовуйте невдалі перевірки як показники того, як покращити сторінку. Кожен аудит має довідковий документ, який пояснює, чому аудит важливий, а також як це виправити. Маяк

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

Запуск Маяка з Chrome DevTools

Ви можете запускати перевірки продуктивності вручну за допомогою розширення браузера Chrome DevTools. Просто запустіть розширення з веб-сторінки, яку ви хочете протестувати, і виберіть панель «Аудити».

Серед різноманітних аудиторських перевірок ви можете обрати „ефективність”. Ви також можете імітувати тип пристрою та регулювання мережі. Деяку інформацію про дроселювання можна знайти в репозиторії проекту Lighthouse Github.

Далі натисніть "Запустити аудит". Після завершення, Lighthouse надає звіт в інтерфейсі розширення.

Цей звіт являє собою загальний огляд важливих показників, можливостей та загальної оцінки ефективності. Ескізи ілюструють життєвий цикл завантаження сторінки. Що це все означає? Google надає безліч документації, що описує кожну метрику, способи її вирішення та загальний показник ефективності.

У верхній лівій частині панелі Chrome DevTools є значок завантаження, за допомогою якого можна завантажити повний звіт у форматі JSON. Потім ви можете використовувати його для створення звіту у форматі PDF за допомогою програми Lighthouse Report Viewer.

Через велику кількість факторів, що впливають на життєвий цикл завантаження сторінки, важливо порівнювати результати в партіях. Наприклад, якщо взяти в середньому 5 пробіжок, це забезпечить кращу розуміння.

Біг маяка програмно

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

Як і вище, ви також можете запустити Lighthouse у коді, дотримуючись документації щодо програмного використання модуля Node. Ви можете створити повноцінний додаток Node.js за допомогою Lighthouse ?!

Запуск маяка автоматично з часом

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

Використання “Foo” для запуску Маяка та порівняння результатів з часом

В інженерних умовах, коли багато розробників регулярно впроваджують зміни додатків, може бути важливим моніторинг продуктивності веб-сайту з часом, щоб пов’язати набори змін із погіршенням або покращенням продуктивності. Іншим прикладом можуть бути команди, які ініціюють підвищення ефективності для рейтингу SEO чи з інших причин. У цих ситуаціях критично важливо контролювати ефективність веб-сайту протягом днів, тижнів, місяців тощо.

Ви можете додати URL-адреси для відстеження на веб-сайті www.foo.software та відстежувати зміну продуктивності. Foo також надає сповіщення електронною поштою, Slack або PagerDuty, коли продуктивність опускається нижче межі, визначеної користувачем, коли вона повертається до норми та коли вдосконалення визначаються автоматично!

Найкраще в тому, що ви можете безкоштовно створити обліковий запис! Після реєстрації та входу в систему натисніть посилання «Сторінки» у верхній частині навігаційної панелі. Тут ви можете додавати URL-адреси для моніторингу. Foo зберігає результати та відображає графік часової шкали, що забезпечує візуалізацію важливих показників. Ви можете переходити між днями, тижнями, місяцями та детально звітувати.

Висновок

Lighthouse стає галузевим стандартом вимірювання продуктивності веб-сайтів. Є книги, що вартують документації про Маяк, яка містить деталі важливих показників.