Rendering Algorithm Optimization Of Vue Framework

In the front-end field,application content,functions,data processing and interaction are becoming more complex,and front-end performance problem has become a research hotspot.For a long time,because the performance of the PC is much higher than that of the mobile,rendering performance problems have not been highlighted.But with the outbreak of the mobile web market,rendering performance problems need to be solved urgently.Among many rendering frameworks,the Vue framework has been widely welcomed by enterprises and developers.You Yuxi,Vue's author,pointed out the improvement direction of Vue,according to it,this research improves the rendering algorithm of the Vue 2.6 framework.The rendering algorithm of the original Vue 2.6 is the diff algorithm,which is based on Virtual DOM.Although it effectively reduces operations on the real DOM and improves rendering performance,there is still a lot of space for optimization.This research proposes two optimization points for the original Vue 2.6 framework: the first point adds static DOM node detection to the original framework,so that static nodes do not repeat rendering when the page is updating;the second point improves the diff algorithm,it significantly reduces operations on the real DOM.This study tested the two optimization schemes on Android and PC.The experimental results show that compared to the original Vue 2.6,rendering performance optimization of the first optimization point is not very obvious;the second optimization point achieves significant optimization results,rendering performance is improved by up to 89.62%,and rendering time is reduced by up to about 2000ms;the framework combining the two optimization points achieves better optimization effects,and the second optimization point plays the main role.This study proposes two optimization schemes for the front-end framework Vue 2.6,improves the rendering algorithm of this framework,and significantly promotes the rendering performance of Vue 2.6.It has certain reference value for improvement research of many front-end frameworks based on Virtual DOM.