首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >WebPagetest:新手一眼看懂使用教程

WebPagetest:新手一眼看懂使用教程

原创
作者头像
shirishiyue
发布于 2018-11-09 03:29:12
发布于 2018-11-09 03:29:12
6.5K0
举报
文章被收录于专栏:全栈码全栈码

1、工具介绍

这是一个非常详细且专业的web页面性能分析工具,而且开源的!如果你打不开其官网,或者担心安全问题,你可以自己拿源码搭建这个平台工具。

性能分析极其详细,包含你所知道的所有新能参数指标,还有一些这个工具自己的指标参数,比如speed index,更能从人的角度看待一个页面体验是否良好。提供了多种主流浏览器的访问性能,提供了全球多个地点的测试性能,还有视频录像功能可以返回体验。这个视频功能极好的用于直观的对比演示。总之,优点非常之多,没有理由不尝试一下。

入口在 这里,长这样,

上面三输入框,,,第一行,输入你的页面url。

第二行,选择你的访问点,比如你想测一下北京的用户访问速度,那么你选择北京。

第三行,选择什么浏览器访问。

右边,点击START TEST,,,,耐心等待。

分析的结果时存下来的,比如,我的三个url分析结果如下,可以反复进入查阅。

页面1:https://test.igame.qq.com/pvp/acts/a201807/herotool.php?op=2,分析结果

页面2:http://134.175.16.24/vuessr/act/act1/index/hero,分析结果

页面3:http://134.175.16.24/newcss/act/act1/index.html/hero,分析结果

2、结果使用和分析

分析完后,结果长这样,

总共跑了三次。每一次都是First View(就是相当于新用户,首次打开页面,没有任何缓存)。

Performance Result 就是指标总览,列举了一些主要的新能指标的平均值。


指标解析: 从输入url按enter开始的,达到下面节点的时间。

▲ Load Time

页面完全加载完时间(不等待图片下载,iframe下载,css更新完),此时,window.onload 事件此时触发。同 Document complete time.

▲ DOM Content Loaded

HTML DOM 骨架完全下载和解析,包括<script>元素。(等待图像下载,css更新,iframe更新等)。此时,DOMContentLoaded 事件触发。(你在预加载数据的时候,可以在这个事件时会更合适些,而不是上面的dom ready)

▲ Time to First Byte

首字节时间。浏览器接收到第一个字节的时间。包括服务器处理以及网络传输,DNS寻址时间+建立连接时间(Socket) + SSL认证时间等。

▲ Start Render

白屏后首次出现内容的时间。

▲ Speed Index

速度指数,页面呈现出来的平均时间。比Start Render更人性化的指标。详细计算方式参考:Speed Index 。主要

▲ Time to Interactive

首次可交互时间。页面可以开始响应用户输入事件。(因为页面呈现过程中,其实还是不可交互的。)

▲ Requests

浏览器针对页面上的内容(图片,javascript,css等)发出的请求数。

▲ Bytes In

浏览器加载页面下载的数据量。它通常也被称为“页面大小”。


过程详细:

中间的Waterfall可以看到瀑布流图,点进去,跟你使用chrome tool一样。不多介绍。

▲ Screen Shot,网页快照,保存了从输入url到页面fully loaded的全称快照。

▲ Video 整个过程的视频。这个非常好,你可以和几个视频放在一起,非常直观的看哪一个快哪一个慢。

▲ 各种 breakdown 拆分统计,包括 Contents,Processing,Domains等等,,,,,比如,Contents 拆分统计如下,

▲ domains breakdown,and, request map,,,可统计请求域名情况,域名越多,明显对时间要求更多。

▲ 性能表现总量,可以优化性能的指标完成情况。

这里面列出了可使用的性能点,如:

  • First Byte Time (back-end processing): 51/100
  • Use persistent connections (keep alive): 100/100
  • Use gzip compression for transferring compressable responses: 42/100
  • Compress Images: 100/100
  • Leverage browser caching of static assets: 14/100
  • Use a CDN for all static assets: 0/100

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
聊聊jvm的direct buffer统计
http://localhost:8080/actuator/metrics/jvm.memory.used?tag=area:heap
code4it
2024/01/07
3640
聊聊jvm的Code Cache
JVM生成的native code存放的内存空间称之为Code Cache;JIT编译、JNI等都会编译代码到native code,其中JIT生成的native code占用了Code Cache的绝大部分空间
code4it
2019/03/30
8K0
聊聊jvm的Code Cache
聊聊jvm的Stack Memory
序 本文主要研究一下jvm的Stack Memory Java-Heap-Stack-Memory.png Virtual Machine Stack 每个jvm线程都有一个私有的Virtual Machine Stack,它在线程同时被创建 该stack主要用于存储frames,即所谓的stack frames 每个方法在执行的时候都会创建一个stack frame,用于存储方法的局部变量、返回值、Operand stack等 Stack Memory Stack Memory是执行线程时所使用的内存
code4it
2019/04/01
1.6K0
聊聊jvm的Stack Memory
聊聊jvm的-XX:MaxDirectMemorySize
序 本文主要研究一下jvm的-XX:MaxDirectMemorySize jpoutisfj_03.png -XX:MaxDirectMemorySize -XX:MaxDirectMemorySize=size用于设置New I/O(java.nio) direct-buffer allocations的最大大小,size的单位可以使用k/K、m/M、g/G;如果没有设置该参数则默认值为0,意味着JVM自己自动给NIO direct-buffer allocations选择最大大小 System.i
code4it
2019/03/28
13.6K0
聊聊jvm的-XX:MaxDirectMemorySize
Spring Boot 3.x接入micrometer
可观察性可以通过分布式系统下各种组件交互的可见性来帮助识别应用程序中的问题和调试问题。
eeaters
2023/08/02
4.4K2
Spring Boot 3.x接入micrometer
聊聊jvm的StringTable及SymbolTable
序 本文主要研究一下jvm的StringTable及SymbolTable jvm_memory_overview.jpg StringTable及SymbolTable JDK的变动 在java7的时候将字符串常量池移到java heap,字符串常量池被限制在整个应用的堆内存中,在运行时调用String.intern()增加字符串常量不会使永久代OOM了。使用-XX:StringTableSize可以设置StringTableSize,默认是65536 java8的时候去除PermGen,将其中的方法
code4it
2019/04/08
1.8K0
聊聊jvm的StringTable及SymbolTable
性能优化 - Docker 容器中的 Java 内存使用分析
Docker 下运行的 Java 应用程序中的内存消耗时遇到了一个有趣的问题。该XMX参数被设置为256M,但Docker监控工具显示几乎两倍多使用的内存
码农架构
2021/10/12
4.6K0
性能优化 - Docker 容器中的 Java 内存使用分析
聊聊jvm的CompressedClassSpace
序 本文主要研究一下jvm的CompressedClassSpace java-on-linux-for-devs-and-ops-2-638.jpg CompressedClassSpace java8移除了permanent generation,然后class metadata存储在native memory中,其大小默认是不受限的,可以通过-XX:MaxMetaspaceSize来限制 如果开启了-XX:+UseCompressedOops及-XX:+UseCompressedClassesPo
code4it
2019/03/31
7.8K1
聊聊jvm的CompressedClassSpace
Spring Boot Admin2 自定义JVM监控通知
首先我们看到Spring Boot Admin 的控制台是能看到很多监控指标的,如图:
阿提说说
2022/12/05
7260
Spring Boot Admin2 自定义JVM监控通知
6 款 Java 8 自带工具,轻松分析定位 JVM 问题!
这篇文章中介绍下如何使用 JDK 自带工具来分析和定位 Java 程序的问题。 使用 JDK 自带工具查看 JVM 情况 JDK 自带了很多命令行甚至是图形界面工具,帮助我们查看 JVM 的一些信息。比如,在我的机器上运行 ls 命令,可以看到 JDK 8 提供了非常多的工具或程序: 图片 接下来,我会与你介绍些常用的监控工具。你也可以先通过下面这张图了解下各种工具的基本作用: 图片 为了测试这些工具,我们先来写一段代码:启动 10 个死循环的线程,每个线程分配一个 10MB 左右的字符串,然后休眠 1
程序猿DD
2022/03/14
6750
【SpringBoot系列】微服务下的指标监测及自定义指标
可观测性是微服务架构的关键特征,应用程序指标是程序可观察性的一个维度,当应用程序在生产环境中运行时,我们可能想知道各种操作指标,如内存、CPU、线程池使用率等,以及业务指标,例如对特定操作发出了多少请求。
Freedom123
2024/04/22
4190
解读 Java 云原生实践中的内存问题(必看)
Java 凭借着自身活跃的开源社区和完善的生态优势,在过去的二十几年一直是最受欢迎的编程语言之一。步入云原生时代,蓬勃发展的云原生技术释放云计算红利,推动业务进行云原生化改造,加速企业数字化转型。
用户1107783
2023/12/11
5930
解读 Java 云原生实践中的内存问题(必看)
聊聊HotSpot VM的Native Memory Tracking
本文主要研究一下HotSpot VM的Native Memory Tracking
code4it
2019/03/25
11.1K0
聊聊HotSpot VM的Native Memory Tracking
流计算 Oceanus | Flink JVM 内存超限的分析方法总结
作者:董伟柯,腾讯 CSIG 高级工程师 问题背景 前段时间,某客户线上运行的大作业(并行度 200 左右)遇到了 TaskManager JVM 内存超限问题(实际内存用量 4.1G > 容器设定的最大阈值 4.0G),被 YARN 的 pmem-check 机制检测到并发送了 SIGTERM(kill)信号终止该 container,最终导致作业出现崩溃。这个问题近期出现了好几次,客户希望能找到解决方案,避免国庆期间线上业务受到影响。 在 Flink 配置项中,提供了很多内存参数设定。我们逐一检查了客户
腾讯云大数据
2022/01/21
1.4K0
做了ERROR日志监控就够了吗?不试一下微服务的JVM监控
现在好多公司都在使用微服务,也有一些公司在落地DDD在业务中,那么你的服务做了监控了吗?一般除了错误日志的监控,报警发邮件、飞书消息或者短信,还有的对数据库或者服务器做了一些监控,那么你对你的服务的JVM层面做了监控吗?
xdd
2022/07/12
8350
做了ERROR日志监控就够了吗?不试一下微服务的JVM监控
Spring Boot Actuators
Spring Boot 提供了开箱即用的应用监控功能,对于大厂来说可能比较鸡肋,但是对于一些没有基础建设团队的中小公司是非常好用的。
李鸿坤
2020/09/24
4030
研发日记|一次 Java 乌龙“内存泄露”排查之旅
《研发日记》这个系列的诞生初衷,是希望分享 AutoMQ 版本迭代中我们的研发故事,其中会包括技术调研、问题诊断、性能优化等内容。如果你也对 AutoMQ 背后的技术和进展感兴趣的话,欢迎关注我们。
用户10807116
2024/05/27
3630
Spring Boot Actuator
Spring Boot Actuator 在Spring Boot第一个版本发布的时候就有了,它为Spring Boot提供了一系列产品级的特性:监控应用程序,收集元数据,运行情况或者数据库状态等。
程序那些事
2020/07/07
6730
Flink JVM 内存超限的分析方法总结
前段时间,某客户的大作业(并行度 200 左右)遇到了 TaskManager JVM 内存超限(实际内存用量 4.1G > 容器设定的最大阈值 4.0G),被 YARN 的 pmem-check 机制检测到并发送了 SIGTERM(kill)信号终止,最终导致作业出现崩溃。这个问题近期出现了好几次,客户希望能找到解决方案,避免国庆期间线上业务受到影响。
KyleMeow
2021/09/29
7.5K6
聊聊springboot2的micrometer
springboot2在spring-boot-actuator中引入了micrometer,对1.x的metrics进行了重构,另外支持对接的监控系统也更加丰富(Atlas、Datadog、Ganglia、Graphite、Influx、JMX、NewRelic、Prometheus、SignalFx、StatsD、Wavefront)。1.x的metrics都有点对齐dropwizard-metrics的味道,而micrometer除了一些基本metrics与dropwizard-metrics相类似外,重点支持了tag。这是一个很重要的信号,标志着老一代的statsd、graphite逐步让步于支持tag的influx以及prometheus。
code4it
2018/09/17
2.2K0
相关推荐
聊聊jvm的direct buffer统计
更多 >
交个朋友
加入架构与运维工作实战群
高并发系统设计 运维自动化实践
加入前端工作实战群
前端工程化实践 组件库开发经验分享
加入[后端] 腾讯云技术交流站
后端架构设计 高可用系统实现
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档