2012-10-08 51 views
1

我已经阅读了一些关于浏览器中画布缓慢的文本API的文章。这些文章已经有一年了,在这个时期有一些改进吗?例如Google是否在其Google Maps MapsGL中使用画布文字API?HTML5 canvas中的文本API仍然如此缓慢?

+1

你为什么不测试它们? – BoltClock

回答

3

我评测的这款上my site最近使用fillText方法()和strokeText():

fillText方法()

  1. 157.1ms的Safari 5.1.7
  2. 215.8ms的Chrome V21
  3. 210.6ms Chrome v22
  4. 426.1ms IE 9(64bit)
  5. 994.5ms FireFox 15.0.1 994.

strokeText()

  1. 196.6ms铬V21
  2. 193.0ms铬V22
  3. 3793.1ms IE 9(64位)
  4. 6149.0ms火狐15.0.1
  5. 9628.8ms Safari浏览器5.1.7

是的,我觉得慢,但真的浏览器依赖NT。在那里测试测试代码,你可以自己运行它,但实际上,FF可能会超时等待测试完成。

1

看着谷歌地图GL,人们可以看到它使用了一个名为https://maps.gstatic.com/cat_js/intl/en_ALL/mapfiles/435c/maps2/%7Bmain,mod_util,mod_vt%7D.js

在该文件中,确有调用fillText方法(),有在文件中“fillText方法”的第6个实例。

+3

谢谢,我也复制了测试:http://simonsarris.com/blog/322-canvas-drawtext-considered-有害,它看起来,至少Chrome现在更好的字体缓存。 – Ondra

+1

我的测试在这里:http://jsfiddle.net/cVBuB/ – Ondra

+1

好文章,书签 - 谢谢你!用于地图的js代码比我刚才研究的倾向(或脑力)要大。如果他们使用这个技巧,我不会感到惊讶。我没想过检查代码创建画布的次数。虽然简单的像素_应该总是比绘制文本更快 - 除非有硬件文本功能。我已经看到了关于将图像从1个画布复制到另一个的类似建议,而不是将一个画到画布上。代表链接的Rep ++。 – enhzflep