Vitest 5 помогает выяснить, куда уходит время тестового прогона Медленный запуск не всегда означает медленные проверки. Основное время может занимать создание окружения, импорт модулей или преобразование файлов. В Vitest 5 разбивка длительности показывает доли этих этапов, а vitest doctor запускает набор с альтернативными конфигурациями и предлагает варианты ускорения. Для Browser Mode появился Tr…

Shopify начал отправлять HTML до завершения рендеринга страницы Раньше браузер ждал, пока сервер соберёт и head, и остальные секции шаблона. Теперь подходящие Liquid-страницы отправляют начало документа сразу: браузер уже ищет стили и шрифты, пока сервер продолжает готовить содержимое. У медианного магазина TTFB на 75-м перцентиле снизился примерно на 29%. Видимые метрики FCP и LCP улучшились скро…

Почему мобильная клавиатура прячет панель с position: fixed Когда открывается клавиатура, браузер может уменьшить только видимую область страницы. Область, относительно которой рассчитывается вёрстка, остаётся прежней, и закреплённая снизу панель оказывается под клавиатурой. Директива interactive-widget=resizes-content в viewport meta позволяет уменьшать обе области. Пример: <meta name="viewport" …

Почему сотни маленьких JS-чанков тоже могут замедлять сайт Один большой бандл заставляет каждую страницу скачивать код всего приложения. Отдельный бандл на маршрут дублирует общие компоненты. Если же разнести каждый модуль в свой файл, браузер получит сотни запросов, а сжатие будет хуже находить повторяющиеся фрагменты. Команда Next.js разобрала, как Turbopack выбирает между этими расходами. Он уч…

Диаграмму Mermaid можно положить прямо в HTML Для схемы запросов или графа зависимостей часто хватает нескольких строк Mermaid. Компонент `<mermaid-element>` позволяет поместить этот текст в HTML: подключаете модуль, добавляете тег и записываете внутри описание диаграммы. По умолчанию компонент загружает Mermaid через jsDelivr по требованию и рисует схему в Shadow DOM. Несколько диаграмм на страни…