很多HTML画布或一个大画布？

Question

我正在计划一个界面来显示许多小窗口小部件（在<canvas>上绘制），这些窗口小部件可能会移动（例如，在使用jQuery以不同方式排序的列表中）。小部件的数量可以在10到100之间。

我可以用一个大画布做到这一点，只需在正确的位置绘制许多小部件。或者我可以在<canvas>中拥有大量<li>个ses。帆布的重量是否足以满足这类需求？是否有令人信服的表现理由选择其中一个？

Answer 1

我必须在3年前做类似事情来代表BPM。我用<canvas>实现了它（我在canvas和VML之上构建了一个lib - 用于IE - ），我选择了你提出的第二个选项。

画布的问题在于，如果你有很多交互（点击一个特定的元素，移动它等），那么每次你必须重新绘制所有东西（对于一个充满元素的大画布，这不是性能方面最好的）。我更喜欢代表X占位符（每个占位符都是包含画布的div），我注意到性能更好，显然DOM事件（附加到canvas'容器）更容易管理。

实现这种交互式内容的另一种方法是使用SVG（现在，我更喜欢这个），例如通过raphaelJS。对于没有交互的动画和2d表示，我使用<canvas>。

Answer 2

我听说高度大于600px的画布表现为WAAAAAYYYYYY。所以你可能想要解决这个问题。现在寻找参考......