从天猫、美团、去哪儿分析,前端开发者该如何把控移动APP动态化发展(一)?

1,195 阅读7分钟
原文链接: rdc.hundsun.com
6月初有幸参加了由某知名技术社区组织的全球移动技术大会,大会总共历时两天,一共有Native动态化、新技术、性能优化、大前端等等12个专场。而动态化这件事,正是移动设备App当下最热门的话题。动态化,也是一个涵盖了界面,功能,数据,配置诸多方面的一个宽泛话题。那么就让我们来看下各家互联网大厂给我们带来了什么样的动态化解决方案。 
【动态化组件-天猫Tangram 】 Tangram是手机天猫技术团队从手机天猫-首页方案抽象而来,面向组件的界面方案。除了手机天猫首页外,还支撑了天猫App中的天猫直播,我的天猫,猜你喜欢等多个业务,并且在阿里星球等多个阿里系App中有所应用。 
Tangram中文是七巧板的意思,这是一个主要面向运营的动态页面解决方案。重运营的业务特别是天猫这样的电商业务,往往讲究灵活多变,需要对线上业务做实时调整,此类页面动态化的需求便应运而生。Tangram提供了流式布局、滚动布局,瀑布流布局,固定布局等数种布局样式,布局提供样式参数供调整,布局内部也可填充任意的视图(View),使Native开发的页面具备一定的动态性,并提供极致的性能。 
Tangram关注三个重点:面向业务、多端一致性和高性能。 
Tangram旨在提供运营层面的灵活性 
和native的极致性能,技术上的切入点放在了目前native开发的界面灵活性的难点和动态方案目前内存和滑动控制的性能瓶颈这块;同时构建了一整套可运营的页面结构化描述,UED/运营/技术能够在这一套结构描述上达成一致,运营的配置应该是能够脱离开发的,而不是强依赖开发,开发的时间可以投入到通用型的支持和产品扩展上。

tangram在架构上分成了Core、Layout、Helper、Bus、TangramKit五个部分: 
▪ Core,TangramView是整个框架的主入口,同时也提供了回收复用机制。
▪ Layout,主管各容器、组件的摆放和布局。
▪ Helper,提供了基于MVVM架构的数据-数据模型-视图模型-视图之间的转换; 
▪ Bus,整个框架的时间总线,是框架内的通信渠道。
▪ TangramKit,框架的组件库,可以方便的对组件进行扩充。 
整个框架的执行流程如下: ▲小结 
灵活的页面排版布局和流畅的滑动性能是天猫tangram的最大亮点,既解决了使用传统UITableView/UICollectionView/ListView/RecyclerView/GridView布局不够灵活的问题,同时又实现了这些视图回收复用子视图的特性。对于内容较长、布局又相对多变的页面来说是不错的选择,兼具native页面的流畅和不输给H5页面的灵活性。 
不过由于天猫tangram高度面向业务和运营,除了电商首页以外,很难找到类似内容冗长、布局多变的业务场景。虽然其他页面也能用上tangram作为框架,但总有种杀鸡用牛刀的感觉。 

【插件化-360 RePlugin 】 在Android开发领域,有关插件化的讨论一直热度不减。目前市面上的插件化方案虽然很多,但多数只能实现某些功能的插件化,距离开发者的预期尚有相当差距。对此,在GMTC 2017全球移动技术大会上,360手机卫士主程序架构负责人张炅轩宣布,360的插件化框架RePlugin已经可以实现“全面插件化”,同时具有出色的稳定性和灵活性,可适用于各种类型的应用上。 
RePlugin是一套完整的、稳定的、适合全面使用的,占坑类插件化方案,由360手机卫士的RePlugin Team研发,也是业内首个提出“全面插件化”(全面特性、全面兼容、全面使用)的方案。
RePlugin的主要优势有以下几点:
▪ 极其灵活:主程序无需升级(无需在Manifest中预埋组件),即可支持新增的四大组件,甚至全新的插件。 ▪ 非常稳定:Hook点仅有一处(ClassLoader),无任何BinderHook !如此可做到其崩溃率仅为“万分之一”,并完美兼容市面上近乎所有的Android ROM。 ▪ 特性丰富:支持近乎所有在“单品”开发时的特性。包括静态Receiver、Task-Affinity坑位、自定义Theme、进程坑位、AppCompat、DataBinding等。 ▪ 易于集成:无论插件还是主程序,只需“数行”就能完成接入。 ▪ 管理成熟:拥有成熟稳定的“插件管理方案”,支持插件安装、升级、卸载、版本管理,甚至包括进程通讯、协议版本、安全校验等。 ▪ 数亿支撑:有360手机卫士庞大的数亿用户做支撑,三年多的残酷验证,确保App用到的方案是最稳定、最适合使用。 


技术原理 
RePlugin技术架构:

WebView、Download、Share,甚至Protobuf都能成为基础插件。 


RePlugin号称只hook了一处系统调用就实现了插件化。其实现原理简单来说,就是在应用启动的时候,Replugin使用RepluginClassLoader将系统的PathClassLoader替换掉,并且修改了loadClass方法的行为,用于加载插件的类。 


Replugin还提出了“坑位”的概念。所谓坑位就是预先在Host的Manifest中注册的一些组件(Activity, Service, Content Provider,唯独没有Broadcast Receiver),叫做坑位。这些坑位组件的代码都是由gradle插件在编译时生成的,他们实际上并不会被用到。在启动插件的组件时,会用这些坑位去替代要启动的组件,并且会建立一个坑位与真实组件之间的对应关系(用ActivityState表示),然后在加载类的时候RepluginClassLoader 会根据前文提到的被篡改过的行为偷偷使用插件的PluginDexClassLoader加载要启动的真实组件类,骗过了系统,这也是上面提到的唯一hook点的作用。


▲小结

只hook了一处系统API提升了RePlugin的稳定性,同时“坑位”概念解决了以往插件化框架需要在宿主APP内预先给插件组件“埋点”的弊端,此外插件还能脱离宿主独立安装、运行,不得不说360 Replugin是对android插件化技术的一次革命。


虽然插件化能够给APP带来足够的灵活性,理论上所有的功能模块都能够成为独立的安装包,实现用户的按需下载,但不得不说这其中的安全风险,加载外部的可执行代码,一个逃不开的问题就是要确保外部代码的安全性,我们可不希望加载一些来历不明的插件APK,因为这些插件有的时候能访问宿主的关键数据。


本文我们分别介绍了天猫动态化组件-Tangram和360插件化方案-RePlugin从其技术原理、技术架构和各自的优势来展示当前移动APP的动态化发展状况。下文会继续从去哪儿和美团更加深入地介绍移动端技术的发展现状和前景动态。请继续关注!