前端队长の技术博客

目前主流跨平台框架简介

  可用平台 开发技术 使用语言 Star 主体
Hippy iOS, Android,Web   Vue,React,Java,Object-C 4.1k Tencent
uni-app iOS、Android、移动端H5,各种小程序 混合   17.6k DCloud
Framework7 iOS、Android 混合 Vue,React 15.1k iDangero.us
Flutter iOS, Android,Web,Desktop 原生 Dart 85.1k Google
Electron Desktop 原生 JavaScript,HTML, CSS 80.1k Linux基金会
React Native iOS, Android 原生 React 84.2k Facebook
Weex iOS, Android,Web 原生 Vue,Rax 17.6k Alibaba
chameleon(变色龙) iOS、Android、移动端H5,各种小程序 原生 CML-类VUE语法 7.1k 滴滴出行
Taro iOS、Android、移动端H5,各种小程序 混合 React 23.7k 京东
mpvue 微信小程序   vue 49 美团
WePY 微信小程序   类似Vue 19.6k Tencent
ionic iOS 、 Android、Web, Electron、PWA     40k ionic-team
Cube UI H5   Vue 7.7k 滴滴出行
mint-ui 移动端Element   Vue 15.4k 饿了么

未完待续…

PC电脑上访问的就叫web页面,手机上(包括浏览器,微信)访问的就叫H5页面。

按照开发技术,App 可以分成三大类:

Flutter 与 React Native/Weex 本质上是不同的,它并没有使用 WebView、JavaScript 解释器或者系统平台自带的原生控件,而是有自己专属的一套 Widget,界面开发使用 Dart 语言,而底层渲染使用自身的高性能 C/C++ 引擎自绘。


先说一下全名,progressive web app: 渐进式网页应用。这是谷歌推出的,我是这样理解的:

为了解决这些问题,Chrome 团队开发了新技术”渐进式 Web App”(Progressive Web App,缩写 PWA)。它可以把网站缓存在手机里面,供离线时使用,还能在手机首屏生成图标,直接点击进入,并且有通知推送能力,也不带有浏览器的地址栏和状态栏,跟原生 App 的使用体验非常接近。

但是,PWA 需要浏览器访问一次网站,才能在首屏生成图标,并且目前 iOS 系统的支持还不够理想,所以还只是一项探索性质的技术,迄今为止缺乏足够的成功案例。


在移动客户端领域,主流的跨平台开发框架大体经历了三个阶段。

第一阶段,主要通过 WebView 绘制界面,并通过 JavaScript Bridge 将系统的一部分能力暴露给 JS 调用。PhoneGap、Cordova 混合开发都可以归属于这一类。

第二阶段,大家发现用 WebView 承载界面有性能等各种问题。于是将绘制交回给原生,通过 JS 来调用原生控件,编写业务代码。Weex、RN 就是其中的佼佼者,这也是现在绝大部分跨平台框架的思路。

第三阶段,虽然使用原生控件承载 UI 解决不少渲染的问题。但是处理平台差异性仍然需要耗费极大精力,效果也不尽如人意。这个时候,Flutter 提出的解决方案,就是连绘制引擎也自研,尽可能减少不同平台之间的差异性, 同时保持和原生开发一样的高性能。因此目前业界对 Flutter 的关注度也是最高的。

参考链接

http://www.ruanyifeng.com/blog/2019/12/hybrid-app-concepts.html

https://github.com/niezhiyang/open_source_team

(完)