We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
关键词:首屏时间
页面首屏时间是指从浏览器开始请求页面到页面的首屏内容完全显示的时间。以下是几种计算首屏时间的方法:
一、使用浏览器性能 API 和自定义事件
<head>
performance.timing.navigationStart
例如:
<!DOCTYPE html> <html> <head> <script> const timing = performance.timing; let firstScreenLoaded = false; function onFirstScreenLoaded() { if (!firstScreenLoaded) { const firstScreenTime = performance.now() - timing.navigationStart; console.log(`首屏时间为:${firstScreenTime}ms`); firstScreenLoaded = true; } } window.addEventListener("load", function () { // 假设首屏内容加载完成的标志是某个特定元素的出现 const firstScreenElement = document.getElementById("first-screen-element"); if (firstScreenElement) { onFirstScreenLoaded(); } }); </script> </head> <body> <!-- 页面内容 --> <div id="first-screen-element">首屏关键内容元素</div> </body> </html>
二、使用可视化工具和浏览器插件
一些可视化性能分析工具,如 Lighthouse、WebPageTest 等,可以测量页面的首屏时间。
一些浏览器插件,如 PageSpeed Insights、YSlow 等,也可以提供页面性能指标,包括首屏时间的估算。
注意事项:
三、手动计时和标记
<!DOCTYPE html> <html> <head> <script> let startTime; window.addEventListener("load", function () { if (!startTime) { startTime = performance.now(); } // 假设首屏内容加载完成的标志是某个特定元素的出现 const firstScreenElement = document.getElementById("first-screen-element"); if (firstScreenElement) { const endTime = performance.now(); const firstScreenTime = endTime - startTime; console.log(`首屏时间为:${firstScreenTime}ms`); } }); </script> </head> <body> <!-- 页面内容 --> <div id="first-screen-element">首屏关键内容元素</div> </body> </html>
The text was updated successfully, but these errors were encountered:
hankliu62
No branches or pull requests
关键词:首屏时间
页面首屏时间是指从浏览器开始请求页面到页面的首屏内容完全显示的时间。以下是几种计算首屏时间的方法:
一、使用浏览器性能 API 和自定义事件
<head>
标签中插入一段 JavaScript 代码,在页面加载时记录浏览器开始导航的时间戳,即performance.timing.navigationStart
。例如:
二、使用可视化工具和浏览器插件
一些可视化性能分析工具,如 Lighthouse、WebPageTest 等,可以测量页面的首屏时间。
一些浏览器插件,如 PageSpeed Insights、YSlow 等,也可以提供页面性能指标,包括首屏时间的估算。
注意事项:
三、手动计时和标记
例如:
The text was updated successfully, but these errors were encountered: