The issues on load I believe we are having have to do with "shields".
Shields are transparent 1x1 gif images we inject into the DOM to simulate selecting over objects which are made up of complex HTML structures. They originally also protected the HTML structure from being clicked on directly (hence the name "shield"). More recently other techniques such as "phantoms", "highlights" and "relocatable markers" have taken over the click blocking functionality. This technique was invented by Inez/Christian of Wikia, and is regarded as creative and effective but inefficient.
Without doing much profiling, here is my best guess about what is going on.
First we traverse DOM structures, looking for elements which might be able to display outside their parent's bounding box, such as position: absolute, or floats. This can be quite expensive because we have to do a lot of CSS computed style checks and measurements, and the code isn't fully optimized to use direct DOM methods so there's a little jQuery overhead. Second we then insert the transparent images into the DOM structures, and there could be hundreds of these pretty easily.
Trying to solve this problem we can optimize the first step a bit. However, the traversal and measurement stuff will hit a limit pretty quickly. The technique we use to fake the selection may have alternative solutions, but I'm not sure about their performance impacts, especially on mobile devices.
Overall, the shield/phantom/highlight/marker systems need to converge into a simpler and more performant solution, and I have a few general ideas and the intention to do this, but haven't yet sized it up or scheduled it. I'm hoping we can surface this as a more pressing issue now that mobile VE is hitting this wall, and get going on it soon.
- Trevor