angular - 中途停止加载组件
问题描述
我使用 Angular 7 构建了一个应用程序,它在浏览器上非常安静,并且有很多沉重的组件。每当我从一个半加载的组件导航到另一个组件时,它都需要一些时间。我的问题:我可以以某种方式停止当前加载组件的初始化并开始下一个组件的初始化吗?
我知道,延迟加载和预加载可能是解决我的问题的可能方法之一,但它不是那么有效。
解决方案
对于异步操作,我会确保使用 Observables 并取消订阅它们以中断它们的工作。见https://angular.io/guide/comparing-observables#cancellation
对于数据处理,我建议您查看工作线程(或网络工作人员)。这是一个 JavaScript 特性,这里有很多文章和问题已经涵盖了 web worker 并将它们与 Angular 集成。由于网络工作者在不同的线程中运行,主线程(运行 Angular 的线程)可以取消提交给网络工作者的任务。
编辑:对于画布,还有一个实验性 API,OffscreenCanvas
它允许您在 Web Worker 中执行绘图操作。请参阅https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas
但是,如果您选择不使用 web worker 或OffscreenCanvas
,我认为您所能做的就是优化您使用画布的方式。如果你巧妙地利用 ,window.requestAnimationFrame()
每帧执行小批量的操作,我认为你可以构建一个对主线程影响较小的绘图过程,并且可以被中断。
https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas
推荐阅读
- laravel - Laravel 单元测试非法偏移类型
- html - 使用 CSS,有没有办法当我将鼠标悬停在一个组件上时,另一个组件变得可见?
- c# - 添加为邮件附件时文件似乎已损坏
- git - 一个用于 Android+web 服务的 git repo
- node.js - 为 FireFox 设置安全 cookie 失败,但适用于 Chrome。如何为 FireFox 设置安全 cookie?
- active-directory - 具有本地 AD Windows 身份验证和远程 3rd 方 WebApi 的 WPF 架构?
- c# - 如何在 HTML 标题标签中从右到左排列由英语和波斯语单词组合而成的文本
- php - 在调用结束时从星号(freepbx)获取信息,并将其传递给 php 文件
- html - 网页设计问题:表格列的宽度相同
- python - Pandas - 如果列值在列表(.csv)中,则从数据框中删除行