RxJS中如何避免BehaviorSubject管道的昂贵计算重复执行？

这个问题在RxJS开发里太常见了——默认情况下，Observable是「冷」的，每次订阅都会从头跑一遍管道里的所有逻辑，包括你的expensiveComputation，所以多订阅几次就会重复执行好几次昂贵计算，完全没必要。

要解决这个问题，核心是把这个Observable改成多播的，让所有订阅者共享同一份计算结果。下面给你几个最常用的方案：

方案1：用shareReplay操作符（最推荐） #

这是RxJS里处理这类场景的标准解法，它会缓存指定数量的最新结果，新订阅直接拿缓存值，只有当源BehaviorSubject发出新值时，才会重新执行一次expensiveComputation，然后把结果同步给所有订阅者。

代码示例：

const obs$ = sameBehaviorSubject.pipe(
  map(expensiveComputation),
  shareReplay(1) // 缓存最近1个计算结果
);

• 参数1表示只缓存最新的1个值，足够满足大部分场景；
• RxJS 7+版本里shareReplay默认会自动管理源的订阅（refCount: true）：当第一个订阅者出现时订阅源，最后一个订阅者取消时自动取消源的订阅，避免不必要的资源占用；
• 如果希望即使没有订阅者，也保持源的订阅（比如需要实时更新最新计算结果），可以用配置项：

  shareReplay({ bufferSize: 1, refCount: false })
  

方案2：用publishReplay + refCount() #

其实shareReplay就是publishReplay + refCount()的语法糖，如果你需要更精细的控制，可以手动组合这两个操作符：

const obs$ = sameBehaviorSubject.pipe(
  map(expensiveComputation),
  publishReplay(1), // 用ReplaySubject缓存1个值
  refCount() // 自动管理订阅计数
);

这个方案和shareReplay(1)效果几乎一致，不过在一些旧版本RxJS里，shareReplay的默认行为可能不同，这时候手动组合会更稳妥。

方案3：手动用multicast + ReplaySubject #

如果你需要完全手动控制多播的生命周期（比如长时间运行的服务类场景），可以用multicast操作符搭配ReplaySubject，然后手动调用connect()启动订阅：

import { ReplaySubject } from 'rxjs';
import { multicast } from 'rxjs/operators';

const replaySubject = new ReplaySubject(1);
const obs$ = sameBehaviorSubject.pipe(
  map(expensiveComputation),
  multicast(replaySubject)
);

// 手动启动源的订阅
obs$.connect();

// 当不需要时，手动取消订阅
// obs$.unsubscribe();

这种方法适合需要长期保持计算的场景，但要记得手动管理connect和disconnect，避免内存泄漏。

内容的提问来源于stack exchange，提问作者Eric Simonton