javascript - ember.js 备份/缓存 DOM 元素

Question

我在平板电脑上有一个应用程序，它使用 Ember 在 2 个不同的选项卡上渲染 D3 图表，当用户导航到每个选项卡时，Ember 会清除 DOM 并重新渲染新的 DOM。这会导致性能下降 - 特别是因为 D3 重新绘制了整个图表。

如何在 Ember 中备份/缓存 DOM？备份的 DOM 可以在 didInsertElement 调用时重新呈现。

Answer 1

我假设您有一个 socket ，可以根据哪个选项卡处于事件状态来更改其呈现的内容。如果您不希望每次更改选项卡时都重新创建 DOM，则不能使用 socket 。同样，您不能使用#if-else Handlebars block 。

只需在页面中同时拥有两个图表的 DOM，并使用 CSS 隐藏和显示事件图表即可。您可以等到单击第二个选项卡来呈现第二个图表，这样您就不必预先完成所有操作。