欢迎您光临深圳塔灯网络科技有限公司!
电话图标 余先生:13699882642

网站百科

为您解码网站建设的点点滴滴

Flutter简介

发表日期:2018-10 文章编辑:小灯 浏览次数:4369

前言

随着移动开发技术的日渐成熟,一些厂商开始考虑跨平台技术的解决方案,从早期的Cordova、Xamarin,再到后来的React Native和Weex等等,可谓是百家齐放,每种框架都有各自的优缺点,但目标都是一致的,就是提升应用的开发效率,降低研发成本,一套代码运行多个平台。这些框架除了Xamarin外都是采用Web端技术开发移动端应用,但提供比Web更好的用户体验。

以上框架中Cordova其实是一个Webapp框架,提供了针对iOS、Android、WP、BlackBerry等不同系统最常用的Native API调用能力,其本质还是由webkit做UI渲染,因此其性能和原生相比还有很大差距;而Xamarin笔者了解不多,又是个收费的项目,不再做扩展,有兴趣的可自行了解;React Native和Weex原理基本一样,都是基于js的开发框架,React Native基于React.js,Weex基于Vue.js,其本质都是通过虚拟DOM驱动原生组件的渲染,因此性能和体验比较接近原生,然而其需要通过桥接器来驱动原生渲染的过程,导致其在性能上与原生还是有一定差距。基于以上框架的缺点,Flutter框架应运而生。

Flutter面世

Flutter是Google在2015年推出的移动UI框架,可快速在iOS和Android上构建高质量的原生用户界面。

Flutter第一次亮相于2015年5月Dart开发者峰会上,初始名字叫做“Sky”,后更名为Flutter,Flutter使用Dart语言开发,Dart是Google于2011年推出的新的计算机编程语言。

Flutter特点

  • 快速开发

由于Flutter选用了Dart作为其开发语言,Dart既可以是AOT(Ahead Of Time)编译,也可以是JIT(Just In Time)编译,其JIT编译的特性使Flutter在开发阶段可以达到亚秒级有状态热重载,从而大大提升了开发效率。

  • 性能优越

使用自带的高性能渲染引擎(Skia)进行自绘,渲染速度和用户体验堪比原生。

  • 富有表现力的精美UI

Flutter内置众多精美的Material Design和Cupertino(iOS风格)小部件,开发者可快速构建精美的用户界面,以提供更好的用户体验。

Flutter框架

Flutter系统架构图

flutter_system_overview.png

如上图所示为Flutter官方给出的系统架构图,可以看出Flutter框架分为三层:Framework层、Engine层和Embedder层。

  • Framework层:由Dart来实现,包含众多安卓Material风格和iOS Cupertino风格的Widgets小部件,还有渲染、动画、绘图和手势等。Framework包含日常开发所需要的大量API,普通应用开发熟悉这些API的使用基本OK了,不过很多特殊场景的控件需要自己根据实际情况进行自定义。Framework层的源码地址:https://github.com/flutter/flutter/tree/master/packages/flutter/lib

  • Engine层:由C/C++实现,是Flutter的核心引擎,主要包括Skia图形引擎、Dart运行时环境Dart VM、Text文本渲染引擎等;如果想深入了解Flutter原理,建议阅读该层的源代码。源代码地址:https://github.com/flutter/engine

  • Embedder层:主要处理一些平台相关的操作,如渲染Surface设置、本地插件、打包、线程设置等。

Flutter原理

无论是iOS还是安卓都是提供一个平台的View给Flutter层,页面内容渲染交由Flutter层自身来完成,所以其相对React Native等框架性能更好。Flutter中图形渲染流程:

flutter_graphics_pipeline.png

大致流程如下:

  1. GPU的Vsync信号同步到UI线程
  2. UI线程使用Dart来构建抽象的视图结构
  3. 视图结构在GPU线程中进行图层合成
  4. 合成后的视图数据提供给Skia图形引擎处理成GPU数据
  5. 数据再通过OpenGL或Vulkan提供给GPU进行渲染

写在最后

本篇简单介绍了一下Flutter的特点和其框架基本原理,后续随着最佳实践的分享,回过头来看这篇文章会更清晰一些,敬请期待!


本页内容由塔灯网络科技有限公司通过网络收集编辑所得,所有资料仅供用户学习参考,本站不拥有所有权,如您认为本网页中由涉嫌抄袭的内容,请及时与我们联系,并提供相关证据,工作人员会在5工作日内联系您,一经查实,本站立刻删除侵权内容。本文链接:https://www.dengtar.com/18396.html
相关APP开发
 八年  行业经验

多一份参考,总有益处

联系深圳网站公司塔灯网络,免费获得网站建设方案及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

业务热线:余经理:13699882642

Copyright ? 2013-2018 Tadeng NetWork Technology Co., LTD. All Rights Reserved.