Ask YC: A way to measure page render time?
How do you measure the affect of different layouts on browsers' progressive rendering of pages?
If there was an easy way to run mozilla headless, e.g., "time moz-render-to-file <foo.html >foo.png", that would probably give you an idea (even better if moz could report timings itself). No idea how hard that would be to do, though.
What surprises me is that, in looking at all the browser rendering benchmarks online, everyone just seems to do it by hand! There must be some pragmatic way that the browser developers are benchmarking the browser speed.
Now, this time is not the same as the time that firefox takes to display the page. For this, you will have to use the start time on head and then use a js function that will be called on body onload. This can now take the difference and show you the browser rendering time alone.
I have often seen that some pages get generated in the server in under half a second, but takes more than a few seconds for firefox to render. [For example, table with lots of rows, with lots of divs and esp. if there is any dynamic modification of nodes].
Another technique I use is to also display the times for both server/browser, only when I am logged in - and also use color codes to show the severity of the situation. [Like Green for under half a second, red for over a second..etc].
There are companies you can use to measure performance of a webpage from various geographies, networks, and internet connections available from pingdom, Keynote, Gomez and other companies
I want to measure how well the browser progressively renders the page. For example if I made a layout with tables nested 50 deep, the browser would do worse at progressive rendering and have a higher render time than if I used just css.
Likewise, I'm not talking about network latency, eg pingdom, keynote(?). Or compatibility, eg gomez.
What I'd really like though would just be some kind of browser performance profiler (not js profiling.)
Or are you not allowed to edit the code? :/