Home  >  Article  >  Web Front-end  >  What is the difference between vant and uniapp?

What is the difference between vant and uniapp?

青灯夜游
青灯夜游Original
2020-12-09 11:41:4913287browse

Difference: Vant is a lightweight and reliable mobile Vue component library that can quickly build pages with a unified style and improve development efficiency; while uni-app is a cross-platform application developed using Vue.js The front-end framework can be used to develop applications that are compatible with multiple terminals.

What is the difference between vant and uniapp?

The operating environment of this article: windows10 system, vue 2.9, thinkpad t480 computer.

Related recommendations: "Programming Teaching"

vant

Vant is a lightweight , reliable mobile Vue component library. Through Vant, you can quickly build a page with a unified style and improve development efficiency.

Features

  • 60 High Quality Components

  • 95% Unit Test Coverage

  • Complete Chinese and English documents and examples

  • Support on-demand introduction

  • Support theme customization

  • Support internationalization

  • Support TS

  • Support SSR

It is recommended to use Vant with webpack and babel, so that you can use the rich plug-ins and personalized configuration provided by webpack. Vant supports babel-plugin-import. Using Vant through the babel plug-in can optimize the code size and improve front-end performance.

Advantages and Disadvantages

Advantages:

  • Provides more than 60 high-quality components, covering various scenarios and performance on the mobile terminal Excellent, the average component size is less than 1kb (min gzip)

  • The unit test coverage is 90%, providing stability guarantee, complete Chinese and English documents and examples

  • Support Vue 2 & Vue 3, on-demand introduction, theme customization, internationalization, TypeScript, SSR

  • It is recommended to use webpack, babel uses Vant, so that you can use webpack Rich plug-ins and personalized configurations provided. Vant supports babel-plugin-import. Using Vant through the babel plug-in can optimize the code size and improve front-end performance.

  • Lightweight: As a mobile component library, Vant has always regarded lightweight as its core development concept. In order to balance the contradictory relationship between increasingly rich functions and lightweight, Vant

  • uses many optimization methods internally, including supporting component loading on demand, public module reuse, and component compilation. Process optimization, etc.

  • Rich and practical business components: Vant not only provides basic UI components, in order to facilitate developers to quickly build mobile malls, Vant

  • adds It contains many commonly used business components in mobile malls. Similar to address management, coupons, province, city and county selection, etc.

Disadvantages:

vant is more suitable for the development of mobile malls. If the project is other businesses, or the design style of the product is different from vant, it is not very suitable. Applicable vant

uniapp

uni-app is a front-end framework that uses Vue.js to develop cross-platform applications.

Developers write Vue.js code, and uni-app compiles it to multiple platforms such as iOS, Android, and WeChat applets to ensure that it runs correctly and achieves an excellent experience.

uni-app inherits from Vue.js and provides a complete Vue.js development experience.

uni-app component specification and extension API are basically the same as WeChat applet.

Developers with some experience in Vue.js and WeChat applet development can quickly get started with uni-app and develop applications that are compatible with multiple terminals.

uni-app provides conditional compilation optimization, which can elegantly write personalized code for a certain platform and call proprietary capabilities without affecting other platforms.

uni-app still uses the 5 engine when packaged into App, and all capabilities of 5 can be used in uni-app. The running performance on the App side is basically the same as that of the WeChat applet.

For technicians: There is no need to learn so many platform development technologies and research so many front-end frameworks. It is enough to learn uni-app based on vue.

For companies: lower cost, covering more users, uni-app is an efficient tool.

Advantages and disadvantages:

Advantages:

  • A framework for developing all front-end applications. Developers write a set of codes that can Publish to iOS, Android, Web (responsive), various mini programs (WeChat/Alipay/Baidu/Toutiao/QQ/DingTalk/Taobao), quick applications and other platforms.

  • uni-app is more friendly to front-end developers and has lower learning costs because uni-app is based on vue.js. And its encapsulated components are the same as those of WeChat applet, so the learning cost for current mainstream front-end personnel is almost 0.

  • uni-app uses HbuildX for development. Development using HBuilderX can be said to be extremely fast. The development speed is relatively fast, ps: I am a webstom party (very familiar with Vue), but for developing purely static pages, I use HBuilderX. I personally think it is very good, both in terms of environment and prompt effects.

Disadvantages:

  • Many people think that mini programs were launched first by WeChat. In fact, DCloud is the pioneer of this industry. Therefore, uni-app has been around for a relatively short time, and there are many aspects that are not yet perfect.

  • Quick App only supports vivo, oppo, Huawei

  • 360 applet is only supported on windows platform and needs to be opened in 360 browser

If you want to read more related articles, please visit PHP Chinese website! !

The above is the detailed content of What is the difference between vant and uniapp?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn