Angular中使用带过滤器的fromEvent时，包裹ngZone.runOutsideAngular()是否有实际收益？

这是个戳中性能优化细节的好问题！咱们来一步步拆解这里的门道：

首先得明确ngZone.runOutsideAngular()的核心作用：把代码拉出Angular的变更检测上下文，让Angular的Zone不会监听这段代码里的异步操作，避免无意义的变更检测触发。

回到你的代码场景：你用fromEvent监听了document上的mousedown事件，而且是捕获模式。这里的关键是——不管你的filter会不会把事件过滤掉，每次用户点击页面，这个RxJS的回调链（包括两个filter操作符的执行）都会跑一遍。

如果不包裹ngZone.runOutsideAngular()，这个事件回调是运行在Angular Zone内部的。这意味着什么？每次鼠标点击（哪怕点击的是指令内部的元素，或者clickOutsideEnabled是false），Angular的Zone都会感知到这个原生DOM事件的触发，会触发一轮变更检测的检查——这完全是无意义的性能浪费！尤其是当页面上有大量组件时，频繁的鼠标点击会导致Angular反复做不必要的变更检测，拖慢应用响应速度。

而你现在用ngZone.runOutsideAngular()把fromEvent的注册包起来之后，所有这些“被过滤掉的事件回调”都会在Angular Zone之外运行，Angular根本不会感知到这些异步操作，自然也就不会触发无意义的变更检测。只有当事件通过了所有filter，进入到subscribe回调里，你再用_ngZone.run()把emit操作拉回Angular Zone，触发必要的变更检测——这完全是精准的性能优化。

可能你会觉得“我已经用filter把大部分情况拦住了，应该没什么影响吧？”但实际场景中，用户的鼠标点击频率是很高的，哪怕每次无意义的变更检测只消耗一点点性能，积少成多也会影响应用的流畅度，尤其是在低性能设备上会更明显。

所以结论是：这个ngZone.runOutsideAngular()的包裹不仅有用，而且是很有必要的性能优化手段，它帮你避免了大量不必要的变更检测开销。

内容来源于stack exchange