Используя Puppeteer, как я могу получить DOMContentLoaded, время загрузки

Question

Используя Puppeteer, как я могу получить DOMContentLoaded, время загрузки.Было бы здорово, если бы кто-то когда-нибудь мог объяснить, как получить доступ к объекту dev tools, Network from Puppeteer.

Answer 1

Возможно, вы спрашиваете о window.performance.timing, вот простой пример того, как получить эти данные в Puppeteer:

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://en.wikipedia.org');

  const performanceTiming = JSON.parse(
    await page.evaluate(() => JSON.stringify(window.performance.timing))
  );
  console.log(performanceTiming);

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

Но результаты довольно необработанные и не имеют смысла.Вы должны рассчитать разницу между каждым значением и navigationStart, вот полный пример того, как это сделать (код взят из этой статьи ):

const puppeteer = require('puppeteer');

const extractDataFromPerformanceTiming = (timing, ...dataNames) => {
  const navigationStart = timing.navigationStart;

  const extractedData = {};
  dataNames.forEach(name => {
    extractedData[name] = timing[name] - navigationStart;
  });

  return extractedData;
};

async function testPage(page) {
  await page.goto('https://en.wikipedia.org');

  const performanceTiming = JSON.parse(
    await page.evaluate(() => JSON.stringify(window.performance.timing))
  );

  return extractDataFromPerformanceTiming(
    performanceTiming,
    'domContentLoadedEventEnd',
    'loadEventEnd'
  );
}

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  console.log(await testPage(page));
  await browser.close();
})();