Lighthouse Treemap

Внезапно для себя обнаружил, что в Lighthouse давно есть возможность посмотреть загружаемые на страницу скрипты в виде Treemap. Это такое отображение прямоугольничками, чтобы понимать, что больше весит по сравнению с другими частями. В Node.js — уже привычный способ смотреть на зависимости, а вот про то, что так же можно посмотреть клиентскую часть прямо в браузере, узнал только сегодня. Случайно кликнул кнопку View Treemap, которую всё время игнорировал.

Посмотреть свои скрипты можно как минимум тремя способами:
1. Запустить аудит Lighthouse прямо в Chromium-браузере, после аудита нажать ту самую кнопку View Treemap.
2. Выгрузить результаты аудита в формате JSON и загрузить на https://googlechrome.github.io/lighthouse/treemap/
3. Запустить Lighthouse через CLI, сгенерировать отчёт.

Нашёл таким образом сегодня внезапный скрипт, который не ожидал увидеть в продакшене.

https://umaar.com/dev-tips/247-lighthouse-treemap/