软件测试52讲
茹炳晟
eBay中国研发中心,测试基础架构技术主管
立即订阅
13434 人已学习
课程目录
已完结 63 讲
0/4登录后,你可以任选4讲全文学习。
开篇词 (1讲)
开篇词 | 从“小工”到“专家”,我的软件测试修炼之道
免费
测试基础知识篇 (11讲)
01 | 你真的懂测试吗?从“用户登录”测试谈起
02 | 如何设计一个“好的”测试用例?
03 | 什么是单元测试?如何做好单元测试?
04 | 为什么要做自动化测试?什么样的项目适合做自动化测试?
05 | 你知道软件开发各阶段都有哪些自动化测试技术吗?
06 | 你真的懂测试覆盖率吗?
07 | 如何高效填写软件缺陷报告?
08 | 以终为始,如何才能做好测试计划?
09 | 软件测试工程师的核心竞争力是什么?
10 | 软件测试工程师需要掌握的非测试知识有哪些?
11 | 互联网产品的测试策略应该如何设计?
GUI自动化测试篇 (10讲)
12 | 从0到1:你的第一个GUI自动化测试
13 | 效率为王:脚本与数据的解耦 + Page Object模型
14 | 更接近业务的抽象:让自动化测试脚本更好地描述业务
15 | 过不了的坎:聊聊GUI自动化过程中的测试数据
16 | 脑洞大开:GUI测试还能这么玩(Page Code Gen + Data Gen + Headless)?
17 | 精益求精:聊聊提高GUI测试稳定性的关键技术
18 | 眼前一亮:带你玩转GUI自动化的测试报告
19 | 真实的战场:如何在大型项目中设计GUI自动化测试策略
20 | 与时俱进:浅谈移动应用测试方法与思路
21 | 移动测试神器:带你玩转Appium
API自动化测试篇 (3讲)
22 | 从0到1:API测试怎么做?常用API测试工具简介
23 | 知其然知其所以然:聊聊API自动化测试框架的前世今生
24 | 紧跟时代步伐:微服务模式下API测试要怎么做?
代码测试篇 (3讲)
25 | 不破不立:掌握代码级测试的基本理念与方法
26 | 深入浅出之静态测试方法
27 | 深入浅出之动态测试方法
性能测试篇 (7讲)
28 | 带你一起解读不同视角的软件性能与性能指标
29 | 聊聊性能测试的基本方法与应用领域
30 | 工欲善其事必先利其器:后端性能测试工具原理与行业常用工具简介
31 | 工欲善其事必先利其器:前端性能测试工具原理与行业常用工具简介
32 | 无实例无真相:基于LoadRunner实现企业级服务器端性能测试的实践(上)
33 | 无实例无真相:基于LoadRunner实现企业级服务器端性能测试的实践(下)
34 | 站在巨人的肩膀:企业级实际性能测试案例与经验分享
测试数据准备篇 (4讲)
35 | 如何准备测试数据?
36 | 浅谈测试数据的痛点
37 | 测试数据的“银弹”- 统一测试数据平台(上)
38 | 测试数据的“银弹”- 统一测试数据平台(下)
测试基础架构篇 (4讲)
39 | 从小作坊到工厂:什么是Selenium Grid?如何搭建Selenium Grid?
40 | 从小工到专家:聊聊测试执行环境的架构设计(上)
41 | 从小工到专家:聊聊测试执行环境的架构设计(下)
42 | 实战:大型全球化电商的测试基础架构设计
测试新技术篇 (5讲)
43 | 发挥人的潜能:探索式测试
44 | 测试先行:测试驱动开发(TDD)
45 | 打蛇打七寸:精准测试
46 | 安全第一:渗透测试
47 | 用机器设计测试用例:基于模型的测试
测试人员的互联网架构核心知识篇 (5讲)
48 | 优秀的测试工程师为什么要懂大型网站的架构设计?
49 | 深入浅出网站高性能架构设计
50 | 深入浅出网站高可用架构设计
51 | 深入浅出网站伸缩性架构设计
52 | 深入浅出网站可扩展性架构设计
特别放送篇 (8讲)
测试专栏特别放送 | 答疑解惑第一期
测试专栏特别放送 | 答疑解惑第二期
测试专栏特别放送 | 答疑解惑第三期
测试专栏特别放送 | 答疑解惑第四期
测试专栏特别放送 | 答疑解惑第五期
测试专栏特别放送 | 答疑解惑第六期
测试专栏特别放送 | 答疑解惑第七期
测试专栏特别放送 | 浅谈全链路压测
测一测 (1讲)
测一测 | 这些软件测试题目,你都掌握了吗?
结束语 (1讲)
结束语 | 不是结束,而是开始
软件测试52讲
登录|注册

31 | 工欲善其事必先利其器:前端性能测试工具原理与行业常用工具简介

茹炳晟 2018-09-07
你好,我是茹炳晟。今天我和你分享的主题是:工欲善其事必先利其器之前端性能测试工具原理与行业常用工具简介”。
不同于后端性能测试知识的琐碎、独立,今天我将从问答形式回到正常的分享思路上,为你介绍前端性能测试工具为。我会以一个具体网站为例,和你分析 WebPagetest 的用法,以及前端性能相关的主要概念与指标。

WebPagetest 功能简介

WebPagetest,是前端性能测试的利器:
可以为我们提供全方位的量化指标,包括页面的加载时间、首字节时间、渲染开始时间、最早页面可交互时间、页面中各种资源的字节数、后端请求数量等一系列数据;
还可以自动给出被测页面性能优化水平的评价指标,告诉我们哪些部分的性能已经做过优化处理了,哪些部分还需要改进;
同时,还能提供 Filmstrip 视图、Waterfall 视图、Connection 视图、Request 详情视图和页面加载视频慢动作。
可以说,WebPagetest 为我们提供了前端页面性能测试所需要的一切,而且还是免费的。接下来,我们就通过测试一个具体的网站,实践一下它的强大功能,以及具体使用方法吧。

使用 WebPagetest 测试某网站的首页

那么,接下来我就以某网站首页的前端性能测试和评估为例,和你一起看看如何使用这个强大的前端性能工具。
取消
完成
0/1000字
划线
笔记
复制
© 版权归极客邦科技所有,未经许可不得传播售卖。 页面已增加防盗追踪,如有侵权极客邦将依法追究其法律责任。
该试读文章来自付费专栏《软件测试52讲》,如需阅读全部文章,
请订阅文章所属专栏。
立即订阅
登录 后留言

精选留言(25)

  • 心情不错
    老师您好,我想请问如果某些页面需要登录才能访问到,用您介绍的工具怎么测试呢?
    2018-09-21
    5
  • llyl
    对于局域网的网页webpage就不支持了,怎么测试局域网网页的性能呢?

    作者回复: 可以在公司内网搭建webpagetest,文章最后已经提到了这块

    2018-09-07
    3
  • 木易
    webpagetest该网站是需要特殊的操作吗?我的页面能打开,但是输入url及配置完相应的设置后,点击<start test>,会显示如下的提示:Failed recaptcha validation. Please go back and try submitting your test again 。也不会有老师文章里的相应结果

    作者回复: url中是否有非法字符?

    2018-09-07
    3
    2
  • 天天向⬆️
    移动端native性能测试有好的工具推荐吗?
    2018-09-20
    1
  • Cynthia🌸
    WebPagetest!之前真的没有接触过这个工具。打算找一块时间来跟着操作实践一下,才能理解的更深入。

    作者回复: 是的,可以找一个世纪网站练练手,入门使用还是很快的,而且可以帮助理解前端性能的很多概念

    2018-09-12
    1
  • _CountingStars
    puppteer之类的开源软件应该也可以获取这些数据

    作者回复: 是的,可以的

    2018-09-08
    1
  • dean不闷
    请问一下h5的性能,有什么好的方案吗

    作者回复: 你指的测试方案还是优化方案?

    2018-09-07
    1
  • 太匆匆
    老师您好,我自己搭了一个私有的实例。但是发现测试结果和官网的测试结果并不一致。原因可能是代理机配置的原因吗?那影响测试结果的其他因素又有哪些呢?
    2019-10-09
  • 太匆匆
    老师您好,如果是自己搭建服务器那WebPagetest API Wrapper是安装在服务端还是客户机上
    2019-09-10
  • 倔强的潇洒小姐
    Yslow有听过,刚试了下WebPagetest,发现要翻墙才能用
    2019-08-30
  • wht
    报Failed recaptcha validation. Please go back and try submitting your test again错误的可以看下是不是连的4g,还需要翻墙才能看
    2019-06-12
  • 口水窝
    只知道前端性能测试的一些指标,但是没用过工具。上过茹老师的课程后,有一种醍醐灌顶的感觉,软件测试被整个提起来了。
    2019-04-25
  • Ivan
    跟“木易”提出的问题一致,url无特殊字符,这是怎么回事?(webpagetest该网站是需要特殊的操作吗?我的页面能打开,但是输入url及配置完相应的设置后,点击<start test>,会显示如下的提示:Failed recaptcha validation. Please go back and try submitting your test again 。也不会有老师文章里的相应结果)

    作者回复: webpagetest故障,我也试了,可以换个发起点就好了

    2018-12-28
  • 陈子文
    网站一直提示:Failed recaptcha validation. Please go back and try submitting your test again,是不能用了吗
    2018-12-12
  • 木然
    老师您好,我想请问如果某些页面需要登录才能访问到,用您介绍的工具怎么测试呢?目前登陆后的url拷进去后测试的都是登录页面
    2018-10-15
  • 汪龙龙
    老师讲解的太棒了,请问集成webpagetest的时候,怎么判断statusCode的状态去进行下一步操作?
    2018-09-19
  • 一池浮萍
    老师,请教下您,native app是不是麻烦一些,比如,ios用instrument统计性能,但是这个不好持续集成,另外页面渲染时间,可能需要代码插桩
    2018-09-16
  • Laura张远园
    本文是说明前端性能测试,所针对的对象是我们的网页代码、配置在前端的显示性能,并依据这些性能对网页代码、配置进行优化。
    但是不是有些指标主要优化部分并不在于网页代码?如静态内容,网页缓存,这些主要在于浏览器功能;cdn是更多在于配置、后台部分。
    2018-09-14
  • 涅槃Ls
    打卡31,前端性能测试
    2018-09-13
  • dean不闷
    h5的测试方案:)
    2018-09-11
收起评论
25
返回
顶部