O Google publicou o Angular 18, uma grande atualização da estrutura de desenvolvimento de aplicativos da web baseada em TypeScript do Google que traz melhorias na renderização do lado do servidor e suporte experimental para detecção de alterações sem zonas. A versão também move visualizações adiáveis ​​e fluxo de controle declarativo da visualização do desenvolvedor para um estágio estável.

Angular 18 foi lançado em 22 de maio. Ele pode ser acessado no GitHub.

As melhorias na renderização do lado do servidor incluem suporte à hidratação i18n (internacionalização), melhor depuração, suporte à hidratação no Angular Material e reprodução de eventos, que é alimentado pela mesma biblioteca da Pesquisa Google. O Google aprimorou anteriormente a renderização do lado do servidor no Angular 17, lançado em novembro de 2023, que tirou a hidratação da visualização do desenvolvedor e a ativou por padrão.

A detecção de alterações sem zona, um recurso novo e experimental no Angular 18, libera a detecção de alterações de sua dependência histórica da biblioteca zone.js. Esse recurso tem como objetivo oferecer uma série de melhorias, incluindo melhor capacidade de composição para micro front-ends e melhor interoperabilidade com outras estruturas, renderização inicial e tempo de execução mais rápidos, tamanhos de pacotes menores e carregamentos de página mais rápidos, depuração mais simples e rastreamentos de pilha mais legíveis.

Também no Angular 18, o suporte ao Material 3, as visualizações diferidas e o fluxo de controle integrado agora estão estáveis. Visualizações adiáveis, também conhecidas como blocos @defer, podem ser usadas em modelos de componentes para adiar o carregamento de dependências selecionadas dentro do modelo, reduzindo assim o tamanho do pacote inicial do aplicativo.

Fluxo de controle integrado, ou fluxo de controle declarativo, é uma nova sintaxe integrada para fluxo de controle que traz funcionalidades como NgIf, NgFore NgSwitch na estrutura (como @if, @fore @switch respectivamente), permitindo que os desenvolvedores mostrem, ocultem e repitam elementos condicionalmente.

Outros recursos do Angular 18:

  • O envio de eventos, uma biblioteca central anteriormente conhecida como jsaction, agora reside no monorepo Angular. O envio de eventos potencializa a reprodução de eventos ao usar a renderização híbrida.
  • Angular DevTools foi atualizado para visualizar o processo de hidratação Angular. Agora também oferece suporte a vários aplicativos Angular em execução em iFrames.
  • O FormControl, FormGroupe FormArray classes de formulários Angular agora expõem uma propriedade chamada events, permitindo que os desenvolvedores assinem um fluxo de eventos para controle de formulário. Usar isso pode rastrear alterações no valor, estado de toque, status original e status de controle.
  • Para fornecer mais flexibilidade ao lidar com redirecionamentos, redirectTo agora aceita uma função que retorna uma string.
  • Os desenvolvedores agora podem especificar o conteúdo padrão para ng-content.
  • Os eventos de alteração de estado de controle unificado estão habilitados.
  • Angular.dev se torna o novo site de documentos. Os visitantes do angular.io serão redirecionados.

Angular 18 segue o lançamento de novembro de 2023 do Angular 17, que visualizou o fluxo de controle e introduziu hidratação para restaurar o aplicativo renderizado no lado do servidor no cliente. O Google revelou sua intenção de fundir o Angular com o framework web Wiz.