SVG中的Web应用程序，性能问题和可行性

Question

我们是一家新的创业公司，将为时尚行业开发一个网络应用程序。我们正在考虑使用canvas（不关心IE支持）但现在在阅读了Raphaeljs和jQuerySVG之后，我们对构建整个界面的可能性很感兴趣。 SVG中的单位。

以下是我的想法：

• 独立决议
• 缩放项目并保持形状和外观的能力
• 即将推出的浏览器优化
• 我们不必在画布上绘制所有内容，我们可以利用坐标绘制单位（项目）
• 无需学习XML;易于学习和使用？
• SVG相当宽广，所以应该可以轻松处理各种设计形状
• 像canvas一样，我们可以使用HTML5＆amp; CSS3功能与SVG（拖放，高级CSS3效果），甚至jquery效果
一起使用
• 因为我们不会使用任何复杂的3D渲染，所以假设全屏矢量不应该有太大的性能影响？

希望根据过去使用SVG用于整个Web应用程序渲染的可行性的经验来听取您的意见。

我们已经研究了近两周的画布并且确信我们可以从中获得所有需求但是如果SVG可以做同样的事情，它会很棒并且实际上是首选的（？）。

干杯

Answer 1

一些未经思考的食物：

Canvas只是一个位图。渲染大量对象时速度更快。另一方面，SVG必须保持对它呈现的每个对象的引用，并且在大量对象的情况下显着减慢。

...但是这些参考意味着处理你绘制的东西的一些步法是为你完成的。当渲染非常大的对象时，SVG会更快。

但是，SVG的采用率却低于Canvas。但是浏览器现在都有，所以我认为我没有太多担心。

Canvas游戏可能会更快。在SVG中，一个巨大的地图程序可能会更快。

Canvas的一些浏览器优化就在这里。上周是Chrome的7.0硬件加速首发。 IE9预览和Opera也有硬件加速（不记得FF）。

Canvas仍然是一个非常活跃的规格（MeasureText返回一个宽度，但没有高度！），但我喜欢到目前为止使用它。

Answer 2

我将SVG用于简单的徽标和图标，唯一的问题是关于背景呈现为白色而不是像其他浏览器那样透明的webkit错误。在一台慢速的机器上，我注意到七个物体一个接一个地闪烁，第一次渲染但我不知道我做错了什么。