等待HTML内容测量第一个内容丰富的绘画

问题描述

我对设计一个测试页面感兴趣，该页面将生成带有图像（大小，数量和扩展名不同）的HTML页面。我知道可以通过使用Puppeter's setContent中的自定义HTML字符串来设置页面的内容。但是，我想从这个新生成的页面中收集First Contentful Paint。该算法将类似于以下内容：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  const navigationPromise = page.waitForNavigation();

  page.goto('file://path/to/empty.html');

  await navigationPromise;

  page.setContent(`[ Custom HTML String ]`);

  // I would like to measure this after the HTML changes
  const firstContentfulPaint = JSON.parse(
    await page.evaluate(() =>
      JSON.stringify(performance.getEntriesByName('first-contentful-paint'))
    )
  );

  console.log(`First paint: ${firstContentfulPaint[0].startTime}`);

  await browser.close();
})();

有什么建议吗？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

javascript paint