preface

From the micro channel small program internal test in 16 years to now, the development of small program business needs of major companies are growing, but developers with native to develop small program is very uncomfortable, especially if the business is more complex projects with native development is difficult to manage and iterate

Problems with using native development:

  • The applets themselves do not support common CSS precompilers
  • Advanced syntax above ES7, such as async await, is not supported.
  • Engineering, such as environment and variable management, is not supported
  • Lack of uniform request interception request
  • Lack of unified local cache read management

Problems that can be solved using frameworks:

  • CSS precompiler is supported
  • ES7 syntax is supported
  • Support engineering
  • Most frameworks support multiterminal, a set of code that can be reused multiple times

Framework introduction and comparison

Wepy

WePY (pronounced: /’wepi/) is a framework for component-based development of applets, which allows developers to choose their own style of development through precompilation. Framework details optimization, Promise, Async Functions are introduced to make developing small program projects easier and more efficient

Mpvue

Mpvue is a front-end framework for developing applets using vue.js. The framework is based on vue. js core, and MPvue modifies the runtime and Compiler implementation of vue. js to enable it to run in the environment of small programs, thus introducing a whole set of vue. js development experience for small program development.

The main features

  • Radical componentized development capabilities: improved code reuse
  • Complete vue.js development experience
  • Convenient Vuex data management solution: Easy to build complex applications
  • Quick WebPack build mechanism: custom build strategy, hotReload during development
  • Support for using NPM external dependencies
  • Use vue-CLI command line tool vue.js to quickly initialize the project
  • H5 code conversion ability to compile into small program object code

Taro

Taro is a multi-terminal development solution that follows the React syntax specification

Uni-app

Uni-app is a front-end framework for cross-platform application development using vue.js.

Chamelon

Chameleon/kə ːlɪ n/, short for CML, Chinese name Kamel long; The Chinese word chameleon means a cross-end holistic solution that can adapt to different environments just like a chameleon.

The main features

  • Directory structure: Provides a standardized project structure suitable for the development of large-scale enterprise applications.
  • View layer: The view layer is written by CML and CMSS, and the core is a standard responsive data-driven view update.
  • Logic layer: The logic layer, written in javascript, automatically updates the view after processing the data, providing event response methods for the view layer.
  • Polymorphic protocol: provides a solution for unifying the underlying components and interfaces of each end.
  • Specification verification: in order to improve the efficiency of development and code maintainability, provide a comprehensive code specification and verification.

Framework of contrast

The framework support grammar Number of star Open time Compile the way
wepy Wechat applets Class Vue 18854 2016-11-23 Conditional compilation of environment variables
mpvue Micro channel small program, Alipay small program, Baidu small program, headlines small program Vue 18605 2018-03-09 Conditional compilation of environment variables
taro H5, wechat applets, Alipay applets, Baidu applets, Toutiao applets, React Native, fast application, QQ applets React 21740 2018-06-07 Environment variable + file compilation
uni-app H5, wechat small program, Alipay small program, Baidu small program, headlines small program, QQ small program, Android version, IOS version Vue 12484 The 2018-07 Develop your own conditional compilation syntax
chameleon H5. Wechat small program, APP end (Chameleon Playground APP, Weex Playground) Class Vue, using CML + CMSS + JS 6521 2019-02-26 Self – developed polymorphic protocol

The number of STAR was recorded in 2019-09-17

Advantages and Disadvantages of the framework

wepy

Advantages: framework provided by wechat team, high support for wechat small programs, rich content of engineering development projects, components and related documents, active forums and communication communities

Disadvantages: Only support wechat small program, support single end, static compilation of the framework itself, more serious bugs will occur when dynamic repeat, syntax parsing sometimes error, error processing is relatively simple

mpvue

Advantages: the earliest open source multi-terminal framework, the Internet related problems and more examples, suitable for engineering and componentized development projects

Disadvantages: The development team basically no longer maintains the framework, the number of users is getting smaller and smaller, and the various problems of the framework itself remain unsolved after long iterations

taro

Advantages: Rich support capabilities, strong maintenance efforts of the development team, fast problem solving speed of the forum and the official, developed based on the wechat small program API, wechat small program support capability is strong

Disadvantages: the file itself is static compilation, complex code conversion will cause problems, the H5 and mobile terminal compatibility is poor

uni-app

Advantages: the framework promoted by the development team, the forum and communication community is very active, the compatibility of the end is extremely strong, there is a specific IDE to compatible with the framework code writing specification

Disadvantages: part of the code is not open source, the official problem feedback speed is not timely, editor binding

chameleon

Advantages: complete planning, unified polymorphic protocol, progressive cross-terminal, providing basic development scaffolding command tools, helping end developers to efficiently complete business development from the whole process of development, joint adjustment, testing, on-line and so on

Disadvantages: short open source time, few related materials and problem solving methods, and terminal compatibility ability to be improved

Selection of analysis

There are many existing small program frameworks, so the selection should be based on the actual situation of the business and the project itself

Compatible with wechat applets

If only compatible with wechat applets, wepy, taro, chameleon can be used, because the API of these frameworks are based on wechat applets, so the compatibility of wechat applets is basically similar to the original, vUE developers can choose Wepy, Chameleon, React developers can use Taro. Of course, some developers can use GLUP for easy development to do engineering to the native development, but although the framework itself increases the size of the package, but the framework will encapsulate the performance optimization points on the native basis, such as the repeated rendering of setData.

The reason for not choosing MPvue is that the development team of MPvue no longer maintains it, and mpvue also has some problems that have not been solved in the complex business compatible with wechat small programs.

There is only one reason for not choosing UNI-app, not liking HBuildX

Compatible with multiterminal

If you want to be compatible with multiple terminals, you can choose taro or Chameleon according to the requirements of compatible terminals. Although Chameleon has been open source for a short time, the design concept of unified polymorphic protocol is really good. Taro is a key project promoted by Concave-Concave-Lab. During the use of taro, it can be found that the feedback of the forum and the recovery speed of the exchange group are very timely. Using Taro can be very compatible with wechat small programs

conclusion

Small program framework selection, but what framework to choose, will eventually be compiled into small program recognizable code to run in the wechat client, according to the business needs to choose small program framework to figure out the native ability of small program. Finally, we have to make fun of the rough wechat development documents, many key points are not very detailed description