美文网首页
Flutter 简介(一)

Flutter 简介(一)

作者: Kevin丶CK | 来源:发表于2020-04-12 17:58 被阅读0次

    一、概述

    Flutter 是 Google推出并开源的移动应用开发框架,主打跨平台、高保真、高性能。通过 Dart语言开发 App,一套代码同时运行在 iOS 和 Android平台。 Flutter提供了丰富的组件、接口,使开发者可以很快地为 Flutter添加 native扩展。同时 Flutter还使用 Native引擎渲染视图,能为用户提供良好的体验。

    二、优点

    跨平台自绘引擎

    1、既不使用WebView,也不使用操作系统的原生控件。使用自己的高性能渲染引擎来绘制widget。Flutter使用Skia作为其2D渲染引擎,Skia是Google的一个2D图形处理函数库,包含字型、坐标转换,以及点阵图都有高效能且简洁的表现,Skia是跨平台的,并提供了非常友好的API,目前Google Chrome浏览器和Android均采用Skia作为其绘图引擎。
    2、保证在Android和iOS上UI的一致性,避免对原生控件依赖而带来的限制及高昂的维护成本。

    高性能

    1、采用Dart语言开发。Dart在 JIT(即时编译)模式下,速度与 JavaScript基本持平。但是 Dart支持 AOT,当以 AOT模式运行时,JavaScript便远远追不上了。速度的提升对高帧率下的视图数据计算很有帮助。
    2、使用自己的渲染引擎来绘制UI,布局数据等由Dart语言直接控制,在布局过程中不需要像RN那样要在JavaScript和Native之间通信,在滑动和拖动的场景下具有明显优势。

    三、Dart语言

    Dart和JavaScript对比

    1、开发效率高

    基于JIT的快速开发周期:Flutter在开发阶段采用,采用JIT模式,这样就避免了每次改动都要进行编译,极大的节省了开发时间;
    基于AOT的发布包: Flutter在发布时可以通过AOT生成高效的ARM代码以保证应用性能。而JavaScript则不具有这个能力。

    2、高性能

    Flutter中需要能够在每个动画帧中运行大量的代码。这意味着需要一种既能提供高性能的语言,而不会出现会丢帧的周期性暂停,而Dart支持AOT,在这一点上可以做的比JavaScript更好。

    3、快速内存分配

    Flutter框架使用函数式流,这使得它在很大程度上依赖于底层的内存分配器。因此,拥有一个能够有效地处理琐碎任务的内存分配器将显得十分重要,在缺乏此功能的语言中,Flutter将无法有效地工作。当然Chrome V8的JavaScript引擎在内存分配上也已经做的很好,事实上Dart开发团队的很多成员都是来自Chrome团队的,所以在内存分配上Dart并不能作为超越JavaScript的优势,而对于Flutter来说,它需要这样的特性,而Dart也正好满足而已。

    4、类型安全

    Dart是类型安全的语言,支持静态类型检测,所以可以在编译前发现一些类型的错误,并排除潜在问题,对于开发者更具有吸引力。

    5、Dart团队的支持

    由于有Dart团队的积极投入,Flutter团队可以获得更多、更方便的支持,正如Flutter官网所述“我们正与Dart社区进行密切合作,以改进Dart在Flutter中的使用。
    要想学习跟多Dart语言的可以点击这里

    四、框架结构

    Flutter官方提供的Flutter框架图
    1、Flutter Framework

    纯 Dart实现的 SDK,实现了一套基础库,自底向上,简单介绍一下:
    1、底下两层(Foundation和Animation、Painting、Gestures)在Google的一些视频中被合并为一个dart UI层,对应的是Flutter中的dart:ui包,它是Flutter引擎暴露的底层UI库,提供动画、手势及绘制能力。
    2、Rendering层,这一层是一个抽象的布局层,它依赖于dart UI层,Rendering层会构建一个UI树,当UI树有变化时,会计算出有变化的部分,然后更新UI树,最终将UI树绘制到屏幕上,这个过程类似于React中的虚拟DOM。Rendering层可以说是Flutter UI框架最核心的部分,它除了确定每个UI元素的位置、大小之外还要进行坐标变换、绘制(调用底层dart:ui)。
    3、Widgets层是Flutter提供的的一套基础组件库,在基础组件库之上,Flutter还提供了 Material 和Cupertino两种视觉风格的组件库。而我们Flutter开发的大多数场景,只是和这两层打交道。

    2、Flutter Engine

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

    知识快车

    1、了解大概后,可以搭建环境了,Flutter环境搭建
    2、本文很多概念和总结来自《Flutter实战》,想更加详细了解的可以自行查阅在线地址

    相关文章

      网友评论

          本文标题:Flutter 简介(一)

          本文链接:https://www.haomeiwen.com/subject/dyavmhtx.html