Flutter框架调研

背景介绍

原生开发 VS 跨平台技术

原生应用程序是指某一个移动平台(比如iOS或安卓)所特有的应用,使用相应平台支持的开发工具和语言,并直接调用系统提供的SDK API。比如Android原生应用就是指使用Java或Kotlin语言直接调用Android SDK开发的应用程序;而iOS原生应用就是指通过Objective-C或Swift语言直接调用iOS SDK开发的应用程序。

原生开发不能满足移动互联网的高速发展带来的需求,如动态化内容需求增大,务需求变化快,为了减少开发成本和提高开发效率,提出跨平台技术(或称混合平台开发技术)。

跨平台一般指的是Androds和iOS两个平台,跨平台技术主要分为三类:

  • H5+原生(Cordova、Ionic、微信小程序)
  • JavaScript开发+原生渲染 (React Native、Weex、快应用)
  • 自绘UI+原生(QT for mobile、Flutter)

技术类型

UI渲染方式

性能

开发效率

动态化

框架代表

H5+原生

WebView渲染

一般

支持

Cordova、Ionic

JavaScript+原生渲染

原生控件渲染

支持

RN、Weex

自绘UI+原生

调用系统API渲染

Flutter高, QT低

默认不支持

QT、Flutter

Flutter简介

Flutter是Google发布的一个用于创建跨平台、高保真、高性能移动应用的框架。

Flutter属于“自绘UI+原生渲染”的方式,实现了一个自绘引擎,使用自身的布局、绘制系统

移动端开发者可以通过 Dart语言开发 App,一套代码同时运行在 iOS 和 Android平台。Flutter提供了丰富的组件、接口,开发者可以很快地为 Flutter添加 native扩展

Flutter使用Skia作为其2D渲染引擎,Skia是Google的一个2D图形处理函数库,包含字型、坐标转换,以及点阵图都有高效能且简洁的表现,Skia是跨平台的,并提供了非常友好的API,目前Google Chrome浏览器和Android均采用Skia作为其绘图引擎。

Flutter框架结构

Flutter Framework

这是一个纯 Dart实现的 SDK,它实现了一套基础库

Flutter Engine

这是一个纯 C++实现的 SDK,其中包括了 Skia引擎、Dart运行时、文字排版引擎等。在代码调用 dart:ui库时,调用最终会走到Engine层,然后实现真正的绘制逻辑。

Flutter特性

开发效率高

基于JIT模式快速开发,通过Dart的动态解释特性,实现代码热部署和调试。

基于AOT的发布包。Flutter在应用稳定版本发布时通过AOT生成高效的ARM代码保证应用性能,而JavaScript不具备这个能力。

高性能

首先,Flutter APP采用Dart语言开发。Dart在 JIT(即时编译)模式下,速度与 JavaScript基本持平。但是 Dart支持 AOT(提前编译),当以 AOT模式运行时,JavaScript便远远追不上了。

其次,Flutter使用自己的渲染引擎来绘制UI,布局数据等由Dart语言直接控制,省去于Native通信开销

类型安全

相比较JavaScript这种弱类型语言,Dart是类型安全的语言,支持静态类型检测。

Flutter入门实践

研究官网和GitHub的几个示例(待完善)

Flutter技术社区

Flutter官网

官网文档 URL: https://flutter.dev/docs

Fluter中文网 URL https://flutterchina.club/docs/

更新频率

时间

版本

更新内容

2021.5.18

2.2

2021.3.3

2 release

2020.10.1

1.20 release

2020.5.6

1.17

2019.12.11

1.12

Github

Star:128k + 排star榜第16位,对比vue 187k第五位  react 173第六位

Issue:5k+(9240 open, 49058 closed) 截至2021/8/19 11:00 最近一天内提了30+ 已关闭 10

*

Tag = [flutter] 97,868 questions

Tag = [dart] 55,626 questions

掘金

Flutter板块已发布9016篇文章

CSDN

搜索Flutter相关,博主等级五级以上相关博客有54,000+

搜索Dart相关,博主等级五级以上相关博客有26,000+

Plugin

Github 项目,已收集670+ https://github.com/jahnli/awesome-flutter-plugins

参考文献

[1] 《Flutter实践》(电子书)

[2] Flutter 官方文档

[3] Flutter 中文网

上一篇:选Compose 还是kotlin flutter 移动端跨平台的未来


下一篇:better-scroll之吸顶效果巨坑挣扎中