是否考虑服务器响应时间在第一次内容油漆报告通过谷歌灯塔？

Question

我想弄清楚谷歌灯塔提供的FCP是否包含服务器用来响应的时间。

据我所见，浏览器性能API和谷歌灯塔提供的价值是不同的。

例如，我构建了一个简单的演示服务器，通过查询param来控制响应速度：

const path = require('path');
const express = require('express');

const port = 6789;
const app = express();

app.get('/index', (req, res) => {
  setTimeout(() => {
    res.sendFile(path.resolve(__dirname, './index.html'));
  }, Number(req.query.delay || 0));
});

app.listen(port);
console.log('server started on port %s', port);

我以10秒的延迟(如http://localhost:6789/index/?delay=10000 )向此服务器提出请求，加载后，我运行脚本在控制台中获取FCP的值：

window.performance.getEntriesByName('first-contentful-paint')[0].startTime;
// 10113.205000001471

然而，当我使用相同的10秒延迟http://localhost:6789/index/?delay=10000运行谷歌灯塔时，我看到FCP仅为0.8秒，不到1秒。

​

​

我的假设是Google灯塔不包括服务器负载时间，但是它是在什么时候开始测量度量的呢？以下是官方网站医生的引文-

FCP测量用户导航到页面后浏览器呈现第一部分DOM内容所需的时间。(来源- medium=devtools)

有人有主意吗？谢谢!

Answer 1

可能是灯塔的窃听器。看到了一些人们被称为抱怨灯塔局部结果不准确的事件

让我们假设这不是个窃听器。通常，服务器响应时间直接影响第一次内容绘制。但是现在(静态的)资产是由浏览器缓存的，或者如果你使用的是渐进的web应用程序，那么浏览器就会优雅地处理缓慢的后端。

灯塔将FCP定义为：

第一个内容油漆:第一个内容涂料是浏览器第一次在屏幕上绘制任何内容(文本、图像、画布等)。

灯塔应该提供截图/电影片视图，这应该与FCP匹配。也就是说，看看你是否在1s之前看到屏幕上的活动，即使你减慢了服务器响应时间。如果是这样，

( a)清除缓存，重新加载页面，并查看在“网络面板谷歌开发工具”中看到的内容

( b)清除应用程序数据( -> Application ->清除存储->清除站点数据)。那就试着跑

希望这能有所帮助。