一项改变游戏规则的技术 - Flutter( 二 )

Flutter是什么？

本文插图
Flutter
Flutter是谷歌推出的跨平台UI框架，目前已经支持的平台有：mobile ， desktop ， web 。 Flutter的目标是以上平台能支持到以下对应的操作系统或平台：

mobile： iOS && Android
desktop： macOS ，Windows ， Linux
web：mobile && PC

就目前来说， mobile端的支持是最成熟的。 desktop端仅支持macOS ， web端有beta版可以使用，但是还不是十分成熟。
Flutter VS React Native
说到跨平台的技术或者框架，我们可能自然会想到React Native 。虽然很多产品和公司现目前已经停止了对React Native的使用，但是不可否认地是，在Flutter之前， React Native是最为大家熟悉的跨端UI框架。
所以，这里简单地做一个Flutter和React native的对比。二者最大的不同在于实现跨端的原理不同，从而导致了二者在相关的指标上的差异。所以，接下来，我会就二者的跨端原理做一下简单地比较。

本文插图
flutter vs react native
上图以在Android端为例。
假如我们需要一个Native端的button ， React Native的原理是，使用JavaScript写一个button ，由C++写的Bridge把JavaScript写的button转换为Java写的button ，最终被编译为机器码。
但是在Flutter里面，采用一门新的语言（Dart）来写button ，因为Dart也是基于VM的一门语言，所以， Dart可以直接被编译为机器语言。
所以，我们可以看出Flutter没有采用‘Bridge’ ，这样带来的好处是：

高性能：因为省去了JavaScript和Native之间的转换过程。
双端统一：不论是在iOS端还是Native端，都是采用Dart语言编写UI ，底层都是采用Skia这个图形库绘制。

以上，我们对Flutter和React Native做了简单地对比，相信大家已经能看出Flutter天然具有的一些优势了。接下来，我们更全面地来认识一下Flutter优秀的特性：
Flutter有什么特性

开发效率高
双端一致的UI
丰富而美丽的UI
媲美Native一般的性能
open source

开发效率高： Flutter拥有hot reload功能，每一次修改代码之后，只需要保存，不论是在模拟器上还是在连接的真机，都可以在秒级的时间内，马上看到效果，而不用再像以前以下需要经历重新的编译，打包，安装。
双端一致的UI：React Native是把JavaScript代码转换为Java或者Swift语言，最终调用平台各自的渲染机制来渲染UI 。而Flutter不论是在iOS还是Android端都统一采用Skia(一个二维图形库)来渲染UI ，这样就从根源上解决了由于平台不一致带来的UI不一致的问题。
丰富和美丽的UI：Flutter内置的Material Design和Cupertino（iOS风格）组件，能让你的App拥有现代化的漂亮的UI 。又因为在上一点提到的，因为采用了Skia ，你页面上的每一个像素都是Skia画的，所以你可以对你的组件进行高度的定制化。
媲美Native一般的性能：Flutter使用Dart作为它的编程语言， dart的编译器会把你写的Flutter代码直接编译成机器码，从而带来跟native一样的性能。
如果只是平白地罗列以上的这些优点，可能无法令人信服。接下来我们就更底层，更细致地来论证以上观点。
【一项改变游戏规则的技术 - Flutter】首先，我们来深入了解一下Dart这门开发语言，因为它对Flutter高效的开发效率，和高性能都是至关重要的。