Question

我正在为一些朋友建立一个益智游戏网站，有时候益智生成算法可能需要花费相当长的时间才能完成（对于更复杂的益智游戏则需要4-5秒）。

我构建了一个用于在应用程序当前不接受用户输入时显示加载动画的服务，它可以很好地用于异步api调用。

其中“完美”的示例：

this.loader.startLoadingAnimation(); // Indicate we are waiting
this.tunnel.startPuzzleTimer(GameID, Difficulty)
  .subscribe( (response) => {
    // Do something with response - removed for brevity
    this.loader.stopLoadingAnimation(); // Indicate we are done waiting
  });

它的工作原理完全符合您的预期，动画以极高的帧速率播放，并在内容准备好后消失。但是，当我尝试像这样使用它时会遇到问题：

this.loader.startLoadingAnimation(); // Indicate we are waiting
this.puzzleService.generatePuzzle(GameID, Difficulty); // Generate board, CPU intensive!!
this.loader.stopLoadingAnimation(); // Indicate we are done waiting

这一次出现加载动画，但它以每秒约2帧的速度运行。显然，这是由昂贵的操作generatePuzzle()引起的，但是我想知道是否存在某种方法可以利用更少的CPU并更慢地生成拼图，并优先显示完美平滑的加载动画。

谢谢您的帮助。

等待前端完成复杂的计算时加载动画滞后

0 个答案: