Angular一次性Observable性能优化：是否值得改用单次读取？

先给结论 #

绝大多数日常场景里，这两种实现的性能差异微乎其微，优先选async pipe的经典写法，除非你真的碰到了订阅带来的实际性能问题。

为什么优先用async pipe？ #

• 省事儿，少踩坑：async pipe会自动在组件销毁时取消订阅，完全不用你手动维护subscriptions集合，也不会因为忘了取消订阅导致内存泄漏。代码量少，逻辑清晰，符合Angular响应式的设计思路。
• 订阅本身没什么开销：你担心的“持续监听”其实是多虑了——对于BehaviorSubject来说，订阅只是把组件的观察者加入列表，只要Store里的menuItems不再发新值，这个订阅就处于闲置状态，不会占用额外的CPU或内存资源。
• 留有余地：就算现在确定菜单数据不会变，万一以后需求改了（比如加个切换主题菜单的功能），用async pipe的代码不用动就能直接支持新的数据流，而单次订阅的写法得重构。

什么时候值得用单次订阅？ #

只有同时满足以下情况，才考虑用first操作符的写法：

1. 你能实打实测出这个持续订阅确实造成了性能问题（比如组件频繁创建销毁，每次都重复订阅，或者数据流本身有高频无意义的发射）；
2. 业务逻辑板上钉钉，数据永远不会更新，未来也绝对不会有变更；
3. 你愿意承担额外的代码维护成本（手动处理订阅销毁、空值情况等）。

简化单次订阅的写法 #

如果真要做单次读取，别用手动add订阅的方式，试试firstValueFrom结合async/await，代码更简洁：

async ngOnInit() {
  this.menuItems = await firstValueFrom(
    this.myFacade.menuItems$.pipe(filter(items => items.length > 0))
  );
}

这种方式不需要手动管理订阅，firstValueFrom会自动完成订阅并取消，比你原来的写法清爽多了。

内容的提问来源于stack exchange，提问作者Thomas Perrin