With the official release of VUE3, more and more partners began to learn vue3 offensive.

Application Config

In this app.config, look at the API process. I found a reason to upgrade my project to VUE3.

This is theperformance

  • Type: boolean
  • Default: false
  • Example:
// main.js
app.config.performance = true
Copy the code

Setting this option true enables component initialization, compilation, rendering, and patch performance tracking in the browser devTool Performance/timeline panel. Works only in development mode and in browsers that support the Performance. Mark API.

This is used by VUe2performanceResults seen

This is VUE3 onapp.config.performance = trueResults seen

As can be seen, the timings column of VUe2 does not show specific information such as the rendering time of each component. Vue3, on the other hand, can clearly see the time information at the lifecycle level, so that in real projects, this pattern can be used to locate which components load slowly and which components need to be optimized.

cool~~~