Немногие знают, но у Angular Team есть roadmap, в котором описаны основные цели и задачи, которые ставят перед собой разработчики. Roadmap предназначен для того, чтобы дать всем пользователям фреймворка понимание перспектив, определяемых командой сейчас, а также предоставить планы будущих релизов, чтобы улучшить пользовательский опыт других разработчиков, то есть описывает направление развития Angular.

В данный момент перед командой Angular стоят две главные задачи:

1. Улучшить опыт разработки;

2. Улучшить производительность.

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

Чего удалось достичь?

1. Переход на ESLint, так как TSLint теперь deprecated, с сохранением обратной совместимости;

2. Улучшение отладки ошибок с помощью более информативных сообщений;

3. Оптимизация скорости сборки и уменьшение размера бандла с использованием Webpack;

4. Прекращение поддержки IE11;

5. Теперь IVY вместо View Engine;

6. Разработка строгой типизации @angular/forms;

7. Упрощение ментальной модели Angular с добавлением Standalone-компонентов и опциональным NgModules;

8. Улучшение документации;

9. Улучшение производительности изображений;

10. Hydration + SSR;

11. Новый control flow;

12. Появление angular.dev;

13. Deferrable views;

и многое-многое другое.

Developer Experience

Angular Signals

Сигналы переосмысливают реактивную модель Angular, внедряя данные примитивы в качестве основы реактивности. Первоначальное планирование привело к сотням обсуждений и сессиям обратной связи, исследованиям пользовательского опыта и серии RFC, которые получили более 1000 комментариев.

В рамках релиза v17 библиотека Angular Signals перешла из режима предварительной версии для разработчиков в стабильную, а в v18 уже есть возможность использовать часть из них в разработке. Ожидается, что работа по обратной связи от разработчиков продолжится, после чего API перейдёт в стабильный режим и будет глубже интегрирован в механизм обнаружения изменений Angular.

Подробнее про сигналы можно почитать тут.

Angular без Zone.js

В версии v18 была предоставлена экспериментальная поддержка Angular без zone.js. Это позволяет разработчикам не включать zone.js в свой бандл, что улучшает производительность, отладку и взаимодействие с другими библиотеками. В рамках первоначального релиза данное изменение также внедрили в Angular CDK и Angular Material.

Локальные переменные в шаблонах

Локальные переменные в шаблонах - одна из самых интригующих функций Angular issue tracker. Во втором квартале 2024 года команда Angular начала первоначальное проектирование и прототипирование. Обновления по данному функционалу стоит ожидать в ближайшее время.

Новые примитивы CDK

Также идёт работа над новыми примитивами CDK, чтобы облегчить создание пользовательских компонентов на основе шаблонов проектирования WAI-ARIA для выпадающих списков. В Angular v14 были представлены стабильные примитивы меню и диалогового окна в рамках этого проекта, а в v15 - Listbox.

Angular component accessibility

Компоненты в Angular Material оцениваются по стандартам доступности, таким как WCAG, и команда Angular работает над устранением любых проблем, возникающих в этом процессе.

Модернизация инструментов для модульного тестирования с ng test

В версии v12 был пересмотрен процесс сквозного тестирования Angular: Protractor был заменён современными альтернативами, такими как Cypress, Nightwatch и Webdriver.io. В рамках этой инициативы грядут изменения в ng test, чтобы модернизировать процесс модульного тестирования Angular. Во втором квартале 2023 года команда Angular внедрила экспериментальную поддержку Jest и объявила о переходе с Karma на Web Test Runner.

Оптимизация импортов с Language Service

Angular Language Service импортирует компоненты и директивы в приложениях со Standalone и NgModule. Кроме того, чтобы создавать меньшие пакеты приложений, предполагается, что Angular Language Service также будет предлагать автоматическое удаление неиспользуемых импортов.

А что по производительности?

Partial hydration

В версии v17 hydration выведена из режима предварительной версии для разработчиков, и с тех пор постоянно наблюдается улучшение LCP на 40-50%. Начато прототипирование partial hydration, экспериментальная поддержка которой ожидается в 2024 году.

Event replay

Event replay даёт возможность повторять пользовательские события (например, click), которые происходят на странице прежде, чем hydration завершится. Как только это произойдёт, все захваченные пользовательские события повторятся и соответствующие обработчики выполнятся. В версии v18 данная функция была представлена, она зависит от примитива отправки событий (ранее известного как jsaction), который работает на Google.com. В скором времни планируется перевести данную доработку в раздел стабильных.

Конфигурация серверных route'ов

Также идёт работа над тем, чтобы сделать конфигурацию маршрутов на сервере более эргономичной. Команда Angular хочет упростить объявление того, какие маршруты должны быть отрисованы на сервере, предварительно отрисованы или отрисованы на стороне клиента.

Планы на будущее

В данном разделе рассматриваются исключительно исследования и прототипы будущих наработок. Многочисленные RFC, приоритизация и стремительное изменение Web-технологий непосредственно влияют на дальнейшую судьбу данных фич.

Debugging сигналов в Angular DevTools

Поскольку сигналы в Angular становятся всё более распространёнными, команда Angular также будет работать над улучшением инструментов для их отладки. В приоритете - пользовательский интерфейс для проверки и отладки компонентов на основе сигналов.

Улучшение HMR (Hot Module Reload)

В настоящее время Angular CLI поддерживает HMR с помощью команды ng serve --hmr. По сути, это в основном приводит к повторной отрисовке приложения Angular с нуля, что лучше, чем полная перезагрузка страницы, но, безусловно, это может быть улучшено. Самое главное, стратегия здесь должна заключаться в оптимизации времени выполнения для любого изменения в зависимости от частоты этого типа изменений. В будущем команда Angular изучит ряд возможностей улучшения HMR, включая:

1. Быструю обработку изменений только CSS и применение их ко всем существующим компонентам на странице.

2. Быструю обработка изменений только в шаблонах Angular и применение их ко всем существующим компонентам на странице.

Потоковый SSR

В течение последних нескольких релизов шла работа над тем, чтобы сделать серверную отрисовку Angular более надежной. В приоритете - изучение потоковой серверной отрисовки для приложений без zone.js - это техника, при которой HTML страницы рендерятся на сервере и отправляются клиенту частями (потоками), по мере его готовности. Это позволяет ускорить время первого рендера (FCP), так как клиент начинает отображать контент, не дожидаясь полной загрузки всей страницы. Такой подход улучшает производительность и пользовательский опыт, особенно на сложных или медленных соединениях.

Authoring format improvements

На основании результатов опросов разработчиков были замечены возможности для улучшения эргономики формата создания компонентов. Первым шагом этого процесса будет сбор требований и углубленное изучение проблемного пространства для подготовки RFC.

Поддержка drag-and-drop по двум осям

В рамках этого проекта команда Angular хочет реализовать поддержку смешанной ориентации по осям для перетаскивания в Angular CDK. Это одна из самых запрашиваемых функций в Angular issue tracker.

Оценка поддержки Nitro в Angular CLI

Nitro — это серверный фреймворк для создания быстрых веб-приложений, использующий универсальный рендеринг на сервере (SSR) и статическую генерацию (SSG). Nitro разработан для оптимизации производительности серверов и решает следующие задачи: ускорение серверного рендеринга, лёгкость интеграции с различными сервисами, оптимизация производительности приложений за счёт улучшенного кэширования. Позже команда Angular оценит, как Nitro вписывается в модель серверной отрисовки Angular.