vue3和vite双向加持，uni-app性能再次提升_uniapp vue3 vite

uni-app对vue3 & Vite的升级，是一个渐进式过程：

• 2020年9月：小程序平台支持 vue3 开发，小程序平台编译器依然使用webpack；
• 2021年5月：H5平台支持 vue3 开发，H5平台编译器升级为 Vite；
• 2021年8月：App平台支持 vue3 开发，App平台编译器升级为 Vite；
• 2021年11月：小程序平台编译器升级为 Vite；

至此，uni-app在全平台支持了 Vite 编译及Vue 3.x 运行。

so，这场持续一年之久的大版本升级，究竟给uni-app项目带来了哪些提升？

是时候总结（秀）一波了。

新版 uni-app 框架主要做了三大改进：

• 重写框架内核：基于vue3 + ts重写内置组件和API，实现更彻底、更高效的tree-shaking；
• 新增支持 Vite 构建工具，在H5平台实现秒开预览；
• 新增支持 Vue3.x，实现更灵活的开发方式，及更高的运行性能；

基于这三大改进，uni-app项目获得了多快好省四大收益：

• 更多的语法支持，支持组合式API，业务聚焦，开发效率更高；
• 更快的编译速度，H5平台十倍加速，小程序、App加速30%以上；
• 更好的运行性能，用户端响应更快，体验更好；
• 更小的代码体积，瘦身30%以上，更省体积、更省流量

更多的语法支持

新版uni-app支持Vue 3.x框架，支持组合式API，可实现更聚焦的业务开发。

Vue 3.x的一些新增特性，uni-app也已经完全支持，如：

• 支持<script setup>
• 支持<style scoped>、<style module>、State-Driven Dynamic CSS(v-bind)
• 支持jsx、tsx（h5,app 平台支持，小程序不支持）

另外，在小程序平台，新版uni-app也扩展了更多的语法，如：

• 更完善的模板语法支持（如 class、style 支持函数、变量等，不再局限数组、对象类型）
• 更完整的 props 支持（如传递函数）
• 更完善的 slot 支持（如作用域插槽）

更快的编译速度

开发者日常工作中，最无聊的就是等待编译构建。

某乎上还有一个”程序员在等待编译的时候都做什么？“的讨论帖，可见编译时间对开发者而言，是一个多么尴尬无聊的碎片时间。

uni-app本次升级vue3 & Vite后，在编译时间上有多少改进？带给开发者多少福利？我们安排真实测试，以数据说话。

测试环境说明：

硬件：RedmiBook 14 二代
处理器：Intel(R) Core(TM) i7-1065G7 CPU @ 1.30GHz 
内存：16.0 GB
操作系统：Windows 11 专业版 64 位操作系统
1
2
3
4

关于编译速度，我们做了两个维度的对比：

• 纵向对比：挑选uni-app