跨平台高手必修课--Flutter动态化解决方案实战[完结14章]

贾元春
• 阅读 22

虽然 Flutter 的成长曲线和未来前景看起来都很好,但不可否认的是,目前 Flutter 仍处在发展阶段,很多大型互联网企业都无法毫无顾虑地让全线 App 接入,而其中最主要的顾虑是包大小与动态化。(安装包下载:/s/1XaCF_QAYsQtszdpW3tXIvA 提取码: aeiu) 动态化代表着更短的需求上线路径,代表着大大压缩了原始包的大小,从而获得更高的用户下载意向,也代表着更健全的线上质量维护体系。当明白这些意义后,我们也就不难理解,在 Flutter 的应用与适配趋近完善时,动态化自然就成为了一个无法避开的话题。RN 和 Weex 等成熟技术甚至让大家认为动态化是跨端技术的标配。

一、什么是动态化? 目前移动端应用的版本更新, 最常见的方式是定期发版,无论是安卓还是iOS,都需要提交新的安装包到应用市场进行审核。审核通过后,用户在应用市场进行App的下载更新。而动态化, 就是不依赖更新程序安装包, 就能动态实时更新页面的技术。

二、动态化的必要性 为什么需要动态化技术呢? 因为上述定期发版更新应用的方式存在一些问题,比如: 1、审核周期长, 且可能审核不通过。 周期长导致发版本不够灵活, 紧急的业务需求不能及时上线。 2、线上出现急需修复的bug时,需要较长修复周期,影响用户体验。 3、安装包过大, 动辄几十兆几百兆的应用升级可能会让用户比较抗拒。 4、即使上线了,也无法达到全部用户升级, 服务端存在兼容多版本App的问题。

三、Flutter的动态化可以通过在Flutter应用程序中集成可编程的UI组件来实现,例如将Dart代码作为字符串从服务器端下载并评估,从而生成新的UI元素。下面是一些设计思路和代码实现: 1、使用Flutter的自定义渲染器(Custom Renderer):您可以编写一个自定义渲染器,该渲染器将解析从服务器或其他来源下载的UI描述,并使用Flutter Framework API构建UI元素。这种方法需要更多的开发工作,但它提供了更大的灵活性和控制权。 2、使用Flutter Widget树序列化:Flutter Widget树可以序列化为JSON格式,并可以发送到移动设备上的Flutter应用程序。您可以使用此功能,从远程服务器下载UI树并将其反序列化为真实的Flutter组件树。 3、使用Flutter插件:在Flutter中,插件是一个独立的、客户端库,在Flutter应用程序中运行。您可以编写一个插件,使其可以从云服务器下载所有UI元素并展示给用户

四、实现思路 按道理iOS上也可以采取跟Android同样的思路,但是由于苹果开发者协议的规定,不允许动态更新、运行可执行代码;所以在Flutter资源的处理上,我们可以采用同Android一样的思路,但是对代码的处理,我们需要寻找新的方案。回顾之前的这些跨端方案,我们可以参照RN的实现,只不过N不再是Native了,而是Flutter。RN是通过JS控制Native渲染,我们要实现的是通过JS控制Flutter渲染。

五、Flutter发展前景 随着移动应用市场的不断扩大,跨平台开发框架的需求也越来越大。Flutter框架可以帮助开发者在不同平台上快速开发高质量的移动应用程序,这种趋势将进一步推动Flutter的发展和普及。

作为一名Android开发工程师,学习Flutter框架是非常有必要的。因为现在的前端开发已经不仅仅局限于网页开发,而是需要涉及到多个平台的应用开发。如果掌握了Flutter框架的开发技能,就可以更好地满足前端开发的多样化需求。

从19年过去的几年时间,Flutter在Google带领各大厂商的引领下,飞速发展。flutter sdk官方也在快速的迭代升级,从1.0到现在的3.1,从底层引擎到适配层再到框架层都有比较大的更新。

六、Flutter动态化解决方案的两种方法:

  1. 热重载(Hot Reload): 热重载是Flutter框架的一项独特功能,它允许开发者在应用运行时快速预览代码更改的效果,而无需重新启动整个应用。热重载使开发人员可以实时查看界面、布局和功能等变化,并立即在应用中看到这些变化的效果。

  2. 插件化(Flutter Plugin): 插件化是一种在Flutter应用中集成动态化插件的方法,可以在应用运行时动态加载新的功能模块或代码。开发人员可以编写自定义插件,将其集成到应用中,以实现动态化更新和扩展功能的目的。

七、动态化方案调研 在Flutter实践层面,简单来说分为三个流派: 方案一:JavaScript是最好的语言( 碰瓷PHP) 主要思路:利用Flutter做渲染,开发使用js,逻辑层通过v8/jscore解释运行。代表框架是腾讯的MXFlutter。这个框架是开源的,大写的 。 方案二:DSL + JS 主要思路:基于模板实现动态化,主要布局层采用Dart转DSL的方式,逻辑层使用JS。代表框架是58同城开源的Fair。 方案三:布局,逻辑,一把梭 主要思路:与方案一最主要的区别是,逻辑层也是使用dart,增加了一层语法解析和运行时。有一个代表,美团的MTFlutter,然而没有开源动向,无从考察更多。

点赞
收藏
评论区
推荐文章
浩浩 浩浩
3年前
Flutter 2.0 下混合开发浅析
多余的前言Flutter2.0发布时,其中最受大家关注之一的内容就是AddtoApp相关的更新,因为除了热更新之外,Flutter最受大家诟病的就是混合开发体验不好。为什么不好呢?因为Flutter的控件渲染直接脱离了原生平台,也就是无论页面堆栈和渲染树都独立于平台运行,这固然给Flutter带来了较好的跨平台体验
Stella981 Stella981
2年前
Flutter 不一样的跨平台解决方案
本文主要介绍Flutter相关的东西,包括Fuchsia、Dart、Flutter特性、安装以及整体架构等内容。1\.简介Flutter作为谷歌最近推出的跨平台开发框架,一经推出便吸引了不少注意。关于Flutter,目前我们知道它是一个跨平台开发框架。但是它本身并不止于此,例如Fuchsia、Dart等,我们也都需要去了解。
Stella981 Stella981
2年前
Flutter Dojo的设计之道
认识Flutter是在18年,移动端开发日趋成熟的情况下,很多开发者都在寻求跨平台开发的终极法门,在经过了webview、RN的痛苦之后,Flutter的出现,给跨平台开发带来了一线曙光。自此,便开始了Flutter的学习之路,布道师之路,修仙之路。筑基Flutter的学习曲线很奇怪,像坐过山车一样,初学很简单,上手几天,很快就能写一些基本的界
贾蓁 贾蓁
5个月前
Flutter 移动应用开发实战(开发你自己的抖音APP)
Flutter移动应用开发实战(开发你自己的抖音APP)download》http://quangneng.com/4221/Flutter是一种用于开发高性能、跨平台应用的框架,可以用于开发移动应用。通过Flutter,开发者可以使用统一的代码库构建iO
邢德全 邢德全
4个月前
Flutter高级进阶实战 仿哔哩哔哩APP
Flutter高级进阶实战仿哔哩哔哩APPdownload》chaoxingit.com/1300/一、项目背景与目标平安吉祥过大年项目背景:Flutter框架:项目基于Flutter框架,这是一个由Google开发的UI工具包,用于在多个平台上构建跨平台
笑面虎 笑面虎
3个月前
跨平台高手必修课--Flutter动态化解决方案实战
跨平台高手必修课Flutter动态化解决方案实战Flutter动态化Flutter动态化是一个复杂的主题,它涉及到使用Flutter框架去加载和运行动态生成的代码或者是在运行时更改UI。目前Flutter生态中没有完全成熟的动态化方案,但是有一些实验性的项
马尚 马尚
6天前
[完结14章]跨平台高手必修课--Flutter动态化解决方案实战
一、Flutter是什么?Flutter(安装包下载:panbaiducom/s/1aezDGX8g0UrQKB9JGPwKYA提取码:a2ky)是一种开源的跨平台UI(用户界面)开发工具包,由Google主导研发。它使用Dart编程语言编写,并允许开发者
贾蓁 贾蓁
5个月前
2021升级版Flutter从入门到进阶 实战携程网App(20章全)
2021升级版Flutter从入门到进阶实战携程网App(20章全)Flutter从入门到进阶:实战携程网Appdownload》http://quangneng.com/1248/随着移动互联网的快速发展,Flutter作为一款高性能的跨平台开发框架,越
贾蓁 贾蓁
5个月前
2021升级版Flutter从入门到进阶 实战携程网App(20章全)
2021升级版Flutter从入门到进阶实战携程网App(20章全)Flutter从入门到进阶:实战携程网Appdownload》http://quangneng.com/1248/随着移动互联网的快速发展,Flutter作为一款高性能的跨平台开发框架,越
贾元春
贾元春
Lv1
青春就是,不屈服,不媚俗,向着阳光,野蛮生长。
文章
2
粉丝
0
获赞
0