16

I am trying to take a screenshot of a webpage with PhantomJS. Specifically, I am using the example of capturing espn.com from this example. My code looks like this:

var page = new WebPage(); 
    page.open('http://www.espn.com', function (status) {
    page.render('fb.png');
    phantom.exit();
});

I then go to my PhantomJS directory with either my terminal or command prompt and run:

phantomjs shotty.js

Everything runs great, however it takes 6-8 seconds to complete the output image. Is that normal? Is there a faster way to accomplish this so that it completes in a second or less?

I am using CentOS and Windows 7. Both boxes have 8GB of RAM, 3.2 GHz CPU, and I'm getting 22Mbp/s down and 1Mbp/s up on speedtest.net

Community
  • 1
  • 1
Chris
  • 14,325
  • 14
  • 53
  • 73

3 Answers3

24

Well, in my case, the page was waiting for some GET requests and was not able to reach the requests' server and it kept waiting for long. I could only figure it out when i used the remote debugger option.

phantomjs --remote-debugger-port=9000 loadspeed.js <some_url>

and inside the loadspeed.js file add this below code:

page.onResourceRequested = function (req) {
    console.log('requested: ' + JSON.stringify(req, undefined, 4));
};

page.onResourceReceived = function (res) {
    console.log('received: ' + JSON.stringify(res, undefined, 4));
};

and then loading localhost:9000 in any webkit browser (safari/chrome) and seeing the console logs where i could figure out it was waiting for some unreachable requests for a long time.

TO BYPASS THIS - REDUCE THE TIMEOUT by adding below to the same loadspeed.js file:

page.settings.resourceTimeout = 3000; //in milliseconds

and things were very quick after that. Hope this helps

Devaroop
  • 7,315
  • 2
  • 33
  • 33
  • 1
    +1 and I wanted to add that by controlling timeout you can skip waiting for the whole page to load and work with a partial page. – Efreeto Feb 11 '15 at 22:37
  • This was a big help. +1 – Aaron Lozier Mar 26 '16 at 04:15
  • This is not a complete and working example and therefor not that helpful. – Pius Raeder Jul 12 '16 at 07:30
  • 1
    This was extremely helpful. Thank you. @Myz, here's a complete working example: var page = require('webpage').create(), address = 'your url'; page.settings.resourceTimeout = 3000; page.open(menuURL, function(status) { if (status === 'success') { /*success code here*/ } } – huwiler Aug 29 '16 at 16:49
  • How do I use the remote debugger? It shows me a link named loadspeed.js, then when I click into it, a F12-like page is appeared but no any data in it. – Romulus Urakagi Ts'ai Nov 15 '16 at 06:27
  • It doesn't help, if I use `page.evaluate` to check for the existence of an element, it takes 10 sec to complete, in chrome less than a 6 sec with `cache disabled`. – Legends Jan 31 '18 at 08:21
  • I checked it again, the request completes very fast in my case, but it takes up to 7s for the phantomjs.exe process to be created, that is what is slow here. I am not sure, if it is possible to create the process once and reuse it for further requests...perhaps someone knows. – Legends Jan 31 '18 at 15:32
9

Yes this is normal. When you attempt to render, PhantonJS will still wait for the page.open event to fire the load event to signify that the entire DOM has been loaded.

Take a look at what happens when I load espn.com locally on my system. It takes ~2 seconds for DOMContentLoaded to finish, and then ~7 seconds for the ready event to fire.

enter image description here

Alexis Tyler
  • 1,515
  • 6
  • 26
  • 44
Layke
  • 45,997
  • 10
  • 79
  • 109
  • The operation itself should be fast, depending on the page. The slow thing is the process creation of phantomjs.exe! – Legends Jan 31 '18 at 15:31
2

I didn't thought that the following would work but for me it did (on Windows):

open Internet Explorer > Internet Options > Connections > LAN Settings and disable the "Automatically detect settings"

original Post: https://plus.google.com/+MatthiasG%C3%B6tzke/posts/9v9BMCJj2k6

ducci
  • 239
  • 2
  • 13