大型SVG渲染期间的DOM操作

Ale*_*der 5 javascript html5 svg dom raphael

好的,所以我试图通过设置百分比指标的"正在加载..."消息来完成我的项目.很容易.问题是我有超过6,000 Raphael/SVG行代码注入2000多个新节点DOM.因此,当我尝试在加载消息时更改我的%指示符时,真正的问题出现了,但浏览器只是冻结,直到Raphael完成创建所有节点.

我尝试过的和我所知道的:

1)我有非常简单的函数来计算加载百分比,通过增加countvar并在我的6000个代码中传播这个函数.这样我模拟了实际的加载过程.没什么新鲜的.

2)我知道这个函数可以起到魔力的作用,通过加载过程,我实际上从零到100%-hero.

3)在这个函数中,每次我获得新值 - 我都试图在屏幕上更新% - 但是当我立即获得100%时,直到满页加载都没有任何反应.

4)我可以让我的指标更新的唯一方法是alert()每次我尝试更新它时设置.当警报弹出窗口进入屏幕时,这就是改变我的指示器的魔法灰尘.

5)我已经尝试过setTimeout很多其他的东西,比如切换visibility,更改position,创建子节点,运行虚拟循环等......在SVG渲染过程中没有任何帮助...... 一切都只是零度冻结.

6)唯一不会卡在屏幕上的是我的小CSS动画(带有暗区的旋转圆圈)(好吧,除了FF - 甚至没有CSS动画).

7)我从其他来源了解到我无法模仿alert()我自己的行为,所以这里没有运气.

8)我试过deferasync,但我没有装载问题,我有渲染/ DOM注入的问题...

我想这就是我想在完美条件下得到的东西:

1)我想知道 - 如何确定每个svg节点注入/操作?

2)那么,如何停止整个渲染/注入过程并自己做一些事情直到callback

3)然后,如何恢复?)))

4)或者也许有一些我错过的东西......