Canvas 在 Angular 服务调用时每秒冻结

Question

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

当 angular 准备填充作用域时，有时 canvas 冻结几秒钟停止动画，作用域正常运行。

Canvas在一个指令上，我们每次更新它：

var exportRoot = new lib.htmlloader();

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

假设 1：加载程序在 ui-view="content" 结果中，然后是错误。

假设 2：Chrome 没有很好地处理响应然后崩溃几秒钟

假设 3：更新 canvas 指令有时会失败

我们知道对所有页面进行一次加载会更好，但我们有不同的情况，例如在模态上加载、在小网格上加载而不是全局加载等。

Answer 1

使用css动画代替js/gif解决。受 AngularJS 启发：显示慢速脚本的加载动画，例如过滤报价时："First, you should use CSS animations. No JS driven animations and GIFs should be used within heavy processes bec. of the single thread limit. The animation will freeze. CSS animations are separated from the UI thread and they are supported on IE 10+ and all major browsers. Write a directive and place it outside of your ng-view with fixed positioning. Bind it to your app controller with some special flag. Toggle this directive's visibility before and after long/heavy processes. (You can even bind a text message to the directive to display some useful info to the user). -- Interacting with this or anything else directly within a loop of heavy process will take way longer time to finish. That's bad for the user!"

但我不需要退出 ui 视图。 PS：在 https://connoratherton.com/loaders

中找到了不错的装载机

Canvas 在 Angular 服务调用时每秒冻结

Canvas freeze by second on Angular Service call

javascript

css

canvas

angularjs

createjs