[Puppeteer] Get a Page's Load Time with Puppeteer (window.profermence.timing)
In this lesson we are going to use Google's Puppeteer to gather metrics about a page's load time. We'll use a high level date subtraction method as well as gather data from the window performance timing. Then see how throttling the network to 3G affects the page's load time.
const getPageMetrics = async () => {
const browser = await puppeteer.launch({headless: false});
const page = await browser.newPage();
await page.waitFor(1000); //delay 1 s
// 3G metwork
await page._client.send('Network.emulateNetworkConditions', {
offline: false,
latency: 200,
downloadThroughput: 780*1024 / 8,
uploadThroughput: 300*1024/8
})
await page.goto('https://developers.google.com/web/');
const pref = await page.evaluate( _ => {
const {loadEventEnd, navigationStart} = window.performance.timing;
return ({
loadTime: loadEventEnd - navigationStart
})
})
console.log(`It took: ${pref.loadTime}ms`)
}
About 'winidow.profermence.timing', please check link.
About Chrom devtool protcol, please check link.
[Puppeteer] Get a Page's Load Time with Puppeteer (window.profermence.timing)的更多相关文章
- Puppeteer学习笔记 (1)- 什么是Puppeteer
本文链接:https://www.cnblogs.com/hchengmx/p/11006263.html 1. phantomjs介绍 在介绍puppeteer之前必须介绍一下phantomjs,p ...
- $(document).ready() $(window).load 及js的window.onload
1.$(document).ready() 简写为$(function(){}) DOM结构绘制完成执行,而无需等到图片或其他媒体下载完毕. 2.$(window).load 在有时候确实我们有需 ...
- 异步加载css 和 谷歌浏览器各实用小工具介绍
异步加载css资源 加开页面首屏显示速度使我们前端一直在追求的目标,而css资源在这些优化中同样也是不可或缺的. 一个网站可能有一部分css资源是必须的,他需要在页面渲染完之前就被加载完,并和html ...
- 使用Puppeteer进行数据抓取(二)——Page对象
page对象是puppeteer最常用的对象,它可以认为是chrome的一个tab页,主要的页面操作都是通过它进行的.Google的官方文档详细介绍了page对象的使用,这里我只是简单的小结一下. 客 ...
- Puppeteer: 更友好的 Headless Chrome Node API
很早很早之前,前端就有了对 headless 浏览器的需求,最多的应用场景有两个 UI 自动化测试:摆脱手工浏览点击页面确认功能模式 爬虫:解决页面内容异步加载等问题 也就有了很多杰出的实现,前端经常 ...
- 微信公众号_订阅号_爬虫puppeteer
puppeteer 借助 puppeteer 库实现爬虫,puppeteer 提供了高级 api 接口来操作 chrome 来 npm install puppeteer --save-dev ...
- Puppeteer前端自动化测试实践
本篇内容将记录并介绍使用Puppeteer进行自动化网页测试,并依靠约定来避免反复修改测试用例的方案.主要解决页面众多时,修改代码导致的牵连错误无法被发现的运行时问题.文章首发于个人博客.对前端感兴趣 ...
- Puppeteer入门初探
本文来自网易云社区 作者:唐钊 最近在看 node 爬虫相关的一些东西,我记得还是很久以前常用的 node 爬虫工具还是 superagengt+cherrio,他们的思路是通过发起 http 请求然 ...
- 在linux (centos)上使用puppeteer实现网页截图
1.安装nodejs和npm # 下载解压 wget -c https://nodejs.org/dist/v8.9.1/node-v8.9.1-linux-x64.tar.xz tar -xvf n ...
随机推荐
- 使用fatjar来实现将包括第三方jar包的项目到处成一个jar包供其它程序使用
一.在线安装fat jar 在线安装步骤: eclipse菜单条 help >software updates >Search for new features to install> ...
- hdu 5335 Walk Out (2015 Multi-University Training Contest 4)
Walk Out Time Limit: 2000/10 ...
- openssl之EVP系列之6---EVP_Encrypt系列函数编程架构及样例
openssl之EVP系列之6---EVP_Encrypt系列函数编程架构及样例 ---依据openssl doc/crypto/EVP_EncryptInit.pod和doc/ssleay. ...
- hdu3966_树链剖分
近期在强化知识点深度.发现树链剖分不是非常会写了. 回想一下改动操作: 若两个点在同一条链上,则直接改动这段区间. 若不在同一条链上,改动深度较大的点到其链顶端的区间,同一时候将这个点变为他所在链顶端 ...
- Android 中View的绘制机制源代码分析 二
尊重原创:http://blog.csdn.net/yuanzeyao/article/details/46842891 本篇文章接着上篇文章的内容来继续讨论View的绘制机制,上篇文章中我们主要解说 ...
- mybatis使用generator自己主动生成代码时的类型转换
使用mybatis的generator自己主动生成代码,可是oracle数据库中number(6,2)总是自己主动转成BigDecimal.我想要转成的是float类型 这样就写了一个类型转换器,须要 ...
- 创建多线程的HttpClient
在实际的应用中,我们的联网应用程序里应该有一个HttpClient,并将其用于所有的HTTP通信.这就可能在同一个Http Client同时发出多个请求,也就产生了多线程的问题.幸运的是,在HttpC ...
- Hello The World! —— 致我们无悔的IT之旅
感谢IT,让我有了这么可爱活泼的伙伴. 有了KsCla,Coming,lhx_QAQ,tututu,AB_ever,Fat-zhang,wka,lhm这些伙伴神犇的陪伴,我的OI历程不至于那么枯燥无味 ...
- Oracle多表连接效率,性能优化
Oracle多表连接,提高效率,性能优化 (转) 执行路径:ORACLE的这个功能大大地提高了SQL的执行性能并节省了内存的使用:我们发现,单表数据的统计比多表统计的速度完全是两个概念.单表统计可能只 ...
- 13. Roman to Integer[E]罗马数字转整数
题目 Given a roman numeral, convert it to an integer. Input is guaranteed to be within the range from ...