NO_LCP 页面速度洞察和灯塔
[英]NO_LCP Page speed insights and lighthouse
问题描述
Lighthouse log: PROTOCOL_TIMEOUT
灯塔日志：PROTOCOL_TIMEOUT
Channel: DevTools
Initial URL: https://dev.workscope.com/
Chrome Version: 99.0.4844.74
Stack Trace: LHError: PROTOCOL_TIMEOUT
at devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:146:58
at new Promise (<anonymous>)
at Driver$1.sendCommandToSession (devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:146:10)
at Driver$1.sendCommand (devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:146:257)
at Object.clearBrowserCaches (devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:164:899)
at resetStorageForNavigation (devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:166:447)
at async Object.prepareTargetForIndividualNavigation (devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:168:161)
at async Function.runPass (devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:214:918)
at async Function.run (devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:214:129)
at async Function._gatherArtifactsFromBrowser (devtools://devtools/bundled/devtools-frontend/front_end/third_party/lighthouse/lighthouse-dt-bundle.js:363:456)
Pagespeed insights https://pagespeed.web.dev/report?url=https%3A%2F%2Fdev.workscope.com%2F Pagespeed 见解https://pagespeed.web.dev/report?url=https%3A%2F%2Fdev.workscope.com%2F
I tried to find information about, but dont find exactly answers, maybe you know?我试图找到有关的信息，但没有找到确切的答案，也许你知道？
1 个解决方案
解决方案1
0 2022-09-23 21:40:46
When testing a basic canvas element demo from MDN , Lighthouse said:在测试来自 MDN 的基本 canvas 元素演示时，Lighthouse 说：
Something went wrong with recording the trace over your page load.
According to this github post the cause was a result of there not being any other content within the html body element, other than the canvas itself.根据此github 帖子，原因是 html 主体元素中没有任何其他内容，除了 canvas 本身。
An h1 before the canvas element and a paragraph after it, returned standard performance results in Lighthouse. canvas 元素之前的 h1 及其后的段落，在 Lighthouse 中返回标准性能结果。
Nothing in body other than canvas element:除了 canvas 元件外，没有其他东西：
<!DOCTYPE html>
<html lang="es">
<head>
<title>Canvas API - basic_example - code sample</title>
<meta charset="utf-8">
<meta name="robots" content="noindex, nofollow">
<style>
body {padding: 0; margin: 0;}
</style>
</head>
<body>
<canvas id="canvas"></canvas>
<script>
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
ctx.fillStyle = "green";
ctx.fillRect(10, 10, 150, 100);
</script>
</body>
</html>
Lighthouse said:灯塔 说道：
Please run Lighthouse again.
After adding other html content:添加其他html内容后：
<!DOCTYPE html>
<html lang="es">
<head>
<title>Canvas API - basic_example - code sample</title>
<meta charset="utf-8">
<meta name="robots" content="noindex, nofollow">
<style>
body {padding: 0; margin: 0;}
</style>
</head>
<body>
<h1>Some text in H1</h1>
<canvas id="canvas"></canvas>
<p>Lorem ipsum dolor sit amet, consectetur..</p>
<script>
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
ctx.fillStyle = "green";
ctx.fillRect(10, 10, 150, 100);
</script>
</body>
</html>
Lighthouse said:灯塔 说道：
100 Performance
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.