Question

I'm trying to measure the time it takes for a browser to load some sort of heavy graphic using an onload event.

So far I was only able to measure the time it takes for some image to load, however I want to differentiate clients using these measurement results - so a heavier graphic action is required.

Is it possible to measure the loading time of some sort of heavy graphic on a browser in this matter? (maybe by combining webgl?)

Was it helpful?

Solution

WebGL gives you only possibility to establish connection between javascript and shaders. But it doesn't supply any information about device performance.

It is possible to write small program with WebGL and guess client GPU performance with FPS calculation (http://jsfiddle.net/vZP3u/). With few different shaders it is possible to do useful guess. But in some cases testing can be considered as DOS attack and browsers dont (shouldn't) allow you to do that (tests might crush whole browser --> people will not visit your site).

Also these data can you get with WebGL: http://analyticalgraphicsinc.github.io/webglreport/

Summary, native javascript doesn't supply information about device. You can only run tests to guess some data. You can use ajax to get clue about download/upload speed, pure js for CPU performance or WebGL shader for GPU performance. But all tests are very dependent on what is client doing at the moment with his device.

In addition, browsers sometimes offer way to get some data. For example G chrome console.memory, but it is not crossbrowser method how to get something.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top