在手机上使用主干的大性能问题/崩溃

Question

我们已经建立了我们的服务dailymus.es，以便移动友好，但我们在移动电话上访问时遇到了一系列性能问题。

具体来说，它在几个“页面”之后崩溃，当我们在页面上有很多内容时。

我怀疑我们有太多的事件处理程序和/或内存泄漏。您使用什么方法来消除Backbone的这些问题？

Answer 1

我建议您使用 Google Chrome开发者控制台测试您的网站。使用配置文件选项卡检查堆的状态。

主干模型/视图的大多数泄漏是由于没有从视图中分离DOM事件和从模型中分离（on）事件。

确保覆盖骨干视图的删除方法，并确保将.off（）设置为.on（）。不要忘记在子视图上调用remove。

查找泄漏：

1. 拍摄快照
2. 运行代码以创建视图，然后将其删除
3. 拍摄另一张快照
4. 比较快照以查找未创建的新对象。

More about the Google Chrome Heap Profiler

Answer 2

Backbone浪费了大量内存，这对移动设备来说是最难的事情。在DOM元素上有很多用于对象池的技术，更新元素而不是重新创建模板，限制加载图像直到最后一分钟，在绘制周期之前保持任何更新。

如果正确管理内存，移动网络可以表现出色。 PrefView就是一个很好的例子，可以在iPad mini的长滚动列表中获得50FPS。 https://github.com/puppybits/BackboneJS-PerfView