具有大量组件的动画效果

时间:2018-01-10 00:37:42

标签: angular performance components

让我们先从好消息开始:我的代码有效。 现在是坏消息:性能确实是一个问题。

简而言之,我有一个申请表:

  1. 包含切换按钮的一个组件
  2. 400个独立组件。
  3. 当有人点击切换按钮时,我会使用animate模块更改400个组件中每个组件的颜色。

    在架构方面我有:

    • 按钮附带的观察
    • 每个400个组件订阅了observable。
    • 400个组件不是我的按钮组件的子组件,因此我使用共享服务来交换信息。

    有了这个,我在点击和颜色变化之间经历了2秒的延迟。

    从我在日志中看到的内容中,大部分时间似乎都花费在我的每个组件上,用于监听click事件。一旦 ALL 400个组件接收到点击事件,动画本身几乎立即发生。

    所以,在我开始撕掉我的代码以实现不同之前:我是否正在做些什么?或者我刚刚达到了这个架构选择框架的极限?

0 个答案:

没有答案