fly63前端网

www.fly63.com

首页文章资源工具教程 栏目
  • 关于我们
  • 网站投稿
  • 赞助一下
搜索

在线工具_工作生活好帮手

打造各种简单、易用、便捷的在线工具,网友无需注册和下载安装即可使用

点击查看

关闭

提交网站

Hiper
分享
复制链接
新浪微博
QQ 好友

扫一扫分享

GitHub:https://github.com/pod4g/hiper
网站描述:一个性能统计分析工具,可让你网页性能提升 10 倍

Hiper

可以看成 Hi performance的缩写 或者 High performance的缩写

注意事项

请使用英语提issue

安装

npm install hiper -g

# 或者使用 yarn:
# yarn global add hiper

输出

注意: It takes period (m)s to load .... 这个 period 是运行本次测试所用时间. 因此,-n 越大,这个数越大

性能指标

KeyValue
DNS查询耗时domainLookupEnd - domainLookupStart
TCP连接耗时connectEnd - connectStart
第一个Byte到达浏览器的用时responseStart - requestStart
页面下载耗时responseEnd - responseStart
DOM Ready之后又继续下载资源的耗时domComplete - domInteractive
白屏时间domInteractive - navigationStart
DOM Ready 耗时domContentLoadedEventEnd - navigationStart
页面加载总耗时loadEventEnd - navigationStart

使用

hiper --help

Usage: hiper [options] [url]

令人愉悦的性能统计分析工具

Options:

   -v, --version                输出版本号
   -n, --count <n>              指定加载次数(默认20次)
   -c, --config <path>          载入指定的配置文件
   -u, --useragent <ua>         设置useragent
   -H, --headless [b]           是否使用无头模式(默认为true)
   -e, --executablePath <path>  使用指定的Chrome浏览器
   --no-cache                   禁用缓存(默认为false)
   --no-javascript              禁用JavaScript (默认为false)
   --no-online                  禁用网络(默认为false)
   -h, --help                   输出帮助信息

用例

 # 当我们省略协议头时,默认会在url前添加`https://`

 # 最简单的用法
 hiper baidu.com

 # 如何url中含有任何参数,请使用双引号括起来
 hiper "baidu.com?a=1&b=2"

 #  加载指定页面100次
 hiper -n 100 "baidu.com?a=1&b=2"

 #  禁用缓存加载指定页面100次
 hiper -n 100 "baidu.com?a=1&b=2" --no-cache

 #  禁JavaScript加载指定页面100次
 hiper -n 100 "baidu.com?a=1&b=2" --no-javascript
 
 #  使用GUI形式加载指定页面100次
 hiper -n 100 "baidu.com?a=1&b=2" -H false

 #  使用指定useragent加载网页100次
 hiper -n 100 "baidu.com?a=1&b=2" -u "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (Khtml, like Gecko) Chrome/66.0.3359.181 Safari/537.36"


配置

支持 .json 和 .js 格式的配置文件

json

{
   // options 指向Chrome可执行程序,一般不需要配置此项,除非你想测试某个特定版本的Chrome
   "executablePath": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
   // required 要测试的url
   "url": "https://example.com",
   // options 本次测试需要用到的Cookies,通常是登录信息(即你测试的页面需要登录) Array | Object
   "cookies": [{
      "name": "token",
      "value": "9+cL224Xh6VuRT",
      "domain": "example.com",
      "path": "/",
      "size": 294,
      "httpOnly": true
   }],
   // options 测试次数 默认为20次
   "count": 100,
   // options 是否使用无头模式 默认为true
   "headless": true,
   // options 是否禁用缓存 默认为false 
   "noCache": false,
   // options 是否禁掉JavaScript 默认为false
   "noJavascript": false,
   // options 是否禁掉网络 默认为false
   "noOnline": false,
   // options 设置指定的useragent信息
   "useragent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36",
   // options 设置视口信息
   "viewport": {
      // options
      "width": 375,
      // options
      "height": 812,
      // options devicePixelRatio 默认为1
      "deviceScaleFactor": 3,
      // options 是否模拟成mobile 默认为false
      "isMobile": false,
      // options 是否支持touch时间 默认为false
      "hasTouch": false,
      // options 是否是横屏模式 默认为false
      "isLandscape": false
   }
}
js

配置的JS文件允许人们使用ENV变量。例如,假设你想在经过身份验证的状态下测试站点。你可以通过ENV变量传递一些用于标识你的cookie,有一个基于JS的配置文件使这变得很简单。例如

module.exports = {
    ....
    cookies:  [{
        name: 'token',
        value: process.env.authtoken,
        domain: 'example.com',
        path: '/',
        httpOnly: true
    }],
    ....
}
# 载入上述配置文件(假设配置文件在/home/下)
hiper -c /home/config.json

# 或者你也可以使用js文件作为配置文件
hiper -c /home/config.js

链接: https://fly63.com/nav/3143

more>>
相关栏目
Jest
Facebook开发的一个对javascript进行单元测试的工具
官网GitHub
puppeteer
web前端自动化测试利器
官网GitHub
mocker-api
为 REST API 创建模拟 API
官网GitHub
FrontJS
轻量级的网站错误监控平台
官网
Gremlins.js
模拟用户随机操作的 JS 测试库
点击进入GitHub
JSDebugger
基于 JavaScript 的调试程序
官网GitHub
PhantomCSS
像素对比工具
点击进入GitHub
DejaVue
Vue.js的可视化Chrome开发工具
官网GitHub
avoriaz
一个Vue.js测试工具类库
官网GitHub
qunit
一个强大的JavaScript单元测试框架
官网GitHub
Expect.js
写一些简单测试用例、仿自然语言的方法
官网GitHub
should.js
一款js测试断言库
官网GitHub
supertest
nodejs开发单元测试
点击进入GitHub
Fundebug
一行代码搞定BUG监控!
官网
jasmine
一款 JavaScript 测试框架,它不依赖于其他任何 JavaScript 组件
官网GitHub
RegExr
一个基于HTML/JS的工具,用于创建,测试和学习正则表达式
官网GitHub

手机预览