HTML 5页面上的多个画布元素

时间:2012-10-05 08:35:50

标签: jquery html5 jquery-plugins html5-canvas

我可以在HTML 5页面上放置多个画布,每个画布上都有一个图像。我基本上需要在我的应用程序的所有图像上使用JS manipulation Plugin,这个插件需要图像在画布上。

在其中包含多个画布和图像会影响或降低页面的性能吗?

2 个答案:

答案 0 :(得分:3)

是的,您可以拥有多个canvas-elements。页面的性能不会受到多个画布的影响。影响你表现的是重画画布。至于图像,决定性能的是必须重绘多少。

您可以在以下网址了解详情:HTML5 multiple canvas on a single page

答案 1 :(得分:1)

Canvas元素在重绘时非常快。它比SVG快得多,这使得它非常有效地用作Web开发的绘图工具。

您可以根据需要使用尽可能多的画布,但不应对页面效果产生负面影响。

此外,canvas元素在整个页面中加载,但是在页面完全加载后, 中加载图像并绘制到画布 中的代码执行唯一可以降低页面性能的因素是你在不同的画布元素中所做的事情,而不是你在页面中使用的那些元素的数量。此外,如果您在加载页面后开始绘图,无论您在画布元素上执行什么操作,因为在开始绘制时页面将完全加载。

请记住,javascript用于绘制到画布上。如果您使用繁重的流程来制作图纸,您会发现一个画布绘制会阻挡另一个画布,直到它完成为止。尝试以较少阻塞的方式构建绘图代码,以避免这种情况。