Калькулятор бюджета веб-производительности
Отслеживайте бюджет производительности веб-страницы по HTML, CSS, JS, изображениям и шрифтам. Рассчитайте общий размер, использование бюджета и оценочное время загрузки по 3G.
Как использовать калькулятор бюджета производительности
- Введите общий бюджет производительности в КБ.
- Введите размеры HTML, CSS, JS, изображений и шрифтов.
- Нажмите «Рассчитать», чтобы увидеть использование, остаток бюджета и время загрузки по 3G.
Примеры использования
- •Контроль бюджетов производительности в CI/CD пайплайнах.
- •Аудит веса страницы перед релизами.
- •Сравнение мобильной производительности версий страниц.
- •Установка лимитов размеров ресурсов для команд разработки.
Формула
Итого = HTML + CSS + JS + изображения + шрифты. Загрузка по 3G = итого КБ / 50 КБ/с. Оценка: 100 при < 200 КБ, снижается до 20 при > 2 МБ.
Часто задаваемые вопросы
Что такое бюджет производительности?
Бюджет производительности устанавливает максимальные размеры или пороговые значения времени для веб-ресурсов, чтобы обеспечить быструю загрузку.
Какой общий размер страницы считается хорошим?
Менее 200 КБ — отлично. Менее 500 КБ — хорошо. Свыше 1 МБ начинает вызывать медленный опыт на мобильных устройствах.
Как уменьшить размер JS-бандла?
Используйте tree shaking, разделение кода, ленивую загрузку и откажитесь от больших зависимостей. Цельтесь менее чем на 150 КБ JS.