How to measure Graphic Memory Usage of a WebGL application

Question

I have seen several applications to profile DirectX and OpenGL applications, which measure Graphic Memory Usage. I were not able to find anything similar for WebGL.

Answer 1

On Mac, there's the OpenGL Driver Monitor that lets you track GPU memory use and what the GL driver is doing. On Windows, you could use the DirectX tools to hook up to Chrome's GPU process. It should give you data on the WebGL activity as on Windows Chrome is using the ANGLE OpenGL->DirectX translator to drive WebGL.

Answer 2

You can view GPU Memory in chrome by More Tools->Task manager

Answer 3

For one, there's no way to query that with Javascript at this point. There's actually some security concerns, in that detailed GPU memory data could be used to create a system fingerprint for tracking without the users knowledge.

But I'm guessing you're more concerned about debugging your own app, not creating a monitoring tool. For that in Chrome at least you can derive some information from the about:memory tab. In there you'll see a "GPU" section that gives you a really high-level idea of the video memory usage for the browser. Yeah, that's the whole browser, not just your tab. But it's not that hard to make sure your tab is the only one running at the time for more accurate stats.

I'm sure that's not the answer that you want, but it's all we've got for the moment. Undoubtedly as WebGL becomes a bigger part of the web we'll evolve better tools for it, but until then... welcome to being an early adopter!