阻止组件中途加载

Question

我已经使用angular 7构建了一个应用程序，该应用程序在浏览器上非常安静，并且包含许多繁重的组件。每当从半加载的组件导航到另一个组件时，都会花费一些时间。我的问题：我可以以某种方式停止当前正在加载的组件的初始化并开始下一个组件的初始化吗？

我知道，延迟加载和预加载可能是解决我的问题的一种方法，但是效果不是很好。

Answer 1

对于异步操作，我将确保使用Observables并取消订阅它们以中断其工作。 参见https://angular.io/guide/comparing-observables#cancellation

对于数据处理，建议您研究辅助线程（或Web辅助线程）。这是一个JavaScript功能，这里已经有很多文章和问题涉及Web worker，并将其与Angular集成。 由于网络工作者在单独的线程中运行，因此主线程（一个运行Angular的线程）可以取消提交给网络工作者的任务。

编辑：对于画布，还有一个实验性API OffscreenCanvas，可让您在Web Worker中执行绘制操作。 参见https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas

但是，如果您选择不使用网络工作者或OffscreenCanvas，我想您所能做的就是优化使用画布的方式。如果您巧妙地使用window.requestAnimationFrame()，每帧执行少量的操作，我认为您可以构建一个对主线程影响较小并可能被中断的绘制过程。

https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas