一码多端方案比较

Posted on Edited on In Views:

Outline:

  • Intro
  • Flutter
  • Electron
  • Tauri

Intro

  • 本来, 使用跨平台技术就是为了节约开发成本, 不过事实证明, 一种框架用到底, 最好适配问题一大堆, 开发成本反而越来越高. 所以最好的应用开发模式是Hybrid, 即原生+框架.
    • 对于需要调用大量底层API, 并且UI不复杂的部分, 建议使用原生.
    • 不需要大量底层API的部分就用框架.
  • Flutter, RN, Electron都可以进行移动端和桌面端开发
    • Flutter因为生态最差, 桌面端开发就不要想了( 毕竟桌面应用大部分都是生产级的, 逻辑最复杂, 对底层调用最多 ).
    • RN在桌面端略逊于Electron
    • Electron在桌面端强于另外二者, 事实上, Electron在桌面端的对手是Tauri
  • Tauri只用于桌面端, 目前还没有移动端适配,但是Tauri的roadmap上明确提出将来会做移动端适配.
    • 相比其他三者, Tauri没有大公司撑腰, 所以移动端适配估计很烂.
  • 当然,对于中国互联网, 还存在小程序端. Flutter, RN, Electron的小程序支持都不错.
  • 此外还有人听说过Uniapp, 它使用Vue来开发移动端和小程序端, 对标RN. 这玩意儿实在是太烂了, 我都不想骂它. 用它的人好好反省一下, 自己的眼光为什么这么差.

Flutter

Flutter CLI很优雅, 但是Flutter生态太烂了.

React Native

生态很好. 总体而言中规中矩, 没啥缺点.

Electron

内置了Chromium引擎, 所以不同平台看到的都是一样的结果. 无论是移动端, 桌面端, Web端, 都是适配性最好.

且Electron开发就是纯粹的前端开发, JS + HTML + CSS. 学习成本低.

Electron和RN都使用了JS运行时( node ,deno之类... )

缺点是速度很慢, APP体积臃肿.

Tauri

Rendering

Tauri在桌面端对标Electron. Electron内置了Chromium引擎, 而Tauri使用操作系统内置的浏览器引擎:

  • Edge Webview2 (Chromium) on Windows
  • WebKitGTK on Linux
  • WebKit on macOS

但是, 因为Safari (Based on WebKit)臭名昭著地烂, 所以Tauri在Safari上可能有很多Bug.

总结: Tauri在桌面端的适配性略低于Electron.

Backend

Tauri的后端使用RUST, 因此没有runtime. 程序直接被编译为二进制代码, 速度更快. 缺点是需要学RUST.

  • RN和Electron的后端都是NodeJS.
  • 不过Tauri的roadmap也在考虑TS/JS运行时的适配.
  • Tauri的后端暴露给前端简洁的接口. 但是在必要时刻, 还是得用RUST来写后端API.

Frontend

Tauri的前端和Electron一样, 是纯粹的 JS + HTML + CSS开发.

Bundle

Tauri APP由于是二进制码, 安装包大小比Electron小几十倍

Performance

Tauri软件是二进制码, 因此速度比Electron快一倍. Startup time也大概快一倍.

Security

Tauri生成二进制代码( 无runtime ) , RN和Electron都生成JS代码( runtime为node ). 前者逆向起来的难度远高于后者.

Developer experience

Electron和Tauri的开发体验都很好.