乐趣区

关于网络:从零到一了解APP速度测评

作者 | 龙霸天

一、引言

为了晓得「为什么会打雷下雨」,咱们拿起了手机,应用百度 APP 进行搜寻:

小小的一个搜寻诉求,却须要经验一个不短的交互过程。就跟去银行办业务一样,只想改个银行预留手机号,却要:扫核酸码进场,取号,等号,沟通,办理,实现。

交互过程中的任何一个过长的期待,都可能会导致用户散失,以下咱们列举了几个常见的 APP 交互慢导致用户散失的场景:

△启动 APP 如果要好几秒,用户下一次可能会抉择间接应用原生浏览器

△点击搜寻良久才出搜寻后果,用户下一次很可能会抉择竞品搜索引擎

△查看一个内容,如果资源关上迟缓,用户下一次可能就去垂直 APP 找答案了

△你是不是也曾被关上迟缓的衰弱码困扰?

速度是影响用户存留的关键因素 。BBC 发现他们的网站加载工夫每减少一秒,就会失去 10% 的用户;Pinterest 将感知等待时间缩小了 40% 后,来自搜索引擎的流量和注册量减少了 15%……

速度意味着进步转化 。Lazada 将页面 LCP 晋升 3 倍后,转化率晋升了 16.9%;GYAO 将页面 LCP 晋升 3.1 倍后,广告点击率减少了 108%;……

(数据起源:https://web.dev/why-speed-mat…)

速度如此重要,所以咱们常常须要对 APP 的要害场景进行速度评测,以实现两个目标:

  1. 防劣化 :避免 APP 本人自身速度劣化,以继续给予用户最好的交互体验;
  2. 看差距 :致力提供比竞品 APP 更好的性能体验,以留存用户,进步转化。

须要留神的是:APP 速度评测,不关注交互过程中 APP 发动了多少后端申请,启动了多少个过程,每一个工作解决耗时多久,CPU/ 内存损耗,渲染是否抖动,过程是否晦涩,而只关注用户同 APP 的交互速度,也就是用户给 APP 一个输出信号,APP 的反馈响应速度。

而本文次要讲述了三种 APP 速度评测的手法。

二、基于日志打点的 APP 速度评测

手法概述 :在 APP 的要害节点进行「日志打点」,再通过日志数据统计分析,失去感兴趣的速度指标。

以下,举一个比拟好的例子来阐明下。

如图所示,是百度贴吧智能小程序的一次调起过程,从小程序开始加载(Loading)、到 APP 开始初步绘制小程序外框架(FP),到第一次内容出现(FCP),再到整体页面成型(FMP),最初达到可交互状态(TTI)。

智能小程序生态冀望小程序开发者能够关注小程序性能,从而让小程序领有更好的用户体验,因而冀望为各个小程序的开发者提供各页面启动场景的上屏时长,从而让开发者理解现状,助力其优化小程序性能体验。

智能小程序生态有数十万小程序,一个一个帮开发者评测速度显著不大事实,因而抉择了「基于日志打点的评测手法」。

通过在小程序外围框架进行日志打点失去「小程序启动工夫」及「小程序页面内容超过一屏时刻」,并定义两者工夫距离为小程序调起的上屏时长,通过日志数据统计分析后提供给小程序开发者。

该手法的长处在于:

  1. 老本较低
  2. 容易施行
  3. 后果基于线上日志数据抽样统计生成从而更贴近整体状况

但同时也存在一些问题:

  1. 日志打点仅能针对自家 APP,因而无奈通过这种形式实现竞品 APP 的速度评测,无奈获悉同竞品 APP 的速度差距。
  2. 受限于所评测业务场景的各种异步数据申请动作,在各阶段进行日志打点以精确捕获对应时刻在实际操作中并不容易,且为了避免对业务自身性能影响,大多时候只能做简略采集,未必能失去最贴近用户观感的速度指标。

因而,为了能更好刻画用户间接观感,咱们往往会偏向于采纳人工评测的手法。

三、人工伎俩的 APP 速度测评

手法概述:人工操作 APP,全程摄像头录屏,预先对录屏做分帧解决,而后人工寻找要害节点帧,统计得出相应速度指标。

以下,持续举例子来阐明。

如图所示,是百度 APP 的一个搜寻过程,咱们冀望失去「点击搜寻」按钮到「搜寻后果页」齐全渲染的过程工夫。

点击搜寻按钮到搜寻后果页实现渲染的过程很短(百毫秒级),要人工观测这个操作过程时长不大事实。

因而咱们应用摄像头对操作过程全程录屏并把录屏存到电脑。

△摄像头全程录屏

接着,咱们应用视频分帧工具对录屏按肯定帧率进行分帧,而后人工寻找「点击搜寻按钮」的那一帧及「后果页齐全渲染」那一帧,最初取两个帧的工夫距离作为本次搜寻工夫。

△多 APP 混合评测失去比照后果

该手法的长处在于:

  1. 能够采集到最贴近用户观感的速度指标
  2. 能够做竞品比照

但同时也存在一些问题:

  1. 整个过程充斥着大量反复而又干燥的过程,极其耗时、极其消耗精力,十分低效。参考既有人效数据:人工评测一个简略场景就要消耗
    3 天,简单场景能够达到半个月,而如果想要做到更准确的多地区多用户笼罩的话,周期能够长达两个月。
  2. 人工评测过程失去的数值会受评测时网络、设施状态等影响,且采样数量十分无限,故不能应用绝对值作为间接后果,而只能用于竞品比照或者版本间比照

如果一件事件做起来老本较高,即便它对产品有所增益,思考性价比,咱们也会抉择不做或者少做。

低效的伎俩让大部分业务望而生畏,因而常将性能评测周期缩短到一个季度甚至半年一次。

为了升高人工评测老本,自动化评测应运而生。

四、自动化驱动 APP 速度评测

手法概述:通过自动化伎俩操作 APP 并全程录屏,预先对门路进行分帧并经算法找到指标关键帧,最初通过统计学手法计算相应速度指标。

回顾整个人工评测过程,其实也就三个步骤:

  1. 操作 APP 实现交互同时全程录屏(有时也会间接采纳手机的零碎录屏工具间接录屏)
  2. 对录屏进行分帧解决,并在分帧里人工找寻首尾帧
  3. 反复 n 次,按肯定统计学手法取均值

拆解后,能够发现,只有三个外围能力,便能实现自动化:

  1. 自动化操控手机的能力
  2. 全程录屏的能力
  3. 自动化找寻首尾帧的能力

自动化操控手机实现交互的开源工具有很多,比方:Appium、Adb、WDA、Uiautomator2、Tidevice 等。

自动化进行手机录屏的开源工具也有:scrcpy、minicap 等。

值得一提的是,自动化找寻首尾帧在市面上并没有现成通用的工具,须要依据交互场景的不同及事实限制性条件去设计,一般来说都须要动用到计算机视觉相干算法。为了不便大家了解,这里举几个例子:

例子 1 :咱们在 Android 设施上开启了「显示指针地位」,这样当咱们操作手机的时候,都会在手机上留下一个「十字锚点」。如此,针对于 Android 设施以某个点击动作为开始的交互场景,咱们就能够把「找寻首帧」问题转换成找寻带有「十字锚点」帧的问题。接着应用计算机视觉算法找寻十字锚点帧,便能实现首帧自动识别。

△Android 设施开启「显示指针地位」,将找寻首帧问题转换成找寻十字锚点帧

例子 2 :咱们想要获得「搜寻后果页」自点击搜寻到第一个视频卡片的视频启动播放的过程耗时。视频启动播放的标识是左下角呈现一个「开启声音的 icon」,因而咱们只有应用计算机视觉算法找寻对应 icon 图标呈现帧,便能实现该交互场景的尾帧自动识别。

△通过应用特定图像作为锚定物,将找寻尾帧问题转换成图像查找问题。

自动化评测手法相比于人工评测长处在于:

  1. 极大升高了人力耗费
  2. 极大晋升了评测效率

咱们冀望通过自动化来升高评测老本,但自动化自身也带来了额定的老本和问题:

  1. 自动化用例编写的难易度、上手老本及可持续性等
  2. 自动化执行的稳定性及置信度
  3. 首尾帧辨认算法的定制化开发成本及准确率问题

因而,咱们开发了一个名为 LazyPerf 的 APP 速度评测工具,冀望可能通过一体化的解决方案让整体评测老本有量变的降落。

五、APP 速度评测工具 LazyPerft

整个工具外围围绕两个方面晋升评测效率:

  • 升高自动化用例的编写老本
  • 升高首尾帧校准的人工成本

5.1 升高自动化用例的编写老本

外围点 1:咱们采纳了「基于真机操作录制用例」的手法来编写自动化用例。

益处是:用户只需在手机上轻松一点,便能实现一个自动化用例步骤的录制,上手老本非常低,用例格局对立带来了较好的可持续性,让用户能够将次要精力放在用例的整体设计上。

毛病是:相比于基于脚本代码编写用例,就义了用例编写的灵活性,本来脚本里一个 For 循环就能解决的问题,可能就须要工具破费大量精力去设计较为敌对的用例编写形式。

外围点 2:引入了基于布局的控件寻址形式,升高 UI 部分变动对自动化用例的影响,同时反对依照「模式」来寻址。

页面构造树往往层级深而简短,导致基于 XPATH 的控件寻址时常受 UI 部分内容变动影响较大,进而导致用例执行的不稳固,从而要从新录制用例。

因而,咱们基于 UI 控件布局关系对页面构造树进行了重塑,从新定义了新的控件寻址形式并通过 LazyPerf 来进行组织,以期升高变动带来的影响。

△页面构造树往往层级深而简短

此外,咱们还遇到了一些场景,是没方法通过 XPATH 进行控件寻址的。

举个例子,咱们冀望在百度 APP 的举荐栏目下找寻「百度动静类型卡片」,通过点击这类型卡片看「百度动静页」的启动速度。

遇到的问题是,咱们每次关上百度 APP,举荐栏目的内容是会变动的,百度动静类型卡片呈现在 Feed 流的第几屏、第几个是不确定的,卡片的内容也是不确定的。

这种状况,咱们该怎么进行寻址?

因而,咱们在新型的控件寻址形式上追加设计了一种「基于模式的控件寻址形式」,每一个非叶子控件都会通过子控件的 UI 布局信息生成一个模式属性,由此同种类型的 Feed 卡片便会领有一样的模式属性,这样咱们便能通过模式轻松寻址到咱们所需的特定类型卡片。

△通过「基于模式的寻址」在多屏内轻松找到「百度动静类型卡片」

外围点 3:设计了基于 UI 控件构造树的控件寻址形式,解决局部场景无奈通过零碎工具实现控件寻址的问题。

在实际过程中,咱们发现有一些 APP 页面会因为内容过于丰盛,而没有方法通过 Uiautomator2/WDA 等工具获得控件树,进而使得自动化用例无奈编写。

因而咱们设计了基于 UI 控件构造树的控件寻址形式,应用视觉算法基于手机截图生成 UI 控件构造树供用户编写用例。

同时也反对用户在截图上自定义圈定控件,而后通过 OCR/ 图像查找 / 类似度比对等系列算法组合实现寻址。

5.2 升高收尾帧校准的人工成本

外围点 1:集成各类型场景首尾帧辨认算法,让首尾帧辨认自动化。

咱们采纳了传统 CV 及深度学习计划,形象了 8 套模板,适配 20+ 场景,可能疾速满足用户场景需要,这是性能评测降耗的外围所在。尽管大部分场景咱们能够实现 5 帧差内准确率 90%+,然而依然有很多简单场景是难以实现自动化的,比方「搜寻后果页的划屏起播场景」,咱们想要取得在划动页面的时候,上一个视频进行播放到下一个视频自动播放的工夫距离,因为不好界定锚点所以较难通过算法实现自动识别。

外围点 2:反对单录屏多场景标注。

往往多个场景存在连续性关系。

举个例子:为了在「搜寻后果页」中点击「视频卡片」获得「视频落地页」启动速度,咱们须要冷启百度 APP、点击搜寻框、输出 Query、点击搜寻按钮,最初找寻「视频卡片」并点击。

整个过程至多蕴含了 3 个交互场景,与其离开执行自动化后进行校准,不如间接利用一次自动化录屏进行分场景校准。

外围点 3:十帧校准模式。

在屏幕固定状况下,一个页面展现的帧数越多,帧图片的可见度就越低,在 13.3 英寸 Macbook 屏上咱们发现 10 帧的展现恰到好处。

在 10 帧展现的根底上,咱们发现,如果算法主动校准的帧可能在展现的 10 帧内找到,那么人工校准老本在 10s,如果左右滑动 10 帧能够找到则需 20s,滑动超过 10 帧则需 30s+。

因而,如果算法能实现 5 帧差(算法校准帧离指标帧不超过 5 帧以确保在首屏 10 帧内找到)准确率 100%,那么单次校准的人耗就能维持在 10s(较低成本)。

由此,校准老本的继续升高就可能准确转换为主动校准算法 5 帧差准确率的继续晋升。

六、问题与瞻望

因为咱们是通过一些零碎级的开源工具实现的设施的自动化操控,所以不可避免的,这些工具自身会带来对设施的性能损耗,进而影响评测后果。

尽管咱们能够通过控制变量,以巡回执行模式实现比照测试、叠加统计学手法来将影响升高,然而影响究竟存在。

与此同时,这些开源工具自身也时常受到设施型号、操作系统版本影响而产生各种可用性问题,且局部工具已无人保护。

这些都为自动化评测的可持续性带来了较大的隐患。

但好在这些问题不是不可解决的,业界曾经逐渐诞生出一些通过物理形式进行设施自动化操控的伎俩,所以咱们构想,下一代的自动化评测形式能够是这样的:电脑本地 APP 驱动用例录制及执行;通过单目摄像头感知场景,领导自动化执行,同时全程录屏;双轴导轨确定坐标,竖向点触头操作屏幕……

———- END ———-

举荐浏览【技术加油站】系列:

百度工程师教你玩转设计模式(工厂模式)

揭秘百度智能测试在测试剖析畛域实际

百度用户产品流批一体的实时数仓实际

ffplay 视频播放原理剖析

百度工程师眼中的云原生可观测性追踪技术

应用百度开发者工具 4.0 搭建专属的小程序 IDE

退出移动版