优酷APP响应式布局之测试方案 | 《优酷响应式布局技术全解析》第七章

简介: 本章介绍 优酷APP响应式布局之测试方案

上一章:优酷响应式在消费场景的落地 iOS | 《优酷响应式布局技术全解析》第六章>>>

作者| 阿里巴巴文娱技术 刘丽琴

响应式布局是在屏幕尺寸发生变化时,APP的页面、组件按照规则进行动态自适应,实现一套代码兼容多尺寸终端设备。响应式技术应用在多端上减少了开发人力投入,但是对于测试来说需要测试的范围相对扩大,要保障多端、多尺寸的APP质量,下面介绍优酷在响应式测试过程中沉淀的测试能力及方法。

一、测试面临的挑战

移动端主要测试类型包括功能测试、性能测试、稳定性测试、兼容性适配测试等,针对响应式测试主要难点在兼容性测试,原因是兼容性测试范围扩大,测试效率面临较大挑战。具体表现在以下几方面:
1)端类型增加,之前关注Phone端即可,现在要关注Phone、Pad、折叠屏、车机大屏
2)组件样式繁多,Phone端组件样式显示一种状态,现在不同屏幕设备、不同状态下组件呈现样式布局会有相应不同
3)系统交互多,包括分屏、浮窗、平行视界、系统转屏设置与响应式交互
4)测试对象多,需要考虑所有的页面、组件、弹窗功能遍历
5)多业务场景交互,比如全屏播放

二、技术实现分析

针对以上挑战,测试团队对优酷全端响应式适配进行深入分析,得出相应的测试点。主要从以下几方面进行分析:

响应式业务流程
image.png

如上图显示,响应式测试分为UI测试和数据处理逻辑测试两部分:

1) UI显示由响应式SDK完成
响应式SDK提供了在不同尺寸设备上通用的响应式能力,在屏幕尺寸发生变化时,页面样式、布局的UI显示也会发生相应的变化,这块主要关注兼容性适配测试。

2)数据处理逻辑由上层业务完成
数据处理主要进行了数据合并、数据过滤、数据映射及数据补全的逻辑处理,重点关注响应式和非响应式下数据处理逻辑的正确性。这块就需要构造各种不同数据进行逻辑覆盖验证。

除此之外,针对业界厂商目前支持的屏幕尺寸变化能力,需要考虑到不同能力下的交互测试:
1)系统支持旋转屏幕设置;
2)Android Pad支持分屏,部分华为Pad支持平行视界能力;
3)iPad支持浮窗、分屏能力。

三、测什么?

由以上的分析结果不难得出测试范围以及主要的测试点,另外一个重要部分,是需要对响应式开关进行测试,已确定及时止损的能力。

1、 测试范围

1)分层:SDK测试、业务层测试;
2)分端:Phone、Pad、折叠屏、车机大屏;
3)分平台:Android、iOS;
4)分能力:响应式开/关;
5)分机型:iPad分屏、浮窗能力,见下表:

image.png

2、 主要测试点

image.png

四、怎么测?

通过对响应式的测试分析,知道了测哪些,下面从功能测试、兼容性测试等方面来阐述怎么测。

1、 功能测试

功能测试主要验证数据处理逻辑在大屏端的正确性。数据处理逻辑主要对组件进行了数据合并、数据映射、数据过滤及补全,针对数据的构造主要通过mock的能力实现,确认大屏端逻辑处理正确。

同时,数据处理逻辑不能影响Phone端的组件页面,这部分测试主要进行回归测试,并且回归量相对较大,为了提高测试效率优酷打造了组件自动化测试方案。

2、组件自动化测试

image.png

该测试借助图像识别,能够很好的规避技术改造的影响,稳定性较好。从以上5个方面解决问题,通过设计测试场景,将线上引流数据清洗后自动构造所需组件数据,自动应用mock数据,基于魔镜算法服务进行相似度+配置化的UI对比。

本次组件测试,覆盖首页/频道页35个组件,正常、异常mock文件500+,dailybuild高频测试,在响应式项目中很好的保证了组件测试的力度和覆盖度。

3、兼容性测试

响应式测试难点在于兼容性测试,这部分要在多端、多系统、多尺寸上验证UI显示,测试工作量较大;针对兼容性测试优酷推出了优化后的兼容性测试方案,包括机型选择和测试平台:

机型选择

image.png

测试平台

为了解决兼容性测试成本问题,针对兼容性测试做了以下改进:

1) 通用脚本降低脚本编写成本、提高执行稳定性、快速开展业务测试
通用脚本基于scheme跳转能力,解决了业务入口触达稳定性问题;提供自动滚屏和基于元素查找的点击功能,还包含通用弹窗处理以及登录功能。

2)长截图能力解决了不同分辨率以及不同物理尺寸下图片验证的难点
长截图实现方式有两种,一种滚屏过程中截长图;一种滚屏截图,最后拼接成长截图能力。

3)图像验证解决人工检测问题
通过图像识别算法,智能筛选出可疑图片,大大减少了人工检测图片数量。

image.png

4、其他测试

1)稳定性测试
大屏端稳定性测试是很有必要的,特别是iPad端低端设备居多并且内存较Phone端也相对低,所以需要考虑这些设备上的稳定性问题。

2)性能测试
响应式方案会显示更多的图片和数据,其数据解析和图片渲染过程会对APP启动和流畅度,内存产生明显影响。

3)数据测试
第一,响应式旋转屏幕时,组件行数列数会发生变化,此时要保证不同数据处理下,埋点数据下发正常:
第二,响应式映射处理的组件埋点数据下发与映射前的组件埋点一致。

五、总结

针对响应式测试在功能测试、兼容性测试方面做了大量的研究,沉淀了组件测试方案和兼容性测试方案,即保障了响应式高质量上线,又提高了测试效率。

后续的响应式测试如何高效支持持续迭代对测试来说是一个新的挑战,主要在两方面:

一是,如何保证开发新的组件支持响应式
建立响应式编码规范,对代码进行静态扫描,对不符合的规范进行告警。

二是,如何高效保障sdk的增量修改的质量
响应式sdk开源后,将脱离APP独立存在,针对sdk单独的测试方案需要考虑开展单元测试和覆盖率分析进行保障sdk质量。

相关文章
|
安全 虚拟化
在数字化时代,网络项目的重要性日益凸显。本文从前期准备、方案内容和注意事项三个方面,详细解析了如何撰写一个优质高效的网络项目实施方案,帮助企业和用户实现更好的体验和竞争力
在数字化时代,网络项目的重要性日益凸显。本文从前期准备、方案内容和注意事项三个方面,详细解析了如何撰写一个优质高效的网络项目实施方案,帮助企业和用户实现更好的体验和竞争力。通过具体案例,展示了方案的制定和实施过程,强调了目标明确、技术先进、计划周密、风险可控和预算合理的重要性。
424 5
|
9月前
|
缓存 监控 Android开发
App Trace 快速安装解析(开发者视角)
App Trace 是一款应用性能监控工具,可追踪启动时间、方法耗时及卡顿等指标,助力开发调试与性能优化。支持 Android 和 iOS 平台,提供依赖引入、初始化配置和自动化脚本等快速安装方案,同时包含采样率、本地缓存等高级配置选项。集成后可通过日志检查与测试事件验证功能,注意在发布版本中使用 no-op 版本以减少性能影响,并确保隐私合规。
|
7月前
|
存储 Java PHP
轻量化短视频电商直播带货APP源码全解析:核心功能与设计流程​
在电商直播热潮下,开发专属直播带货APP成为抢占市场关键。本文详解原生开发轻量化APP的核心功能与全流程设计,涵盖用户登录、商品浏览、直播互动、购物车、订单及售后功能,并介绍安卓端Java、苹果端Object-C、后台PHP的技术实现,助力打造高效优质的直播电商平台。
|
数据可视化 前端开发 测试技术
接口测试新选择:Postman替代方案全解析
在软件开发中,接口测试工具至关重要。Postman长期占据主导地位,但随着国产工具的崛起,越来越多开发者转向更适合中国市场的替代方案——Apifox。它不仅支持中英文切换、完全免费不限人数,还具备强大的可视化操作、自动生成文档和API调试功能,极大简化了开发流程。
|
9月前
|
监控 测试技术 Android开发
App Trace技术解析:传参安装、一键拉起与快速安装
本文从开发者视角解析App Trace技术的关键功能与实现方法,涵盖传参安装、一键拉起和快速安装技术。详细介绍了Android和iOS平台的具体实现代码与配置要点,探讨了参数丢失、跨平台一致性及iOS限制等技术挑战的解决方案,并提供了测试策略、监控指标和性能优化的最佳实践建议,帮助开发者提升用户获取效率与体验。
|
编解码 缓存 Prometheus
「ximagine」业余爱好者的非专业显示器测试流程规范,同时也是本账号输出内容的数据来源!如何测试显示器?荒岛整理总结出多种测试方法和注意事项,以及粗浅的原理解析!
本期内容为「ximagine」频道《显示器测试流程》的规范及标准,我们主要使用Calman、DisplayCAL、i1Profiler等软件及CA410、Spyder X、i1Pro 2等设备,是我们目前制作内容数据的重要来源,我们深知所做的仍是比较表面的活儿,和工程师、科研人员相比有着不小的差距,测试并不复杂,但是相当繁琐,收集整理测试无不花费大量时间精力,内容不完善或者有错误的地方,希望大佬指出我们好改进!
943 16
「ximagine」业余爱好者的非专业显示器测试流程规范,同时也是本账号输出内容的数据来源!如何测试显示器?荒岛整理总结出多种测试方法和注意事项,以及粗浅的原理解析!
|
机器学习/深度学习 传感器 人工智能
穹彻智能-上交大最新Nature子刊速递:解析深度学习驱动的视触觉动态重建方案
上海交大研究团队在Nature子刊发表论文,提出基于深度学习的视触觉动态重建方案,结合高密度可拉伸触觉手套与视觉-触觉联合学习框架,实现手部与物体间力量型交互的实时捕捉和重建。该方案包含1152个触觉感知单元,通过应变干扰抑制方法提高测量准确性,平均重建误差仅1.8厘米。实验结果显示,其在物体重建的准确性和鲁棒性方面优于现有方法,为虚拟现实、远程医疗等领域带来新突破。
361 32
|
机器学习/深度学习 人工智能 自然语言处理
企业级API集成方案:基于阿里云函数计算调用DeepSeek全解析
DeepSeek R1 是一款先进的大规模深度学习模型,专为自然语言处理等复杂任务设计。它具备高效的架构、强大的泛化能力和优化的参数管理,适用于文本生成、智能问答、代码生成和数据分析等领域。阿里云平台提供了高性能计算资源、合规与数据安全、低延迟覆盖和成本效益等优势,支持用户便捷部署和调用 DeepSeek R1 模型,确保快速响应和稳定服务。通过阿里云百炼模型服务,用户可以轻松体验满血版 DeepSeek R1,并享受免费试用和灵活的API调用方式。
773 12
|
存储 人工智能 并行计算
2025年阿里云弹性裸金属服务器架构解析与资源配置方案
🚀 核心特性与技术创新:提供100%物理机性能输出,支持NVIDIA A100/V100 GPU直通,无虚拟化层损耗。网络与存储优化,400万PPS吞吐量,ESSD云盘IOPS达100万,RDMA延迟<5μs。全球部署覆盖华北、华东、华南及海外节点,支持跨地域负载均衡。典型应用场景包括AI训练、科学计算等,支持分布式训练和并行计算框架。弹性裸金属服务器+OSS存储+高速网络综合部署,满足高性能计算需求。
|
Dart 前端开发 Android开发
【02】写一个注册页面以及配置打包选项打包安卓apk测试—开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【02】写一个注册页面以及配置打包选项打包安卓apk测试—开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
489 1
【02】写一个注册页面以及配置打包选项打包安卓apk测试—开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈

热门文章

最新文章

推荐镜像

更多
  • DNS