最新消息:关注人工智能 AI赋能新媒体运营

Angular 夏季更新,Zoneless 变更检测与原生动画 API 正式登场

科技智能 admin 浏览 评论

Angular 连续发布了 20.1 与 20.2 版本,重点包括 Zoneless 变更检测正式推出并可用于生产环境,以及新增基于原生 CSS 的进场与退场动画 API。这些更新的目标是提升性能、降低维护成本,并减少对框架额外机制的依赖,转而采用浏览器原生功能。

Zoneless 的推出使开发者不再必须依赖 zones 来驱动变更检测。过去这种机制虽然方便,但在大型项目中容易导致调试困难和打包文件过大。现在开发者只需在启动应用时调用相应方法,即可采用新的运行模式。已有使用 zone.js 的代码仍受支持,开发者可以分阶段进行迁移。这一改动有助于让状态更新的来源更加透明,也能提升应用的可预测性。

在动画方面,新增了 animate.enter 与 animate.leave 两个 API,允许直接在模板中指定元素进入或离开时应应用的 CSS 类,例如常见的淡入或滑入效果。现在无需依赖额外库即可实现这些效果。过去的 @angular/animations 包已进入弃用阶段,未来将逐步由 CSS 和新 API 取代。官方同时强调,这些 API 可与 GSAP、anime.js 等库共用,提供更高灵活性。

在开发工具方面,Angular DevTools 新增了路由树可视化与 Signal 依赖图(Signal Graph)功能。前者可图形化展示应用的路由结构,后者则有助于追踪信号之间的数据流,使复杂应用的状态分析更加直观。此外,测试流程也进一步简化,创建测试组件时,开发者现在可直接将输入值作为参数传入,无需再额外创建包装组件(Wrapper component)进行测试。

此外,官方的组件测试工具也同步强化,提供更精确的检索能力。开发者可以通过指定索引位置、统计组件数量,或依据浮动标签文字进行筛选,来定位特定的组件实例。

除了框架核心的更新,Angular 团队也在持续推进人工智能整合,官方在 angular.dev/ai 提供教学与示例,涵盖 Genkit、Firebase AI Logic 与 Gemini API 等技术,并提供 IDE 规则文件以提升大型语言模型生成代码的质量。同时支持在 Gemini Canvas 与 Google AI Studio 中生成 Angular 项目。

发表我的评论
取消评论

表情

您的回复是我们的动力!

  • 昵称 (必填)
  • 验证码 点击我更换图片

网友最新评论