每日看点！Angular v16 正式发布

来源：OSCHINA 时间：2023-05-04 07:23:15

在之前的 Angular v15 中，Angular 团队通过将独立 API 从开发者预览版升级至稳定版，在 Angular 的简易性和开发者体验方面达到了一个重要的里程碑。如今，Angular 将继续这一改进的势头，发布了自 Angular 最初推出以来最大的一次版本更新；在 Reactivity、服务器端渲染和工具方面取得了巨大的飞跃。

重新思考 Reactivity

作为 v16 版本的一部分，Angular 带来了全新的 Reactivity 模型的开发者预览，它为性能和开发者体验带来了显著的改进。

完全向后兼容并可与当前系统互操作的，并且能够：

【资料图】

通过减少变化检测过程中的计算次数，提高运行时的性能。为 Reactivity 带来了更简单的 mental 模型，使其清楚地了解视图的依赖性和通过应用程序的数据流。启用细粒度的 Reactivity，在未来的版本中，它将允许我们只检查受影响组件的变化。在未来的版本中，通过使用 Signals 在模型发生变化时通知框架，使 Zone.js 成为可选的。提供计算属性，而不会在每个变化检测周期中重新计算实现了更好的与 RxJS 的互操作性

服务器端渲染和 hydration 增强

根据 Angular 的年度开发者调查，服务器端渲染是 Angular 的第一大改进方向。在过去的几个月里，Angular 与 Chrome Aurora 团队合作，改善了 hydration 和服务器端渲染的性能和 DX。今天，Angular 带来了完整应用非破坏性 hydration 的开发者预览。

在新的完整应用非破坏性 hydration 中，Angular 不再从头开始重新渲染应用。相反，该框架在构建内部数据结构时查找现有的 DOM 节点，并将事件监听器附加到这些节点上。

这样做的好处是：

对终端用户来说，页面上没有内容的闪烁在某些情况下有更好的 Web Core Vitals 面向未来的架构，可以用我们今年晚些时候推出的基元实现细粒度的代码加载。只需几行代码就能与现有的应用程序轻松集成对于执行手动 DOM 操作的组件，在模板中使用 ngSkipHydration属性逐步采用 hydration

新的服务器端渲染功能

作为 v16 版本的一部分，Angular 还更新了 Angular Universal 的 ng add schematics，它使你能够使用独立的 API 向项目添加服务器端渲染。还为内联样式引入了对更严格的内容安全策略的支持。

改进了独立组件、指令和管道的工具

Angular 是一个被数以百万计的开发者用于很多关键任务的应用程序的框架，我们认真对待重大变化。Angular 在几年前开始探索独立的 API，现在经过一年多的收集反馈和对 API 的迭代，Angular 想鼓励开发者更广泛地采用这些 API。

为了支持开发者将他们的应用程序过渡到独立的 API，Angular 开发了迁移示意图和独立迁移指南。一旦你在你的项目目录中运行：

ng generate @angular/core:standalone

该计划将转换你的代码，删除不必要的 NgModules类，并最终改变项目的引导结构以使用独立的 API。

独立的 ng new

作为 Angular v16 的一部分，你可以从一开始就以独立的方式创建新的项目。要尝试独立模式的开发者预览，请确保你在 Angular CLI v16 上并运行：

ng new --standalone

你会得到一个更简单的项目输出，没有任何NgModules。此外，项目中的所有生成器都会产生独立的指令、组件和管道。

更多详情可查看：https://github.com/angular/angular/releases/tag/16.0.0

关键词：