首页 > 其他分享 >web前端应用性能指标测量工具有哪些?

web前端应用性能指标测量工具有哪些?

时间:2024-07-03 18:09:48浏览次数:7  
标签:web console log 前端 测量 vitals 性能指标

接上一篇介绍前端性能指标的内容,本文主要总结下一般使用的性能测量工具。
1、可以借助 Gooogle 开源的 web-vitals 库来测量一些性能指标:

import {onCLS, onINP, onLCP, onFCP, onFID, onTTFB} from 'web-vitals';
onCLS(console.log);
onINP(console.log);
onLCP(console.log);
onFCP(console.log);
onFID(console.log);
onTTFB(console.log);

2、使用 Google 提供免费的 PageSpeed Insights (PSI) 工具来测试网站的性能:
image

3、使用 Chrome Devtools 的 Lighthouse 选项卡测试性能指标:
image
image

4、可以使用浏览器的web-vitals 插件
image
image

标签:web,console,log,前端,测量,vitals,性能指标
From: https://www.cnblogs.com/csuwujing/p/18282266

相关文章

  • web前端应用性能指标优化方案有哪些?
    接上一篇介绍前端性能指标的内容,本文主要总结下一般使用的指标优化方案加载相关:FCP优化:降低服务器响应时间:确保服务器能迅速响应请求,这样浏览器就能更快地开始处理并渲染页面内容。可以通过优化服务端代码、改善静态资源的提供方式(如将图片部署到CDN)来实现。延迟加载非关......
  • web前端应用应该关注哪些性能指标?
    作为一个有经验的前端开发工程师来说,关注性能是必不可少的一项日常工作,那么应该重点关注一些什么样的性能指标呢?其实主要还是从用户体验的角度来看,一般我们会从页面加载相关、交互相关方面入手。原文:前端性能指标,一网打尽FCP:首次内容绘制LCP:最大内容绘制TTFB:首字节时间TBT:总......
  • 前端如何优雅的添加水印及去除水印
    ......
  • 教你从零开始制作一个Web蜜罐扫描器
    01想法的来源在渗透的过程中,会遇到很多蜜罐,一旦不小心踩了蜜罐,就会被溯源,所以很可怕。为了规避上面的现象,就需要把蜜罐筛出来。使用场景是在前期资产收集的过程中,搞到了一堆子域名,先筛掉一批蜜罐,留下可以攻击的纯净资产。同上得到的一份资产如下:如上图所示,大量的域名如......
  • 详解Web应用安全系列(6)安全配置错误
    Web攻击中的安全配置错误漏洞是一个重要的安全问题,它涉及到对应用程序、框架、应用程序服务器、Web服务器、数据库服务器等组件的安全配置不当。这类漏洞往往由于配置过程中的疏忽或错误,使得攻击者能够未经授权地访问系统数据或执行系统功能。安全配置错误类漏洞是指在对Web应用......
  • CentOS Stream 8 发布.net 8 webapi
    参考资料https://learn.microsoft.com/zh-cn/dotnet/core/install/linux-rhel#where-is-centos-linux 微软好像不持支.net7所以把demo换成.net8sudodnfinstalldotnet-sdk-8.0 然后就开始报错,大致意思就是无法解析,找不到地址资源进入yum的repos目录cd/etc/yum.rep......
  • 保持校园网自动登录的代码备忘: 基于webdriver和chrome
    在跑一个处理很多数据的代码,需要不间断地运行。而且最近打算回家一周,需要远程控制电脑。但是学校的校园网每到晚上就会自己断开,干脆写份脚本来保持校园网的连接这份简单的代码只包括三个部分,检测网络状态的部分,自动登录校园网的部分,循环执行的部分、importosimporttimeimpo......
  • OpenSpace Web3课程大纲
    这个OpenSpaceWeb3BootCamp区块链技术线下集训营培训的内容看起来不错,比较全面也比较深入,但我没有金钱和时间,而且似乎这个面向的应该是即将毕业的应届生,2个月脱产应该没多少工作的人参加,除了一些处于gap期的吧。年轻真好。不管怎样,在这里列一下这个培训的大纲,作为参考。夯实基......
  • 应对Web安全防护,溯源追踪攻击者。
    前言随着时代的进行,互联网站走进千家万户,网络安全问题也逐渐提上日程,国家对网络安全也欲加重视。一、重视保护现如今,大数据已成为必要发展趋势。Web网站也成为人们获取信息和企业开放产品的重要行式。提到网站,就不得不提到Web安全。仍有许多企业不重视,不在乎Web安全,只要求......
  • 打印功能实现--web端+移动端
    web端---调用本机的打印机即可 <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>PrintCustomContentandStyle</title><style>@mediaprint{/*打印时隐藏页面中的元素*/#header,#footer{......