В Angular 18 появились улучшения рендеринга на стороне сервера

Компания Google опубликовала Angular 18, крупное обновление фреймворка для разработки веб-приложений на основе TypeScript, которое привнесло улучшения в рендеринг на стороне сервера и экспериментальную поддержку обнаружения изменений без зонирования. Релиз также переводит откладываемые представления и декларативный поток управления из предварительной версии для разработчиков в стабильную стадию.

Angular 18 был выпущен 22 мая. Доступ к нему можно получить на GitHub.

Улучшения серверного рендеринга включают поддержку гидратации i18n (интернационализация), улучшенную отладку, поддержку гидратации в Angular Material, а также повтор событий, который работает на основе той же библиотеки, что и Google Search. Ранее Google улучшил серверный рендеринг в Angular 17, выпущенном в ноябре 2023 года, который вывел гидратацию из предварительной версии для разработчиков и включил ее по умолчанию.

Бесзональное обнаружение изменений, новая экспериментальная возможность в Angular 18, освобождает обнаружение изменений от исторической зависимости от библиотеки zone.js. Предполагается, что эта функция в конечном итоге даст множество улучшений, включая лучшую совместимость с другими фреймворками, более быстрый начальный рендеринг и время выполнения, меньший размер пакетов и более быструю загрузку страниц, более простую отладку и более читаемые трассировки стека.

Также в Angular 18 появилась стабильная поддержка Material 3, откладываемых представлений и встроенного потока управления. Откладываемые представления, которые также известны как блоки @defer, могут использоваться в шаблонах компонентов для отсрочки загрузки отдельных зависимостей внутри шаблона, что позволяет уменьшить начальный размер пакета приложения.

Встроенный поток управления, или декларативный поток управления, - это новый встроенный синтаксис для потока управления, который привносит во фреймворк такие функции, как NgIf, NgFor и NgSwitch (как @if, @for и @switch соответственно), позволяя разработчикам условно показывать, скрывать и повторять элементы.

Другие возможности Angular 18:

• Event dispatch, основная библиотека, ранее известная как jsaction, теперь находится в монорепо Angular. Диспетчеризация событий обеспечивает воспроизведение событий при использовании гибридного рендеринга.
• Angular DevTools был обновлен для визуализации процесса гидратации Angular. Также теперь поддерживается работа нескольких приложений Angular в iFrames.
• Классы FormControl, FormGroup и FormArray из форм Angular теперь открывают свойство events, позволяющее разработчикам подписываться на поток событий для элементов управления формой. С его помощью можно отслеживать изменения значения, состояния прикосновения, нетронутого состояния и состояния элемента управления.
• Чтобы обеспечить большую гибкость при работе с перенаправлениями, redirectTo теперь принимает функцию, возвращающую строку.
• Разработчики теперь могут указывать содержимое по умолчанию для ng-content.
• Включены унифицированные события изменения состояния управления.
• Angular.dev становится новым сайтом документации. Посетители angular.io будут перенаправлены.

Angular 18 следует за выпущенным в ноябре 2023 года релизом Angular 17, в котором был представлен предварительный просмотр потока управления и введен hydration для восстановления отрисованного на стороне сервера приложения на клиенте. Google раскрыла свое намерение объединить Angular с веб-фреймворком Wiz.