javascript - 如何优化 Ember JS 中组件的渲染

标签 javascript ember.js ember-data ember.js-view

在包装器组件中渲染了大约 300 个组件,并且需要花费大量时间来渲染。但我需要数千个组件才能在包装器容器内呈现。在渲染组件时如何在没有任何性能问题的情况下实现这一目标 Image shows the rendering time taken by 300 components which is too much

最佳答案

如果你有一个卷轴并且你的所有组件都不在 viewport 中同时,您可以使用Proxy Pattern .

有一个名为 ember-in-viewport 的 ember 插件检测您的组件是否在视口(viewport)中。通过使用它,您可以实现代理模式。

这是一个sample twiddle .在 application.hbs 中,如果使用 my-proxy-component 而不是 my-component,页面渲染速度将快近 3 倍。

关于javascript - 如何优化 Ember JS 中组件的渲染,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41673206/

相关文章:

ember.js - 如何在 emberjs 组件中获取 url 参数

ember-data - 如何使用 store.filter/store.find 和 Ember-Data 实现无限滚动?

ember.js - 使用 ember.js 无限滚动(延迟加载)

javascript - 如何从剑道网格中删除一行

javascript - 使用 TABS 时 DataTable.js 无法正确加载

javascript - jquery中从json数组中分割json数据

jquery - ember,使用 jquery 更新表单值

javascript - 创建涉及预定结构的新标签

javascript - 页面转换后调用 jquery 事件

javascript - 在 Ember.js 中加载关联模型