画布在 Angular 服务调用中冻结一秒

Canvas freeze by second on Angular Service call

本文关键字:一秒 冻结 Angular 服务 调用      更新时间:2023-09-26

我们有一个带有加载器动画的画布,我们在每个服务的每个响应中切换它的可见性。

当角度准备好填充范围时,有时画布会冻结几秒钟,停止动画并且范围正常进行。

Canvas 在指令上,我们每次都会更新它:

var exportRoot = new lib.htmlloader();
var stage = new createjs.Stage(canvas);
stage.addChild(exportRoot);
stage.update();

假设 1:加载器在结果ui-view="content"内,然后是错误。

假设2:Chrome不能很好地处理响应,然后崩溃几秒钟

假设 3:更新指令画布有时会失败

我们知道最好为所有页面加载一次,但我们有不同的情况,例如模态、小网格而不是全局加载等。

通过使用 css 动画代替 js/gif 来解决。受 AngularJS 的启发:显示慢脚本的加载动画,例如在过滤时引用:"首先,您应该使用 CSS 动画。不应在繁重的进程中使用 JS 驱动的动画和 GIF。的单线程限制。动画将冻结。CSS 动画与 UI 线程分离,IE 10+ 和所有主流浏览器都支持它们。编写一个指令,并以固定的定位将其放置在ng视图之外。使用一些特殊标志将其绑定到应用控制器。在长时间/繁重的流程之前和之后切换此指令的可见性。(您甚至可以将文本消息绑定到指令以向用户显示一些有用的信息)。- 直接在繁重的循环中与此或其他任何东西进行交互将需要更长的时间才能完成。这对用户不利!

但我不需要退出 UI 视图。PS:在 https://connoratherton.com/loaders 中找到了不错的装载机