Google 为何以 Flutter 做为原生突破口

Android 的前生今世

Android 系统

Android 系统做为全球第一大系统，基于 Java 开发的移动端有着诸多的性能优点。 2018年前 H5 的性能瓶颈和 react-native 的一系列缺点(动画性能、第三方依赖、逻辑上的额外开销、调试的困难、不能彻底屏蔽原平生台 等)致使业界对跨平台开发失去信心。 直到 2018 年 10 月 Google 推出首个 Flutter 跨平台解决方案，打破整个移动开发的方向。

为何 Flutter 成为 Android 方向标

1. 跨平台性: Flutter 基于图像绘制引擎进行渲染，在不一样平台下绘制效果是绝对一致的，能作到真正的跨平台，一处写到处运行
2. 性能优异性: 不一样于 H5 经过 DOM 渲染 和 RN 映射组件，Flutter 直接基于 native 进行绘制。性能上彻底超过原生
3. 热重载性: Android 原生开发 会遇到 编译-打包-安装 三部曲。开发效率迟迟得不到提高。热重载技术在 Flutter 内完美体现

Flutter 详细介绍

1. Dart 语法编译: Dart 是一种强类型、跨平台的客户端开发语言。具备专门为客户端优化、高生产力、快速高效、可移植易学的风格。Dart 主要由 Google 负责开发和维护
2. Flutter 插件: Flutter 使用的 Dart 语言没法直接调用 Android 系统提供的 Java 接口，这时就须要使用插件来实现中转。Flutter 官方提供了丰富的原生接口封装

Flutter 系统结构

Skia 图像处理引擎

1. 2005 年 Skia 图像处理引擎成立，用来展现 Chrome 火狐 和其余 Google 自家的产品使用。
2. 2007 年 第一个 Android 系统问世，因而 Google 开发者将 Skia 移植到 Android 平台。
3. Skia 做为一个 2D 的图形系统，包括绘图，渲染，显示图片都是用 Skia 完成。

原生开发会接触 SKia 吗？

Skia 引擎详解

• 疑问： 是真的吗？我只接触过 Bitmap,原来 Bitmap 下面还有不少奥秘

  

  

  

Skia 引擎与 Flutter 有什么关系勒？

• 除了经过 xml 方式定义布局 或者继承View 显示在 Android 屏幕外还有没有方法呢？

为何 Flutter 会实现三大特性

跨平台

性能优异

渲染流程

React 渲染与 Flutter 渲染相同点

React 渲染与 Flutter 渲染不一样点

1. 绘制树：ReactNative 基于 ReactShadow 的链式结构在内存中造成一个虚拟的 Dom 树，Flutter 是经过引擎实现不一样图层的渲染方式。
2. 机制不同：ReactNative 最终被反射成原生控件，而 Flutter 是底层经过引擎直接渲染，不存在映射的说法。

Flutter 渲染

在 Flutter 界面渲染过程分为三个阶段：布局、绘制、合成，布局和绘制在 Flutter 框架中完成合成则交由引擎负责。

Flutter优点

• Flutter 横空出世! 在 Flutter 的响应式框架中，控件树中的控件直接经过可移植的图形加速渲染引擎、⾼性能的本地 ARM 代码进⾏绘制,再也不须要经过虚拟 DOM 或虚拟控件、真实 DOM 或平台控件这些中间对象来绘制。Flutter 响应式框架经过“⽆中间商赚差价”的⽅式直接利⽤硬件的全部性能，因此正如前⾯所说的，Flutter 应⽤的性能⽐原⽣ App 更加优秀。

我的看法

• 相对于几大跨平台框架，我的仍是很看好 Flutter 的。毕竟是 Google 的亲儿子嘛，仍是能够先入坑的，本身动手写一个 Flutter APP 出来。在不一样设备上跑一下，本身体验一下。

计划

后续我会推出从零开发一个完整的 Flutter 项目一系列文章, 把本身踩得坑记录下来。

Flutter 系列文章

• Flutter (一) Dart 语言基础详解(变量、内置类型、函数、操做符、流程控制语句)
• Flutter (二) Dart 语言基础详解(异常,类,Mixin, 泛型,库)
• Flutter (三) Dart 语言基础详解 (异步,生成器,隔离,元数据,注释)
• Flutter (四) 基础 Widgets、Material Components Widget 全面介绍

感谢

• Flutter 中文网