4

我越来越多地使用 JavaScript/jQuery 进行高级应用程序开发。我一直在尝试更多地了解 JavaScript 语言并深入研究一些更高级的功能。当我阅读这篇文章的这一部分时，我正在阅读一篇关于内存泄漏的文章。

JavaScript是一种垃圾收集语言，这意味着内存在对象创建时分配给对象，并在不再引用它们时由浏览器回收。虽然 JavaScript 的垃圾回收机制没有任何问题，但它与一些浏览器处理 DOM 对象的内存分配和回收的方式不一致。

这让我想起了我的一些编码习惯。一段时间以来，我一直非常专注于尽量减少发送到服务器的请求数量，我觉得这只是一个好习惯。但我想知道有时我是否不会走得太远。我非常不知道JavaScript 语言附带的任何类型的效率问题/瓶颈。

例子

我最近为一家拖车公司构建了一个扣押管理应用程序。我使用了 jQuery UI 对话框小部件，并使用特定的工单数据填充了一个数据网格。现在，这在表面上听起来很简单......但是他们在这里传递了很多数据。

（现在是问题......请打鼓......）

我想知道以下每个选项的优缺点是什么。

1)对给定票证只发出一次请求，并将其永久存储在DOM. 简单地显示/隐藏模式窗口，这意味着每张票只发送一个请求。

2)每次工单打开时发出请求，并在关闭时将其销毁。

我的自然倾向是将门票存储在DOM- 但我担心如果应用程序运行很长时间而不被重置（它将是），这最终会开始占用大量内存。

我真的只是在寻找这两个选项的优点/缺点（或者我什至没有听说过=P的简洁的东西）。

4

4 回答 4

4

此处的解决方案取决于您的问题的具体情况，因为“正确”答案将根据页面打开的时间长度、DOM 元素的大小和请求延迟而有所不同。这里还有一些需要考虑的事情：

  • 仅保留缓存中最新的n项。如果您只可能在短时间内重新显示项目，这很有效。
  • 存储每个元素的数据而不是 DOM 元素，并在每个显示器上重建 DOM。
  • 使用 HTML5 存储来存储数据，而不是 DOM 或变量存储。这具有额外的优势，即可以跨页面请求存储数据。

任何缓存策略都需要考虑何时使缓存无效并重新请求更新的数据。根据您的策略，您将需要处理由多个编辑器导致的冲突。

最好的方法是使用最简单的方法开始，并仅在必要时增加复杂性以提高速度。

于 2010-12-01T22:38:40.180 回答
2

第三条路径是在 JS 中存储与工单相关的数据，并在调用/关闭模式窗口时创建和销毁 DOM 节点（jQuery 模板在这里可能是一个自然的解决方案。）

也就是说，避免网络流量的主要原因似乎是用户体验（网络总是比 RAM 慢）。但是，如果用户直觉涉及加载数据，那么每次都发出请求实际上可能不会降低这种体验。

于 2010-12-01T22:37:22.777 回答
0

我会说2号最好。因为这样如果在您打开票证后发生更改，该更改将在第二次打开票证时出现。

于 2010-12-01T22:36:44.743 回答
0

为 DOM 操作触发的重绘/重排次数的一个重要因素。建立内容更改并一次性插入它们比增量执行要高效得多，因为每个增量都会导致重绘/重排。

请参阅：http ://www.youtube.com/watch?v=AKZ2fj8155I以更好地理解这一点。

于 2010-12-01T22:40:22.653 回答