web性能指标含义及web-vitals

web性能指标:

  • FP (First Paint)
    首次绘制:标记浏览器渲染任何在视觉上不同于导航前屏幕内容之内容的时间点.

  • FCP (First Contentful Paint)
    首次内容绘制:标记浏览器渲染来自 DOM 第一位内容的时间点,该内容可能是文本、图像、SVG 甚至 元素.

  • LCP (Largest Contentful Paint)
    最大内容渲染 :代表在viewport中最大的页面元素加载的时间. LCP的数据会通过PerformanceEntry对象记录, 每次出现更大的内容渲染, 则会产生一个新的PerformanceEntry对象.(2019年11月新增)

  • DCL (DomContentloaded)
    DOM内容加载完毕: 当 HTML 文档被完全加载解析完成之后,DOMContentLoaded 事件被触发,无需等待样式表、图像和子框架的完成加载.

  • L (onload)
    静态资源加载完毕后触发

  • FMP (First Meaningful Paint)
    首次有效绘制 :主要元素被加载解析完成时触发。

  • CLS (Cumulative Layout Shift)
    衡量视觉稳定性

  • FID (First Input Delay)
    首次输入延迟:记录用户和页面进行首次交互操作所花费的时间。

  • TTFB (Time to First Byte)
    浏览器接收第一个字节的时间

web-vitals

web-vitals是一个前端工具,由谷歌开发维护,周下载次数:1213360(2021年04月12日),可以使用模块化的方式集成到项目中,也可以在HTML页面中直接添加

你可能感兴趣的:(web性能指标含义及web-vitals)