Appearance
Taro和uniapp对比
近期公司项目需要开发H5端的组件库,考虑到以后还有小程序的需求,所以我们准备选择使用跨端框架来开发,经过前期的调研,我们选择了Taro和uniapp两个多端框架,准备从两个框架中拿出一个来作为公司多端开发的框架。
下面我们从以下几个方面来对比这两个框架:
语法
样式
Taro在小程序中是不支持使用scoped语法的,官方推荐使用cssModules来代替。详见 这是一个风险点,因为cssModules的语法和scoped语法不一样,如果我们的团队成员之前没有使用过cssModules,那么在开发过程中就会出现一些问题。
在Uniapp中除了百度小程序不支持scoped语法,其他小程序都支持。
构建工具
Taro在3.5.x中使用的webpack + esbuild进行构建,在3.5.6版本开始中提供了预构建的功能,进一步提升了热更新的速度。
Uniapp在vue3中使用vite进行构建项目。
语法兼容
Taro和Uniapp均都可以使用部分html的方式进行编写。
例如:div span img等
Taro提供了useRouter的hook,可以获取到路由的参数和实现路由跳转,但是在uniapp中没有提供类似的hook。
Taro提供了宏函数开发模式,可以通过宏函数实现定义子组件的功能和配置,uniapp没有提供类似的功能。
Taro预计在3.6版本中支持继承的react-router和vue-router的跳转功能详见
性能
体积
在体积方面,Taro开发模式下体积要比uniapp大很多,差距大概在40%左右,但是在生产模式下,Taro的体积也是比uniapp大一些,差距大概在10%左右。
编译速度
在编译速度上目前还是无法和vite进行比较,热更新和编译速度上uniapp要比Taro快很多。
平台支持
在小程序支持上Taro和uniapp基本上没有太大的差别。
原生支持上,uniapp有单独的壳实现桥接原生api。Taro没有原生支持,预计在3.5.x版本支持原生的鸿蒙JS应用的开发。uniapp因为套用的安卓壳子,所以也是没什么问题的。但是包体积会比较大。
开发体验
Taro是基于px2rem和px2rpx的方式实现的,所以在开发H5的体验上可能会更好一些。更容易上手一些。能友好的兼容各种开发工具,比如vscode,webstorm等。 Taro-demo
uniapp是在H5端是基于小程序的rpx2rem的方式实现的,所以在开发H5的体验上可能会比较差一些。对于开发工具来说,目前大部分的开发工具没有对rpx有友好的支持,所以除了HBuliderX,其他的开发工具都不是很友好。