Google 以 Flutter 作为原生突破口,移动端即将统一了
Android 的前生今世
Android 系统
Android系统作为全球第一大系统,基于 Java 开发的移动端有着诸多的性能优势。 2018年前 H5 的性能瓶颈和 RN 的停更 导致业界对跨平台开发失去信心。 直到2018年10月Google推出首个 Flutter 跨平台解决方案,打破整个移动开发的方向。
为什么 Flutter 成为 Android 方向标
- 跨平台性:Flutter基于图像绘制引擎进行渲染,在不同平台下绘制效果是绝对一致的,能做到真正的跨平台,一处写处处运行
- 性能优异性:不同于H5通过DOM渲染 和RN映射组件,Flutter直接基于native进行绘制。性能上完全超过原生
- 热重载性: Android原生开发 会遇到 编译-打包-安装 三部曲。开发效率迟迟得不到提升。热重载技术在Flutter内完美体现
Flutter 详细介绍
- Dart 语法编译:Dart 是一种强类型、跨平台的客户端开发语言。具有专门为客户端优化、高生产力、快速高效、可移植易学的风格。Dart主要由Google负责开发和维护
- Flutter 插件:Flutter使用的Dart语言无法直接调用Android系统提供的Java接口,这时就需要使用插件来实现中转。Flutter官方提供了丰富的原生接口封装
Flutter 系统结构
Skia 图像处理引擎
- 2005年Skia图像处理引擎成立,用来展示Chrome 火狐 和其他Google自家的产品使用。
- 2007年 第一个Android系统问世,于是Google开发者将Skia移植到Android平台。
- Skia作为一个2D的图形系统,包括绘图,渲染,显示图片都是用Skia完成。
原生开发会接触 SKia 吗?
Skia 引擎详解
- 疑问: 是真的吗?我只接触过 Bitmap,原来 Bitmap 下面还有很多奥秘
Skia 引擎与 Flutter 有什么关系勒?
- 除了通过xml方式定义布局 或者继承View 显示在Android屏幕外 还有没有 方法呢?
为什么 Flutter 会实现三大特性
跨平台
性能优异
渲染流程
React 渲染与 Flutter 渲染相同点
Flutter 渲染
在 Flutter 界面渲染过程分为三个阶段:布局、绘制、合成,布局和绘制在 Flutter 框架中完成合成则交由引擎负责。
之前,Google发布了Flutter前端框架的1.0版本。有同学要问,Flutter是什么东东?Flutter是Google基于Dart语言的一款前端框架,目前可以在Android和iOS平台进行编译运行,其运行效率可以媲美原生应用,这也是区别于JS类跨平台框架,如weex、Taro、React Native等的最大优势,同时,Dart语言最早也是Google发布出来想要改进JS的语言,所以Dart to JS是不成问题的。据悉,Flutter接下来也是要通过编译为JS打通Web端开发的。至此,Flutter不但可以跨主流移动操作系统iOS和Android,还可以通过浏览器和类似PWA的应用,打通主流桌面操作系统Windows、MacOS和Linux。
Google已经研发两年多的,最新打算用来取代Android的移动操作系统Fuchsia OS,根本前端就是用Flutter框架写的,如果Fuchsia系统发布,那Flutter和Dart一定是一跃成为首选前端编程语言和框架,只是苦了广大程序员,又有新东西要学了……
还有就是Google的Go语言增长势头迅猛,伴随其媲美C++的效率、极简的服务器并发编程、高效的服务器运行效率和现代化的编程特性和方式,国内外大部分公司都对其进行了应用,用来取代之前的一些接口和服务器应用。其中Docker就是最著名的例子。而Go语言早已突破1.x阶段,正稳步迈向2.0阶段。
我们可以清晰地看到Google的布局和野望,Dart主攻前端和移动端,Go主攻服务器端。前后端通吃,不同于微软的C#和苹果的OC和Swift,Google的布局似乎更加全面,应用和影响也更加广泛。Google统一前后端开发江湖的野望也会在一定程度上实现,至少,开源的语言和有实力的靠山公司,会比别家实现的好。
现在开始玩Flutter的好处呢, 我认为有如下几点:
1、如果我们以后想在Google的新系统上跑程序的话, 用Flutter来编写是一定没错的. 当然最近的报导显示, Fuschia原生支持ART, 因此Android程序应该也可以. 不过直接上Flutter我认为更好.
2、Flutter用Dart, 学习Flutter的同时会使我们掌握一门新的语言. 买一送一.
3、Flutter天生支持iOS风格的控件, 称为Cupertino, 这样我们可以一套设计, 一套code跑在两个系统上.
4、学习Flutter的过程会改变手机端app开发的思维. 毕竟这个亲只有一个activity. 全程跟个游戏引擎一样. 60帧每秒绘图.
5、Hot reload. 极大地加速了我们的开发效率. 试过了, 绝对会爱上它.
6、Flutter提供method channel给Android和iOS. 其实我们可以只用Flutter来开发UI. 其他底层逻辑可以封装Android和iOS分别的lib package. 然后直接Rx封装写回method channel. 也是一种新的开发模式.
7、性能更好, 兼容性更好, 开发起来更有乐趣, 这才是程序员的人生. 而Flutter都能满足.
如何学习Flutter:
https://blog.csdn.net/androidstarjack/article/details/87720925
从目前的情况和节奏来看,这次 Google 是认真的,承前启后的为它的下一代操作系统 Fuchsia 提前铺了路! 所以,我还是建议,平常你没事的时候可以开始学习了,等到真正成熟的时候,你就会一马平川的。不知道,你看好 Flutter 吗?欢迎你在文章底下留言交流看法。
阅读更多
一份完整的Android Studio搭建Flutter教程
如果对技术开发比较感兴趣,可以关注我的公众号:终端研发部,id:codeGoogler
Google 以 Flutter 作为原生突破口,移动端即将统一了的更多相关文章
- 原生js移动端列表无缝间歇向上滚动
在项目开发中尤其是在项目的活动页面的开发中,经常需要将用户的购买信息或中奖信息等以列表的形式展示在页面当中,并可以使其自动间歇向上滚动来达到在有限的区域内展示所有信息的目的.通常的做法是通过将列表父元 ...
- Flutter 即学即用系列博客——08 MethodChannel 实现 Flutter 与原生通信
背景 前面我们讲了很多 Flutter 相关的知识点,但是我们并没有介绍怎样实现 Flutter 与原生的通信. 比如我在 Flutter UI 上面点击了一个按钮,我希望原生做一些处理,那么原生怎么 ...
- Flutter和原生交互学习
PlatformChannel功能简介 PlatformChannel分为BasicMessageChannel.MethodChannel以及EventChannel三种.其各自的主要用途如下: B ...
- Flutter ChartSpace:通过跨端 Canvas 实现图表库
基于Flutter 的图形语法库,通过跨端 Canvas ,将基于 Javascript 的图形语法库 ChartSpace 扩展至 Flutter 端 作者:字节跳动终端技术--胡珀 背景 数据平台 ...
- 原生js移动端touch事件实现上拉加载更多
大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...
- 纯原生js移动端图片压缩上传插件
前段时间,同事又来咨询一个问题了,说手机端动不动拍照就好几M高清大图,上传服务器太慢,问问我有没有可以压缩图片并上传的js插件,当然手头上没有,别慌,我去网上搜一搜. 结果呢,呵呵...诶~又全是基于 ...
- 纯原生js移动端城市选择插件
接着上一篇纯js移动端日期选择插件,话说今天同事又来咨询省市县联动的效果在移动端中如何实现,还是老样子,百度上一搜,诶~又全是基于jquery.zepto的,更加可恨的是大多数都是PC版的,三个sel ...
- Google的Flutter工具允许开发者开发跨平台应用
与大多数应用程序开发人员交谈,他们会告诉你,与iOS相比,制作Android应用程序要困难得多,也更复杂,也不那么有趣.实际上,如果你要求报价,这两种软件都将单独定价,因为它们都需要单独的开发时间和团 ...
- MethodChannel 实现flutter 与 原生通信
Flutter 步骤 目的:在flutter页面中主动调用原生页面中的方法. 1 在widget中,定义MethodChannel变量 static const MethodChannel metho ...
随机推荐
- jQuery的deferred对象实战应用(附:Exchar动态多条数据展示并在topic展示详细数据)
解决三个后台请求都成功后先比较数据再处理数据的需求 今天碰到了一个问题,我需要创建一个图表,但是需要请求三个接口才能比较出指标数据,于是就看到了deferred对象 理论的补充在这里:http://w ...
- html5+ 原生标题栏添加input 输入框
titleNView: { backgroundColor: "#f7f7f7", // 导航栏背景色 titleText: "", // 导航栏标题 titl ...
- THUWC2019滚粗记
Day-1 今年年初,留坑,以后补,多多关注. Day0 上午吃了碗粉,就坐地铁到了高铁站. 做高铁从长沙到了广州,最大的感受就是热热热热热热热热. 所以太热了不说了.(雾 汉堡王真香 Day1 上午 ...
- jsp:forward动作功能
jsp:forward动作:引导请求者进入新的页面 例子:login.jsp <center><p>用户登录 </p> <form name="fo ...
- 把xml数据直接插入到sqlserver数据库
存储过程: ALTER proc [ali].[ins_冻结金额表] @xmldoc varchar(max), ) as declare @idoc int exec sp_xml_prepared ...
- javaWeb使用百度编辑器上传图片的问题
1.先看项目结构(访问网站:http://localhost:8080/baidu_edit/) 2.部署6个jar包 1)先将jsp/lib的6个jar包放入到WEB-INF/lib文件夹中 2)然 ...
- python模拟页面调度LRU算法
所谓LRU算法,是指在发生缺页并且没有空闲主存块时,把最近最少使用的页面换出主存块,腾出地方来调入新页面. 问题描述:一进程获得n个主存块的使用权,对于给定的进程访问页面次序,问当采用LRU算法时,输 ...
- GIT-windows系统下Gitblit的使用方式
GIT-windows系统下Gitblit的正确打开方式 1. 打开页面. 在配置好Gitblit后,打开可视化界面. 2. 创建用户 点击右上角添加用户,进入明细页面,填写常规信息. 创建用户(账号 ...
- 2. Java内存区域
Java 虚拟机的内存模型分为两部分:一部分是线程共享的,包括 Java 堆和方法区:另一部分是线程私有的,包括虚拟机栈和本地方法栈,以及程序计数器这一小部分内存 2.1 程序计数器 程序计数器(Pr ...
- Mysql查询库、表存储量(Size)
Mysql查询库.表存储量(Size) 1.要查询表所占的容量,就是把表的数据和索引加起来就可以了. SELECT SUM(DATA_LENGTH) + SUM(INDEX_LENGTH) FROM ...