动态化代表着更短的需求上线路径,代表着大大压缩了原始包的大小,从而获得更高的用户下载意向,也代表着更健全的线上质量维护体系。当明白这些意义后,我们也就不难理解,在 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,然而没有开源动向,无从考察更多。