use async render to enhance large tree

[Jackey Cheung]

Currently, while rendering large tree, a severe lag/freeze makes it very unresponsive. The thought is to break down the rendering into steps, instead of rendering the whole list at once. However, we can't use v-if directive or anything similar. Because v-if itself lags/freezes too.

• An alternative could be, use asynchronous rendering function to render one immediate level at a time. Once it is rendered, it must not be rendered again. Gradually, the list will be populated completely if the tree is navigated completely through. This solves one aspect of the issue.
• The other aspect is that the immediate children of one node could be very long, this will still cause lag. The render function has to break down the whole rendering process into small steps. Either via timer interval, or Vue's tick callback. However, it's not yet clear whether either of these would work. Research is needed.

[Jackey Cheung]

After testing with a simple 1000-node 2-level tree, it seems the rendering speed is quite good. With the newly added rendered field, it reacts instantly to clicks. But the browser spends around 1 second on major GC when a sub-tree is expanded. Although the DOM structure has not changed.

Will try to test more on this.