# Three.js Possibly Not Using GPU?

**URL:** <https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838>\
**Category:** Questions\
**Tags:** webgl\
**Created:** [August 21, 2018, 12:50am UTC](https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838 "2018-08-21T00:50:57Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Deeptronos](https://avatars.discourse-cdn.com/v4/letter/d/8491ac/32.png) [@Deeptronos](https://discourse.threejs.org/u/Deeptronos)\
**Post date:** [August 21, 2018, 12:50am UTC](https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838/1 "2018-08-21T00:50:57Z")

</div>

It’s been a few months since I did anything with Three.js, but I hopped back in today because I had some neat ideas that I wanted to flesh out. Before I even got to working, I noticed a pretty weird issue occurring with the amount of resources that Three.js seems to be using. Now, I’m really not too in-depth on hardware and how software interacts with that hardware, but, to me, it seems as though Three.js is not using my GPU to render anything at all, and is most likely using my CPU?

[This example on the Three.js site](https://threejs.org/examples/?q=gpu#webgl_interactive_instances_gpu) is where I can most clearly notice the issue, but as soon as I load it and try to rotate the camera or mess with the settings of the scene in the UI, I get a huge amount of slowdown. When I turn on the “Render Continuously”, the FPS monitor says I’m getting like 4 frames per second, and I can really see the slowdown across the whole machine, even something as simple as moving between tabs in Chrome (the browser I use, which may have an effect on this issue? I’m not sure) takes way the hell longer than normal, and, opening Task Manager, I can see that this tab in Chrome is using about ~80% of my CPU. When I close the Chrome tab, the CPU usage total returns to a normal amount, so Three.js is obviously the culprit here. This issue is also not exclusive to this example, as I’ve gone through many of the examples on the official site, as well as some of the external sites listed on the main Three.js page, and had this issue with all of them.

For reference, I’m running Windows 10, and my GPU is a RX 470 that I’ve never had issue with, and always works with whatever I throw at it, whether it’s 3D rendering, gaming, whatever. I have 16gbs of memory that I installed under a year ago, if that has any effect on this, and have never had issues with them either. Now, my CPU is a Intel Core i5-4590 @ 3.30GHz, from like 2014, so it’s a rather outdated bit of tech, but I don’t really rely on it for anything too computationally expensive, so it’s not much of an issue for me, but it’s obviously not what I would want to use for 3D stuff.

Am I correct in assuming that Three.js isn’t using my GPU, but my CPU instead? I’ve done a light bit of searching, and it seems like, from what I’ve read, Three.js should use the GPU instead, but I don’t know much about the nitty-gritty of how Three.js works, so I could be misinformed there. Is there anything I can do to fix this issue? I can provide more info if need be.

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [August 21, 2018, 5:23am UTC](https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838/2 "2018-08-21T05:23:11Z")

</div>

It’s not possible to render with WebGL without using the GPU, so if you see anything at all (and it isn’t a CanvasRenderer example) then your GPU is working. That particular demo is expensive (I think it’s meant to show something that would be prohibitively expensive on the CPU, but it still uses quite a bit of CPU time anyway). If you open Dev Tools, start a Performance profile recording, and snapshot the result, you should see something like this:

 ![31%20PM](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/1/11f14cc85887d4cfc171b1135ea5dec41b465974.png)

There’s both GPU and CPU time there. As for why it might be slow on your computer I’m not sure, but it’s not particularly fast on my machine (2014 MBP) either. 🙂

---

<div class="post-metadata">

**Author:** ![pailhead](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pailhead/32/85_2.png) [@pailhead](https://discourse.threejs.org/u/pailhead)\
**Post date:** [August 21, 2018, 5:28am UTC](https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838/3 "2018-08-21T05:28:40Z")

</div>

Readrendertargetpixels? Is this a synchronous read?

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [August 21, 2018, 8:40am UTC](https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838/4 "2018-08-21T08:40:35Z")

</div>

Yes. `WebGLRenderer.readRenderTargetPixels()` internally uses [WebGLRenderingContext.readPixels()](https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels). This API method sends a request for pixel data to the GPU and then waits for the response. More information:

> <https://stackoverflow.com/questions/28282935/working-around-webgl-readpixels-being-slow>

---

<div class="post-metadata">

**Author:** ![pailhead](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pailhead/32/85_2.png) [@pailhead](https://discourse.threejs.org/u/pailhead)\
**Post date:** [August 22, 2018, 3:24am UTC](https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838/5 "2018-08-22T03:24:15Z")

</div>

Ah I didn’t realize this isn’t the op’s screenshot.

---

<div class="post-metadata">

**Author:** ![mrdoob](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mrdoob/32/22417_2.png) [@mrdoob](https://discourse.threejs.org/u/mrdoob)\
**Post date:** [August 22, 2018, 5:04am UTC](https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838/6 "2018-08-22T05:04:19Z")

</div>

> [@donmccurdy](#):
>
> It’s not possible to render with WebGL without using the GPU

Actually, in some Windows systems, Chrome uses SwiftShader (Sofware OpenGL Renderer) for rendering WebGL.

---

<div class="post-metadata">

**Author:** ![pailhead](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pailhead/32/85_2.png) [@pailhead](https://discourse.threejs.org/u/pailhead)\
**Post date:** [August 23, 2018, 1:21am UTC](https://discourse.threejs.org/t/three-js-possibly-not-using-gpu/3838/7 "2018-08-23T01:21:27Z")

</div>

One may also encounter this:

> **[Mesa (computer graphics)](https://en.m.wikipedia.org/wiki/Mesa_(computer_graphics))**
>
> Mesa, also called Mesa3D and The Mesa 3D Graphics Library, is an open source software implementation of OpenGL, Vulkan, and other graphics API specifications. Mesa translates these specifications to vendor-specific graphics hardware drivers.
> Its most important users are two graphics drivers mostly developed and funded by Intel and AMD for their respective hardware (AMD promotes their Mesa drivers Radeon and RadeonSI over the deprecated AMD Catalyst, and Intel has only supported the Mesa driver)....