Internet explorer 8 RaphaelJS在IE8中编辑元素的attr（）和text（）（填充、笔划、权重）时速度大大减慢

我正在用RaphaelJS调试IE8中的一些性能问题。我们正在从raphael中的1000个元素和文本节点构建图形，尤其是一个图形在渲染时给我们带来了问题。在IE9中，根据机器的不同，渲染需要2-7秒，在IE8中需要1分钟以上

你可以看到。这是第三个图形（单击它）

本质上，我们为每个数据点创建元素，并在raphael画布上绘制它们

我使用了IE Developer Tools profiler，确定当我们更改元素的填充、笔划、样式和一些其他设置时，它是从

attr（）

和

text（）

调用的

setFillAndStroke（）

函数。函数是

setFillAndStroke（）

中的罪魁祸首

这是一个

在我的研究中，我遇到过一些人在IE8、

attr（）

和

text（）

方面有问题，例如

所以有几个问题：

能否为Raphael元素设置“默认”填充和笔划，以便使用该填充和笔划创建它们？这将删除对

getClientBoundingRect（）

的调用。我试着在文档中寻找这样的函数，但没有成功

在不改变图形的外观和感觉的情况下，这是我们可以解决的问题吗

如果这是我们可以通过代码实现的，那么在不修改RaphaelJS的情况下可以实现吗

还有其他想法吗

在拉斐尔的旧版本中，似乎有人有类似的问题，显然在2.0.0中已修复，但我们使用的是2.0.2版本（经测试，在2.1.0中也存在相同的问题）

---

这是问题所在。

多亏了Eliran Malka的建议，我开始从使用

attr（）

改为添加类和使用CSS，当时我发现我们有一个bug，导致总共绘制了178个标签，而不是8个（每22个间隔1个），除了主要的8个标签外，其余都超出了“纸张”的尺寸

我怀疑当元素离开屏幕时，

getBoundingRect（）

可能会阻塞，我找到了bug的来源并修复了它，只画了预期的8个，所有的都在画布上。这将加载时间从1分多减少到8.8秒

因此，急剧减速的原因是使用

text（）

在屏幕外创建元素，然后通过

attr（）

更改它们的属性

---

虽然8.8秒仍然不太好，但它大约比1分多一点（准确地说是72秒）好一个数量级，所以我将称之为“已回答”，而我们将解决其余问题。

为什么不使用CSS以通用方式设计这些问题？可以为图形元素节点创建默认样式，并为每个用户代理创建条件样式表。我知道这不是最好的，但这只是一个开始。顺便提一下，这个问题很好。这表明我们付出了很大的努力。是的，这是我们一直在考虑的事情。在我把这篇文章发到这里之后，我们决定先等等看是否有任何关于低垂果实的反馈。看来这是最好的办法了，谢谢。也谢谢你的夸奖：）如果我们最终这么做了，我会尽量记住把它作为我们的解决方案，或者至少是我们尝试的结果。