使用 XCTest 消除动画障碍

动画效果能够显著提升 app 的用户体验、为用户提供直接操控的感触、以及帮助用户理解其操作在 app 中造成的效果。但如果动画效果出现卡顿，则可能破坏用户体验。了解如何运用 XCTest 侦测平滑滚动及动画效果的终端，并学习如何在 app 用户受到影响前阻止问题发生。

资源

- 高清视频
- 标清视频

相关视频

WWDC21

应用性能终极生存指南

WWDC20

下载

（你好 WWDC 2020）

大家好欢迎来到 WWDC （使用 XCTEST 消除动画障碍）大家好我叫 Tanuja Mohan 是 Apple 公司动力和性能团队的软件工程师动画是我们 app 客户体验中的重要部分动画巧妙多变比如当我们点击后退按钮从一个屏幕切换到另一个屏幕时又可以成为手势的主要焦点比如当我们在 app 上向上或向下滚动时我们希望这些手势能产生流畅的响应因为在长时间浏览期间或滚动出现抖动时就会产生明显感觉

我们将这些用户可感知的抖动称为“障碍” 当帧在屏幕上的出现时间迟于预期时就会出现障碍从而分散了用户的注意力并且有损于 app 的感知质量让我们放大 app 的各个帧看看到底是怎么回事如预期那样显示前三帧就会出现列表的渐变移动完美匹配我们手指的移动

但是第三帧仍然留在屏幕上该 app 似乎不再跟随你手指的移动

然后当第四帧显示到屏幕上时列表突然大幅度跳回到你的手指上这不是我们所期望的我们希望避免这种情况出现要理解这里发生了什么首先需要理解帧是如何显示到屏幕上的 iPhone 和 iPad 上的帧通常以 60 赫兹更新每帧的节奏为 16.67 毫秒在 iPad Pro 上可以达到 120 赫兹的更新或者是 8.33 毫秒的步频这种步频由 VSYNCs 表示它是屏幕决定是否将帧交换到显示器上的时间当帧错过预期的 VSYNC 时就会出现障碍障碍的严重程度是通过帧在屏幕的显示延迟来衡量的

在本例中第四帧晚了 16.67 毫秒

有两种方法可以量化障碍（障碍指标）障碍时间是帧在屏幕的延迟显示时间以毫秒为单位我们更倾向于表示为障碍比率即毫秒每秒它是以毫秒为单位的总障碍时间在以秒为单位的其他持续时间中的比例例如在测试的持续期间听起来很复杂我们为什么不直接说掉帧和每秒测量帧数呢？每秒帧数是一个极易偏斜的绝对目标如果你的测试在动画执行期间包含任何休息时间那么每秒帧数则是毫无作用的因为我们不会在休息期间交换任何帧

而且我们经常故意不以最大每秒帧数为目标也许只想以 30 帧每秒的速度运行游戏或者只想以 24 帧每秒的速度运行视频出于功耗和性能的考虑时钟 app 图标上的指针仅以 10 每秒帧数的速度运行

障碍时间的目标始终为零即使考虑到这些因素也是可靠的然而障碍时间并不总是具有可比性的一秒测试的总故障时间不能与十秒测试的总故障时间相比较

通过将障碍比率归一化为每秒测试持续时间中的障碍毫秒数就能得到一个在不同测试中都具有可比性的度量并可用作最终用户影响的近似值对于最终用户的影响以下是我们建议的目标障碍比率并可用于工具之中

每秒不到五毫秒的障碍比率是很好的用户体验在每秒五到十毫秒的范围内用户会开始注意到障碍此时应对这些故障进行调查

在每秒十毫秒或更多的情况下障碍会使用户分心我们应该立即采取行动来解决它们在 iOS14 中你可以使用我们的工具套件来跟踪你的开发和生产工作流中的障碍 XCTest 框架允许你在单元测试和用户界面测试中直接收集障碍和动画数据而 MetricKit 和 Xcode Organizer 则允许你访问来自客户的性能指标在这一部分的讨论中我们将重点讨论使用性能 XCTests 捕捉障碍的开发工作流如果你想了解如何查看生产工作流中的障碍请查看我们为 MetricKit 和 Xcode Organizer 提供的单独讲座（METRICKIT 中的新增功能）（诊断 XCODE ORGANIZER 的性能问题）在 Xcode11 中我们介绍了 XCTMetrics 这些指标指定了你想要在测试中测量系统的部分我们现在可用的 XCTMetrics 允许你测试时钟时间中央处理器利用率、内存使用、 os_signposts、存储容量而在 XCode 12 中我们有单独的指标来测量 app 启动时间我们也有模板供你编写自己的自定义指标

在本次讨论中我们将重点讨论 XCTOSSignpostMetric 它是用于做动画性能测试的 XCTMetric

从 Xcode11 开始你可以使用 XCTOSSignpostMetric 来测量 os_signpost 间隔的持续时间而在 Xcode12 中使用动画 os_signpost 间隔不仅能收到持续时间而且还收到三个与障碍相关的指标帧速率和帧数

你可能已经熟悉帧速率和帧数这两个值分别测量显示到屏幕的帧数和频率

现在你也很熟悉障碍了你可以跟踪测试代码块中发生的障碍次数在测试中发生障碍的总持续时间以及该总障碍时间与测量代码块持续时间的比率

要收集这些指标首先需要检测代码以发出 os_signpost 间隔有三种方法可以做到这一点我们将它们称为非动画间隔仅返回持续时间的间隔以及动画间隔返回附加动画指标的间隔在 Xcode11 中你只能使用“begin”和“end”接口检测非动画 os_signpost 间隔只能返回持续时间

那么在 Xcode12 中要指定动画 os_signpost 间隔你只需使用 animationBegin 接口只需做此更改你就可以转换任何现有的检测以发出动画间隔并接收回前面提到的动画指标

除了使用自定义时间间隔外也可以使用预定义的 UIKit 检测间隔之一来测试浏览转换和滚动这些是 XCTOSSignpostMetric 类上提供的子指标让我们来看看使用其中一个子指标编写测试的示例这里有一个性能 XCTest 它将启动我的 app 点击“Meal Planner”单元然后向上轻扫 foodCollection 视图接着向下滚动

在此测试中我指定要测量滚动减速度子指标

在测量块的主体中我向上轻扫现在有了 Xcode12 你就可以自定义滚动的速度

这个测试到目前为止看起来还不错但是我们可以改进一下请记住在默认情况下指标块将运行五次以收集性能度量值这意味着在当前实现中我们要背靠背地向上轻扫五次并且很可能在每次迭代中滑动不同的内容

为了避免这种情况我们希望在运行之间重置 app 状态我们可以通过使用 XCTMeasureOptions 让指标块知道我们将手动停止指标集合然后将其传递到指标块调用 stopMeasuring 然后重置 app 状态编写好测试之后就可以开始运行但在此之前我们首先要修改测试方案中的一些设置以消除它们对性能测量的影响首先我们要确保使用单独的性能测试方案 XCTESS

然后选择发布构建配置并禁用调试器

还需禁用自动截图收集关闭代码覆盖率

最后要关闭所有诊断选项这些是运行时净化下列出的选项运行时 API 检查和内存管理现在我们可以运行性能 XCTest 并在用户界面报告中查看结果在下拉列表中我们可以看到新的动画指标让我们选择 Hitch Time Ratio 指标

然后就能看到收集了五个迭代的测量值

并得到了平均 1.2 毫秒/秒的障碍时间比

下一步我们可以将 1.2 ms/s 的平均值设置为基线以便将来该测试的任何运行都将与该基线值进行比较

让我们看一个例子看看在代码库中可能会遇到的障碍以及该如何使用性能 XCTest 来防止它发送给你的客户

假设我是一家餐饮策划公司的 app 开发人员该公司希望支持在线订餐和送货到目前为止我已经实现了可用的不同菜单项的视图

下一步我想通过加入不同菜肴的图像来让我的食物更有吸引力在我开始编写这个新特性之前我想衡量一下现在的动画表现所以我可以用它作为基线以便在添加特性之后进行比较

我已经为我的性能测试设置了一个单独测试方案并将设置配置为我们前面谈到的内容现在开始编写测试了

正如我们之前看到的我要启动 app 点击 Meal Planner 单元并测量滚动动画性能

我已经预先运行了这个测试现在来看看测量结果

看来没有任何问题我们的动画表现也和预期的一样让我们继续添加新特性

首先我要将图像视图设置为包含我已经预先包含在项目中的图像

其次我将缩放这些图像使它们与我的 app 尺寸匹配

现在我们可以继续并重新运行性能测试

请注意当使用 XCTOSSignpostMetric 时测量块将侦听检测的 os_signpost 间隔何时在代码块中发出并仅收集在此间隔内执行的代码指标另外需要注意的是测量块支持侦听多个不同的 os_signpost 间隔例如你可以在调用 swipe up 的同一代码块中同时监听滚动减速和滚动拖动 os_signpost 间隔让我们提前完成这个测试

看来障碍增多了我们应该立即进行调查

看起来问题就在 scaleAspectFit 调用中我们正在主线程上重绘图像主线程负责渲染用户界面的其余部分我们使用的是 CPU 它能创建新的像素和分配内存

我们可以通过使用核心动画的 setContentMode 来减少这种影响它将把重绘这些图像交给图形处理器可允许我们使用现有的图像像素以减少在主线程上所做的工作量

我们可以再次重新运行性能 XCTest 看看是否解决了问题

我们可以确认动画指标现在报告为零障碍性能又回到了我们的期望值

使用性能 XCTest 让我们看到新特性可引起回归给了我们机会去进行修复现在我们的特性已经准备好与我们的客户见面了

让我们复述一下所讨论过的内容我们了解到当帧在屏幕上的出现时间迟于预期时就会发生障碍我们可以使用所推荐的 “良好”“警告”和“严重”类别来量化这些障碍

然后我们了解到可以使用性能 XCTest 来捕捉开发工作流中的障碍通过使用 UIKit 或自定义动画 os_signpost 间隔就可实现这一点我们还谈到了最佳做法其中包括在迭代之间重置 app 内容以及配置方案设置以防止误差有了这些知识你现在就可以防止代码库中的障碍并为客户提供流畅的动画体验感谢你的聆听我们希望你参会愉快

6:35 - Create an animation os_signpost interval

os_signpost(.animationBegin, log: logHandle, name: "performAnimationInterval")
os_signpost(.end, log: logHandle, name: "performAnimationInterval")

6:55 - Use a UIKit instrumented animation os_signpost interval

extension XCTOSSignpostMetric {
     open class var navigationTransitionMetric: XCTMetric { get }
     open class var customNavigationTransitionMetric: XCTMetric { get }
     open class var scrollDecelerationMetric: XCTMetric { get }
     open class var scrollDraggingMetric: XCTMetric { get }
}

7:12 - Measure scrolling animation performance using a Performance XCTest

// Measure scrolling animation performance using a Performance XCTest
func testScrollingAnimationPerformance() throws {
    app.launch()
    app.staticTexts["Meal Planner"].tap()
    let foodCollection = app.collectionViews.firstMatch
    
    measure(metrics: [XCTOSSignpostMetric.scrollDecelerationMetric]) {
        foodCollection.swipeUp(velocity: .fast)
    }
}

8:02 - Reset the application state between runs

func testScrollingAnimationPerformance() throws { 
    app.launch()
    app.staticTexts["Meal Planner"].tap()
    let foodCollection = app.collectionViews.firstMatch

    let measureOptions = XCTMeasureOptions()
    measureOptions.invocationOptions = [.manuallyStop]
        
    measure(metrics: [XCTOSSignpostMetric.scrollDecelerationMetric],
            options: measureOptions) {
        foodCollection.swipeUp(velocity: .fast)
        stopMeasuring()
        foodCollection.swipeDown(velocity: .fast)
    }
}

正在查找特定内容？在上方输入一个主题，就能直接跳转到相应的精彩内容。