Currently the Inspect tab is by far the largest performance hog. Profiles done in Chrome show it taking up ~83% of the time used "rendering" the game just updating the DOM from the inspect tab's code.
This is not too surprising, the inspect tree represents the entire game structure as a tree of DOM elements, and large games can have a tree with a branching factor in the tens of thousands.
The easiest solution would be to just drop the inspect tree entirely. But I don't think that is worth it.
Instead we should turn to some technique like virtualization, where DOM elements not being rendered are not even added to the document. it's a bit hackish, but it can have HUGE speedups. We could also employ types of lazy loading, where if a node is not expanded don't even build it's DOM elements until (if) the user expands them.
This is not a trivial rewrite, but it will be needed to keep Viseur performant.
Currently the Inspect tab is by far the largest performance hog. Profiles done in Chrome show it taking up ~83% of the time used "rendering" the game just updating the DOM from the inspect tab's code.
This is not too surprising, the inspect tree represents the entire game structure as a tree of DOM elements, and large games can have a tree with a branching factor in the tens of thousands.
The easiest solution would be to just drop the inspect tree entirely. But I don't think that is worth it.
Instead we should turn to some technique like virtualization, where DOM elements not being rendered are not even added to the document. it's a bit hackish, but it can have HUGE speedups. We could also employ types of lazy loading, where if a node is not expanded don't even build it's DOM elements until (if) the user expands them.
This is not a trivial rewrite, but it will be needed to keep Viseur performant.