2天时间,聊今年最热的 Agent、上下文工程、AI 产品创新等话题。2025 年最后一场~ 了解详情
写点什么

Flutter 线上代码覆盖率解决方案——FlutterCodeX

  • 2020-05-14
  • 本文字数:2596 字

    阅读完需:约 9 分钟

Flutter线上代码覆盖率解决方案——FlutterCodeX

背景

近年来,闲鱼旧业务在 Flutter 架构升级下,大量页面通过 Flutter 开发实现。业务不断迭代,包体积也随之增大,闲鱼 Android、iOS 安装包大小较去年有较大增加,其中,Flutter 在闲鱼包体积中占比 20%,闲鱼开发逐步需要考虑进行 Flutter 侧工程治理。Flutter 官方也在为包大小不断努力,致力于降低打包产物的大小,但仍未有成熟方案。因此现阶段,我们可以考虑如何将无效代码下线。


通过人工梳理的方式,依赖于开发人员的业务熟悉程度,难免疏漏。我们需要有准确的的线上代码覆盖率,作为数据依据,推动业务进行行之有效的代码下线。


本文为您介绍,Flutter 的线上代码覆盖率解决方案——FlutterCodeX。针对类级别编译时代码插粧,运行时后台数据聚合,进行数据采集上报,获得最终代码覆盖率数据,推动废弃业务下线,达到包体瘦身,对工程健康做长效监控与改善。


插桩方案探索

在线上代码覆盖率的统计中,问题的难点主要在于,如何准确判断类,是否被调用过?一般人会马上可以想到,只需要在每个类初始化时,加入一段代码,标记该类已经被调用,最快的就是构建函数中添加,但成本极高,有没有自动化、无侵入的插桩方案呢?以下从 iOS、Android、Flutter 不同的插桩方案进行简单的对比。


iOS


iOS 中,ObjC 首次调用类初始化时,+initialize 被执行,系统会自动标记已被调用,在 metaClass 的 data 的 flags 字段中的 1<<29 位的这个 bit RW_INITIALIZED,就记录着类是否 initialize。可以通过判断类是否被初始化,因此在运行时,找到合适的时机,遍历所有类,进行数据的聚合上传。


static BOOL MOCClassIsInitilatized(Class cls) {void*metaClass = (__bridge void*)object_getClass(cls);class_rw_t*rw = *(class_rw_t**)((uintptr_t)metaClass + 4* sizeof(uintptr_t));if(((class_rw_t*)((uintptr_t)rw & FAST_DATA_MASK))->flags & RW_INITIALIZED) {return YES;}return NO;}
复制代码


Android


Android 中,Java 语言可以不需要侵入原有代码,以添加静态代码块的形式添加插桩代码,buildscript 增加编译插件,在编译时遍历所有类文件进行代码插入即可。


publicclass A {static{// todo report class A initialize}}
复制代码


Flutter


Flutter 与 Android、IOS 的方案均有一定差异,Dart 没有 Java 的静态代码块,也没有类似 ObjC 的系统标记。在什么地方插桩,可以不侵入原有代码呢?


理论上,Dart Class 初始化执行顺序为:


  1. class variables initialize on declaration (no static)

  2. initializer list

  3. superclass’s constructor

  4. main class’s constructor


改写构造函数会直接侵入原有代码,Dart 构造函数的多样写法也增加了自动化插件的难度。因此改写构造器不是第一选择。根据初始化执行顺序,很快可以想到,是否可以增加新的类成员,初始化时调用插桩代码,以达到类初始化插桩的效果。例如


class A {bool isCodeX = ReportUtil.addCallTime('A');// ...biz}
复制代码


但在 Dart 中,针对拥有常量构建器的类,要求所有的成员均为 final,成员初始化必须在第 1 第 2 阶段,或构造函数入参进行初始化,即使是 extends、with 也强制要求子类及 Mixin 所有的变量均为 final。而 Flutter 中,Widget 等常用组件,均使用常量构建函数,无法通过这种形式插桩。


class A {final num x, y;const A(this.x, this.y);}
复制代码


注入代码的形式不可用!


还有其他办法吗?可不可以通过 AOP 的方式,hook 住所有的类构建器呢?而闲鱼技术团队刚刚开源的 AspectD,恰好可以解决这个问题。


AspectD 是针对 Dart 的 AOP 编程框架,通过 Transform 实现 dill 变换以实现 AOP,可以便捷地实现无侵入代码自由注入。


在 Flutter v1.12.13 下验证,针对常量构建器、无构建函数、命名为 ClassName.identifier 形式构建函数,均测试通过!AspectD 代码如下:


@Aspect()@pragma("vm:entry-point")classCodeXExecute{@pragma("vm:entry-point")CodeXExecute();
@Call("package:flutter_codex_demo/test.dart", "A", "+A")@pragma("vm:entry-point")void _incrementA(PointCut pointcut) { pointcut.proceed();// todo report class A initialize}}
复制代码


AspectD 原理不在此详细说明,有兴趣请移步https://github.com/alibaba-flutter/aspectd

整体方案设计

FlutterCodeX 线上代码覆盖率 SDK,由编译时代码插桩插件、运行时数据采集模块组成。



  • 代码插桩插件


编译时,通过 build_runner,CodeXGenerator 与 CodeAstVisitor 进行工程内所有类 ast 解析,遍历所有类构造函数,自动生成 AspectD 的 PointCut Execute 类文件,hook 类构建函数,在构造函数执行完毕后,插桩标记类调用信息,同时还生成项目的完整类列表至构建产物。关键代码如下:


CodeAstVisitor:
// visit all classvoid visitClassDeclaration(ClassDeclaration node) {SourceNode sourceNode = SourceNode(source_path, node.name?.name); node.members.forEach((ClassMember member) {// find all constructorif(member isConstructorDeclaration) {String constructorName = member.name?.name;if(constructorName == null|| constructorName.isEmpty) {// ClassName Constructor constructorName = sourceNode.name;} else{// ClassName.identifier Constructor constructorName = (sourceNode.name ?? '') + "\\."+ constructorName;} sourceNode.constructor.add(constructorName);return;}});
CodeXGenerator.collector.codeList[sourceNode.key()] = sourceNode;}
复制代码


AspectD Execute 如下图所示,类 A 拥有两个构造函数,生成两个 AspectD AOP 函数。



  • 运行时数据采集模块


运行时,工程中每个类初始化后将会自动调用 addCallTime 方法,将类调用信息缓存,选择用户退出后台的时机,进行数据文件进行压缩上传,目前我们采用阿里云 OSS 文件上传。根据应用活跃用户数,设置采样率,命中至少 5 万用户 UV。


  • 数据汇总与产出


最后,线上运行一段时间后,我们将数据汇总,与打包构建产物中的完整类列表进行比对,即可获得线上代码覆盖率数据,推动业务进行行之有效的瘦身。


以简单 Demo 工程为例:


说在最后

目前,FlutterCodeX 在闲鱼 App 即将上线,结合客户端 Android、iOS 代码覆盖率数据,有效地推动废弃业务下线,助力包体瘦身,对工程健康做长效监控与改善。


本文转载自公众号闲鱼技术(ID:XYtech_Alibaba)。


原文链接


https://mp.weixin.qq.com/s/VkjhTSKPpEZVYYsvcLsxCA


2020-05-14 14:062846

评论

发布
暂无评论
发现更多内容

高频js手写题之实现数组扁平化、深拷贝、总线模式

helloworld1024fd

JavaScript

【专项测试系列】-缓存击穿、穿透、雪崩专项测试

京东科技开发者

缓存 测试 缓存穿透 缓存击穿 缓存雪崩

Fiori Elements 应用进行二次开发的一个具体案例分享

汪子熙

SAP Fiori ui5 Web应用 11月月更

react源码中的fiber架构

flyzz177

React

记一场vue面试

bb_xiaxia1998

Vue

掌握这些前端手写面试题能进大厂吗

helloworld1024fd

JavaScript

「Go易错集锦」如何正确设置枚举中的零值

Go学堂

golang 程序员 个人成长 枚举 11月月更

阿里Redis最全面试全攻略,读完这个就可以和阿里面试官好好聊聊

钟奕礼

Java java程序员 java面试 java编程

react源码中的hooks

flyzz177

React

vue为什么v-for的优先级比v-if的高?

bb_xiaxia1998

Vue

全国独家 | 上海线下面授大规模敏捷LeSS认证 | 2022年12月8-10日

ShineScrum

less 大规模敏捷 LeSS认证 吕毅老师

阿里云架构师张先国:揭秘ECS倚天实例背后的技术

云布道师

算力 云栖大会 倚天实例

详解Native Memory Tracking之追踪区域分析

华为云开发者联盟

开发 内存 华为云

前端面试被问到的js手写面试题汇总

helloworld1024fd

JavaScript

react源码中的协调与调度

flyzz177

React

CQRS与Event Sourcing

胖子笑西风

架构 DDD CQRS Event Sourcing #java

SpringBoot 接口层统一加密解密

小小怪下士

Java 程序员 springboot

PGL图学习之图神经网络GNN模型GCN、GAT[系列六]

汀丶人工智能

图神经网络 11月月更

年搜索量超7亿次背后:这款APP用火山引擎 DataTester 完成“数据驱动”

字节跳动数据平台

大数据 数据分析 A/B测试

谈谈前端应用里图标(Icon)的渲染和内容提取方式

汪子熙

前端开发 SAP ui5 Web应用 11月月更

腾讯二面vue面试题总结

bb_xiaxia1998

Vue

云安全系列3:如何构建云安全策略

HummerCloud

云计算 数据安全 云安全 11月月更

《关键信息基础设施安全保护要求》于明年五月正式实施

行云管家

网络安全

vue组件通信6种方式总结(常问知识点)

bb_xiaxia1998

Vue

面试官:请实现Javascript发布-订阅模式

helloworld1024fd

JavaScript

Kata3.0.0 x LifseaOS x 龙蜥内核三管齐下!带你体验最新的安全容器之旅

OpenAnolis小助手

容器 云原生 内核 龙蜥社区 袋鼠RunD

DDD与应用架构

胖子笑西风

架构 DDD 框架 整洁架构 Java core

浅谈深度学习中的概率

华为云开发者联盟

人工智能 华为云

注意 ! !|95% 的应用程序中发现错误配置和漏洞

SEAL安全

配置管理 软件供应链安全 漏洞管理

《全国一体化政务大数据体系建设指南》发布,隐私计算将如何发挥作用?

洞见科技

Go类型转换和类型断言可别搞混了

王中阳Go

golang 高效工作 学习方法 面试题 11月月更

Flutter线上代码覆盖率解决方案——FlutterCodeX_开源_君爱_InfoQ精选文章