Question

当我尝试通过Puppeteer打开Headless chrome中的页面时，与Full Chrome相比，它需要花费很多时间。我正在尝试在 1366 * 768 视口中打开常规网站来截取屏幕截图，但是在Headless Chrome中打开普通网页需要花费大量时间。以下是我通过使用无头：真实和无头：虚假标志打开10个网址进行测试的结果

无头：假（全铬）

google.com:14279.508ms
hacks.mozilla.org:16213.428ms
apple.com:17465.563ms
gmail.com：18820.810ms
dell.com:19853.047ms
snapdeal.com:20722.319ms
flipkart.com:22994.769ms
microsoft.com:23404.095ms
hp.com:23963.416ms
amazon.com:27175.416ms

无头：真（无头铬）

google.com:157191.829ms
gmail.com：159343.018ms
snapdeal.com:309226.297ms
hacks.mozilla.org:337393.393ms
microsoft.com:369301.073ms
dell.com:397798.479ms
apple.com:398685.341ms
flipkart.com:576905.928ms
hp.com:1118683.968ms
amazon.com:2332061.166ms

重现的步骤：

在Headless Chrome和Full Chrome中执行以下脚本，设置无头：真实无头：虚假旗帜。
两种方法之间的时差很大，在Headless Chrome中，看起来它会卡住一段时间。

操作系统配置

Windows 7 Puppeteer版本0.13.0 I7 16GB Ram

代码：

var puppeteer = require('puppeteer');

async function capture(url) {
//console.log(url +': Started');
console.time(url);
const browser = await puppeteer.launch({headless:true});
const page = await browser.newPage();
page.setViewport({ width: 1366, height: 768 });
await page.goto('http://'+url, { waitUntil: 'networkidle2', timeout: 3000000 
});
await page.screenshot({path: url+'.jpg',fullPage: true});
browser.close();
console.timeEnd(url);

}

capture('hacks.mozilla.org');
capture('google.com');
capture('amazon.com');
capture('flipkart.com');
capture('snapdeal.com');
capture('dell.com');
capture('gmail.com');
capture('apple.com');
capture('microsoft.com');
capture('hp.com');

如果我遗漏了某些内容或我们如何解决此问题，请与我们联系。

Answer 1

您在await之前忘了browser.close()。另外，我不认为这个代码测试网站就像你想要的那样 - 你立即打开所有测试！我想这个版本就是你要找的：

var puppeteer = require('puppeteer');

async function capture(url) {
    console.time(url);
    const browser = await puppeteer.launch({ headless: true });
    const page = await browser.newPage();
    page.setViewport({ width: 1366, height: 768 });
    await page.goto('http://' + url, { waitUntil: 'networkidle2', timeout: 3000000 });
    await page.screenshot({ path: url + '.jpg', fullPage: true });
    await browser.close();
    console.timeEnd(url);
}

(async () => {
    await capture('hacks.mozilla.org');
    await capture('google.com');
    await capture('amazon.com');
    await capture('flipkart.com');
    await capture('snapdeal.com');
    await capture('dell.com');
    await capture('gmail.com');
    await capture('apple.com');
    await capture('microsoft.com');
    await capture('hp.com');
})();

我的MacBook pro 2015时代：

headless: false

hacks.mozilla.org: 4621.447ms
google.com: 2834.090ms
amazon.com: 9421.097ms
flipkart.com: 16224.524ms
snapdeal.com: 9883.090ms
dell.com: 4675.504ms
gmail.com: 5387.398ms
apple.com: 4229.881ms
microsoft.com: 4017.234ms
hp.com: 6187.240ms

headless: true

hacks.mozilla.org: 3888.767ms
google.com: 2220.519ms
amazon.com: 5703.504ms
flipkart.com: 17623.040ms
snapdeal.com: 7237.338ms
dell.com: 4267.592ms
gmail.com: 3167.475ms
apple.com: 3636.282ms
microsoft.com: 4190.694ms
hp.com: 5579.363ms

与全铬相比，无头镀铬花费的时间太长，无法打开任何网址

无头：假（全铬）

无头：真（无头铬）

重现的步骤：

操作系统配置

代码：

1 个答案: