实战演示 H5 性能分析

W3C标准是浏览器标准,一般浏览器都支持W3C标准,它规定使用者可以通过api查询性能信息,可借用W3C协议完成自动化H5性能测试。 W3C官网:www.w3.org/TR/navigati...

使用chrome浏览器对webview进行手工查看,伴随着业务增多,数量加大,手工操作的速度会无法跟上业务增长,此时需要自动化方法测试webview性能。

当页面加载时,会渲染一系列内容,渲染过程可分为多个阶段,比如下图:

• Prompt for unload 访问一个新页面时,旧页面卸载完成的时间

• redirect 重定向,用户注销登陆时返回主页面和跳转到其它的网站等

• App cache 检查缓存,是否打开

• DNS 表示 DNS 查询的时间,如果是长连接或者请求文件来自缓存等本地存储则返回fetchStart时间点

• TCP 与服务器建立链接的时间

• Requests 客户端发起请求的时间

• Response 拿到服务器第一个响应字节到最后一个响应字节的时间

• Processing 各种状态的时间点,例如加载状态等等

• onLoad 触发load事件执行的时间

在chrome浏览器中,执行js代码可获取各个阶段的内容:

javascript

window.performance.timing

上面的时间只是一个时间点,如果想获取各阶段的具体时间,就需要对两个时间点进行相减运算,比如计算domContent加载事件时间:

javascript

window.performance.timing.\

domContentLoadedEventEnd -\

javascript

window.performance.timing.\

domContentLoadedEventStart

appium/selenium可以执行js,借用appium/selenium工具可实现自动化获取能指标,调用

appium/selenium的ExecuteScriptapi,可向页面注入下面代码:

python 复制代码
from selenium import webdriver

driver = webdriver.Chrome()

driver.get("https://home.testing-studio.com/")

print(driver.execute_script(    

      "return JSON.stringify(window.performance.timing)"))

案 例

H5性能测试需要配合自动化测试工具使用,比如selenium或者appium,通过js代码注入实现自动化调用api。

使用 python + selenium 进行js注入:

python 复制代码
from selenium import webdriver

driver = webdriver.Chrome()

driver.get("https://home.testing-studio.com/")

print(driver.execute_script(    

      "return JSON.stringify(window.performance.timing)"))

执行后会返回一个json数据,包含了简介中的各个性能指标,可对性能指标做二次处理或可视化展示:

python 复制代码
{"navigationStart":1585043212714,

"unloadEventStart":0,"unloadEventEnd":0,

"redirectStart":0,

"redirectEnd":0,

"fetchStart":1585043212717,

"domainLookupStart":1585043212747,

"domainLookupEnd":1585043212747,

"connectStart":1585043212747,

"connectEnd":1585043212835,

"secureConnectionStart":1585043212787,

"requestStart":1585043212836,

"responseStart":1585043212918,

"responseEnd":1585043212921,

"domLoading":1585043212929,

"domInteractive":1585043214972,

"domContentLoadedEventStart":1585043214972,

"domContentLoadedEventEnd":1585043214972,

"domComplete":1585043215976,

"loadEventStart":1585043215976,

"loadEventEnd":1585043215976}

最后感谢每一个认真阅读我文章的人,礼尚往来总是要有的,这些资料,对于【软件测试】的朋友来说应该是最全面最完整的备战仓库,虽然不是什么很值钱的东西,如果你用得到的话可以直接拿走:

这些资料,对于【软件测试】的朋友来说应该是最全面最完整的备战仓库,这个仓库也陪伴上万个测试工程师们走过最艰难的路程,希望也能帮助到你!

相关推荐
Raink老师7 小时前
【AI面试临阵磨枪-62】设计基于 RAG 的内部知识库问答平台(多租户、权限、文件上传、实时更新)
人工智能·面试·职场和发展
我爱cope9 小时前
【Agent智能体6 | 智能体AI评估】
人工智能·职场和发展
我爱cope11 小时前
【Agent智能体5 | 任务分解:识别工作流中的步骤】
人工智能·职场和发展
daopuyun13 小时前
CMA软件测试中心设备管理程序分享|设备采购、设备验收、设备建档、设备标识...
软件测试·cma
Skr-Eric14 小时前
面试复盘7.0
面试·职场和发展
humors22115 小时前
面对暴力伤害时的自我保护指南
大数据·程序人生
AI周红伟16 小时前
Windows 支持 Hermes Agent 吗:原生 Windows 安装 + WSL2 路径完整指南
数据库·人工智能·windows·阿里云·职场和发展·计算机外设
旧曲重听116 小时前
我的Vibe Coding一周记…
前端·人工智能·程序人生·面试
空中湖17 小时前
ECR依恋测试:两把钥匙,打开你的爱情密码
程序人生
CeshirenTester18 小时前
大厂校招变了:AI 能力正在进入笔试和面试
人工智能·面试·职场和发展