Chrome 145: поддержка import defer и using из ECMAScript 2026

[hannadev]

Chrome 145 принес поддержку ключевых фич из ECMAScript 2026 - import defer и using. Эти возможности упрощают загрузку модулей и управление ресурсами в JavaScript. Теперь разработчики могут писать более эффективный код без лишних boilerplate.

import defer решает проблему блокировки рендера при импорте модулей. А using автоматизирует очистку ресурсов, делая код чище и надежнее. Это особенно полезно для больших приложений, где память и производительность критичны. Проблемы с утечками и задержками загрузки уходят в прошлое.

Что такое import defer и зачем оно нужно

Сейчас стандартный import блокирует парсинг HTML, пока модуль не загрузится полностью. Это тормозитальную отрисовку страницы, особенно если модуль тяжелый или зависит от сети. import defer меняет правила: модуль загружается асинхронно, но выполняется строго по порядку, указанному в HTML.

Представьте SPA с кучей модулей - раньше приходилось использовать динамические импорты с then(), что усложняло код. Теперь в HTML просто добавляете defer, и браузер сам разберется. Chrome 145 реализует это по спецификации ECMAScript 2026, обеспечивая совместимость с будущими версиями JS.

Это снижает First Contentful Paint на 20-30% в типичных сценариях. Аргумент простой: тесты показывают, что deferred импорты не ломают порядок выполнения, но ускоряют запуск. Логично перейти к примерам использования.

• Базовый синтаксис: <script type="module" defer src="app.js"></script> - модуль грузится фоном, выполняется после DOM.
• Цепочка зависимостей: Несколько <script defer> подряд гарантируют последовательное выполнение, как в классическом JS.
• Нюанс: Работает только в top-level скриптах, не в динамических импортах. Тестируйте на полифиллах для старых браузеров.

Сравнение import подходов
Тип	Блокировка рендера	Порядок выполнения	Поддержка в Chrome 145
Классический import	Да	Строгий	Да
import defer	Нет	Строгий	Новая
Dynamic import()	Нет	Асинхронный	Да

Using: автоматическая очистка using Disposable

using - это декларативный способ работы с ресурсами, реализующий протокол Disposable. Объекты, помеченные как using, автоматически вызывают dispose() в конце скоупа, освобождая память. Это как try-finally, но короче и без ошибок.

В ECMAScript 2026 using распространяется на переменные и параметры функций. Chrome 145 добавляет полную поддержку, включая WeakRef-варианты для избежания циклов сборки мусора. Без этого разработчики вручную писали finally-блоки или полагались на WeakMap - ненадежно и verbosely.

Пример: в Web API вроде ReadableStream или custom классах with dispose() using спасает от утечек. Производительность растет, код становится declarative. Тесты показывают нулевые утечки в 99% случаев по сравнению с ручной очисткой.

• Локальная переменная: using stream = new ReadableStream(); - dispose срабатывает после блока.
• Параметры функции: function process(using reader) { ... } - читатель очищается автоматически.
• Важно: Поддерживает async using await для промисов, но только в top-level await скоупах.

Сравнение очистки ресурсов
Подход	Синтаксис	Автоматичность	Ошибки
Ручной try-finally	try { } finally { dispose() }	Нет	Высокий риск
WeakRef + GC	new WeakRef(resource)	Частично	Средний
using	using res = …	Да	Минимальный

Как мигрировать код на новые фичи

Миграция начинается с аудита импортов: найдите все