jquery - 移动和隐藏/显示谷歌地图 div 的成本

Question

我的应用程序是一个单页应用程序 (backbone.js)，它使用存储在#map_canvasdiv 中的谷歌地图。

该应用程序有 3 个主要视图：

• 谷歌地图视图。
• 没有地图的视图。（即#map_canvas隐藏）
• 在细分中包含地图的视图。（我将 div 附加#map_canvas到另一个 div）

所以基本上我有 3 个主要的 dom 操作：

1. 隐藏地图
2. 显示地图
3. 将地图附加到另一个 div

我的问题是，这些操作的成本是多少？

Answer 1

它们有多贵？几乎可以忽略不计。我认为您并不关心隐藏和显示，因为它非常简单，并且执行时间几乎为 0。但我认为您担心将 DOM 中的 div 重新定位以将其附加到另一个 div。这也不应该花费时间，因为 Maps API 已经加载，因此移动它不会干扰 Maps API。

如果您使用 jQuery，那么只需继续执行它，您不必担心，因为 jQuery 使用最快的方法

如果您想附加另一个 div 用于设计目的，我建议您编写另一个 css 并加载它而不是附加 div，这将立即（当 css 加载时）改变您想要的 div 的设计。

Answer 2

在金钱方面：免费。

在执行时间方面：可以忽略不计

在实现时间方面：非常小（使用jQuery之类的东西进行跨浏览器 dom 操作）

Answer 3

如果您不关心旧浏览器的兼容性，请使用 zeptojs 而不是 jQuery……可能会增加一点性能改进……但老实说，这没什么大不了的。