终端Web性能测试初探

一、问题背景

通过手机(如Android或iOS端)打开微官网主页时,偶现打开十分缓慢;

1、测试重现:

通过iphone测试机,打开如下特定的主页时,可以复现
http://byb.qq.com/mp/wechat11/Sections/main
从PC上尝试打开,没有看到异常;初步确认可能是页面存在某些元素在iOS上存在兼容性

2、测试方案探讨:

通过开发及测试内部讨论,了解到大致参考思路有

  1. 通过对web页面从开始加载到加载完成进行时间打点—-记录实际耗时
  2. 通过抓包得到pcap文件,再转化成har文件分析——测试网页请求耗时

二、具体跟进过程

通过进一步了解,实现具体步骤如下

1、打点[……]

阅读全文>>

前端页面执行时间统计脚本

执行了前端优化后,把脚本发出来给测试的同学们,只要在开发者工具命令行中执行以下脚本,可以看到页面加载时间等各种时间。截图如下
  qd1      
脚本如下:
    ‘use strict’;
 
    // private begin
    /**
     * 时间配置部分,前端将按照配置输出时间节点
     *
     * @returns {{navigationStart: string[], redirectTime: string[], fetchTime: string[], appcacheTime: string[], unloadEventTi[……]

阅读全文>>