# Questions on threejs LoD memory impact

**URL:** <https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536>\
**Category:** Questions\
**Tags:** lod\
**Created:** [October 30, 2019, 4:53pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536 "2019-10-30T16:53:10Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [October 30, 2019, 4:53pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/1 "2019-10-30T16:53:10Z")

</div>

Hi,  
I have a question on memory usage of LoD module in threejs. I have a huge scene where I added several lod instances with just the low details at loading time. When I zoom in, if the camera gets closer to a lod, I asynchronously download the higher detail level and add them to the LoD.

There comes the issue, when I zoom out, I guess the memory is still allocated for the higher level of the LoD. Is there a way to “dispose” the geometry/material associated to the high level of LoD ?

---

<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:** [October 30, 2019, 9:32pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/2 "2019-10-30T21:32:36Z")

</div>

> [@DerouineauNicolas](#):
>
> Is there a way to “dispose” the geometry/material associated to the high level of LoD ?

I’m not sure what you mean here. Are you talking about CPU or GPU memory? Do you want to keep the high-resolution levels in the `LOD` object and only free the underlying data?

In any event, the following guide should explain how to dispose of various `three.js` entities like materials and geometries. Calling `.dispose()` on your geometry and material objects will free the GPU geometry buffer data and shader programs. However, as long as you have references to objects of `THREE.BufferGeoemtry` and `THREE.Material`, they will stay in memory and not GC collected.

[https://threejs.org/docs/index.html#manual/en/introduction/How-to-dispose-of-objects](https://threejs.org/docs/index.html#manual/en/introduction/How-to-dispose-of-objects)

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [October 31, 2019, 8:30am UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/3 "2019-10-31T08:30:33Z")

</div>

Thanks for your feedback.  
I’m talking about CPU memory (altough I’m not sure what happens with GPU memory when the higher level is not displayed).  
Correct me If I’m wrong, lod.addLevel(mesh) adds a reference to the mesh, so calling .dispose() on the geometry/material will have no effect, right ?  
Would it make sense to have a lod.removeLevel(obj, dist) function ?

---

<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:** [October 31, 2019, 9:13am UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/4 "2019-10-31T09:13:31Z")

</div>

> [@DerouineauNicolas](#):
>
> Correct me If I’m wrong, lod.addLevel(mesh) adds a reference to the mesh, so calling .dispose() on the geometry/material will have no effect, right ?

It has an effect but primarily on GPU memory.

> [@DerouineauNicolas](#):
>
> Would it make sense to have a lod.removeLevel(obj, dist) function ?

I’m not sure I understand the workflow in which this method would be useful. When the user zooms in again, you also need the respective high-resolution LOD levels. It’s definitely no good approach to download, parse and GPU-upload these resources every time when this happens.

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [October 31, 2019, 9:30am UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/5 "2019-10-31T09:30:11Z")

</div>

> I’m not sure I understand the workflow in which this method would be useful. When the user zooms in again, you also need the respective high-resolution LOD levels. It’s definitely no good approach to download, parse and GPU-upload these resources every time when this happens.

I have a scene which is composed of 12 GB high resolutions meshes, where the average size of a mesh is 200mb. I created low/medium resolution meshes with an average size of 1/10 mb. I have one lod instance per mesh. If I keep the high resolution meshes in CPU memory, the memory usage rapidly hits 2 GB. This is why I’m looking for a way to offload CPU memory of these high resolution meshes when the camera is far from the lod.

---

<div class="post-metadata">

**Author:** ![Usnul](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/usnul/32/2355_2.png) [@Usnul](https://discourse.threejs.org/u/Usnul)\
**Post date:** [October 31, 2019, 2:32pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/6 "2019-10-31T14:32:10Z")

</div>

what you probably want is a loading cache and a custom LOD system. You can write your own loading cache or look for an NPM module, a custom LOD system can probably be built on top of what three.js already offers.

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [October 31, 2019, 2:40pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/7 "2019-10-31T14:40:09Z")

</div>

I think I can try to rely on the caching system of the webbrowser to avoid downloading again the most detailed tiles. The LoD mecanism provided by threejs works perfectly for my usecase, but it’s just lacking an API to remove a specific level in a given LoD.

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [October 31, 2019, 3:33pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/8 "2019-10-31T15:33:38Z")

</div>

I found out that lod.remove(mesh) works fine for what I wanted to do.

---

<div class="post-metadata">

**Author:** ![Usnul](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/usnul/32/2355_2.png) [@Usnul](https://discourse.threejs.org/u/Usnul)\
**Post date:** [October 31, 2019, 5:28pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/9 "2019-10-31T17:28:47Z")

</div>

If you you think that’s the best way for you. I’m sure you understand your use-case better than I 🙂

---

<div class="post-metadata">

**Author:** ![EliasHasle](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/eliashasle/32/3010_2.png) [@EliasHasle](https://discourse.threejs.org/u/EliasHasle)\
**Post date:** [October 31, 2019, 5:52pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/10 "2019-10-31T17:52:40Z")

</div>

When running out of memory is a real concern, you don’t really have any choice but to remove things from memory, so I think your solution makes sense.

Just out of curiosity: Do you manage to render a lower LOD in the zoomed state, before the high-res model is loaded?

---

<div class="post-metadata">

**Author:** ![11118](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/11118/32/6656_2.png) [@11118](https://discourse.threejs.org/u/11118)\
**Post date:** [November 3, 2019, 2:24am UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/11 "2019-11-03T02:24:03Z")

</div>

I’d use a LRU cache to reference the chunks. Dispose the oldest when the cache is full. For a cache miss, re-download the chunk.

Chunks may not have same RAM occupancy in some applications. The cache limit is no longer the number of chunks, but the total RAM cost of the chunks.

---

<div class="post-metadata">

**Author:** ![EliasHasle](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/eliashasle/32/3010_2.png) [@EliasHasle](https://discourse.threejs.org/u/EliasHasle)\
**Post date:** [November 3, 2019, 9:14am UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/12 "2019-11-03T09:14:06Z")

</div>

LRU as in “Least Recently Used”, if I am not mistaken. 👍

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [November 4, 2019, 9:44am UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/13 "2019-11-04T09:44:31Z")

</div>

> Just out of curiosity: Do you manage to render a lower LOD in the zoomed state, before the high-res model is loaded?

Yes, no issue on that side.

In the end, my solution:

`lodinstance.remove(high_level_mesh);`  
`high_level_mesh.geometry.dispose();`  
`lodinstance.update();`

is not working properly, I see that CPU memory is still allocated …

---

<div class="post-metadata">

**Author:** ![EliasHasle](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/eliashasle/32/3010_2.png) [@EliasHasle](https://discourse.threejs.org/u/EliasHasle)\
**Post date:** [November 4, 2019, 10:56am UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/14 "2019-11-04T10:56:53Z")

</div>

After digging halfway into the source code, I think `geometry.dispose()` does not remove the data in the geometry object, but removes the GPU-side data. I may be wrong, though. Should be easy to check… Update: Checked with a simple `SphereBufferGeometry`. The data is not removed when I call `dispose()`.

This was also mentioned by @Mugen87 above:

> [@Mugen87](#):
>
> Calling `.dispose()` on your geometry and material objects will free the GPU geometry buffer data and shader programs. However, as long as you have references to objects of `THREE.BufferGeoemtry` and `THREE.Material` , they will stay in memory and not GC collected.

You can explicitly remove the attributes from the geometry, or simply “lose” all references to it. I guess removing the attributes explicitly is safer, and possibly faster.

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [November 4, 2019, 1:13pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/15 "2019-11-04T13:13:11Z")

</div>

I was hoping that calling lod.remove(mesh) would remove all reference to the mesh, but as you said, no luck here.

Thanks for you help, I’m going to try what you suggest.

---

<div class="post-metadata">

**Author:** ![EliasHasle](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/eliashasle/32/3010_2.png) [@EliasHasle](https://discourse.threejs.org/u/EliasHasle)\
**Post date:** [November 4, 2019, 1:23pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/16 "2019-11-04T13:23:00Z")

</div>

You could try:

```auto
highResMesh.geometry.dispose();
lod.remove(highResMesh); //Update: Not this. See my next comment.
highResMesh = null; //removes another reference

```

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [November 4, 2019, 2:20pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/17 "2019-11-04T14:20:16Z")

</div>

```auto
highResMesh.geometry.dispose();
lod.remove(highResMesh);
highResMesh = null; //removes another reference

```

it’s doing some weard stuff. Before lod.remove() call, lod children number is 2 (high and low), and after it’s only one, so from the lod perspective, it seems ok.

But if I print the renderer.info with:  
`console.log(renderer.info);`

I see that both geometries/material/texture are still present.

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [November 4, 2019, 3:45pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/18 "2019-11-04T15:45:56Z")

</div>

I finally managed to offload CPU memory with an ugly hack:

```auto
highResMesh.geometry.dispose();
lod.remove(highResMesh);
highResMesh = null; //removes another reference
lod.levels.shift();
lod.levels[0].object.visible = true;

```

The mesh were still referenced in the levels attributes of the LOD.

This confirms my opinion that a specific API is needed (at least in my usecase).

---

<div class="post-metadata">

**Author:** ![EliasHasle](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/eliashasle/32/3010_2.png) [@EliasHasle](https://discourse.threejs.org/u/EliasHasle)\
**Post date:** [November 4, 2019, 4:04pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/19 "2019-11-04T16:04:13Z")

</div>

Hm, why do you call `lod.remove(highResMesh)`? This implies that `highResMesh` is a child of `lod`. I thought it was really a level. But there is no method `lod.removeLevel` yet. `Object3D.remove` “works” (fails without complaining) when called with an object which is not a child…

---

<div class="post-metadata">

**Author:** ![DerouineauNicolas](https://avatars.discourse-cdn.com/v4/letter/d/dc4da7/32.png) [@DerouineauNicolas](https://discourse.threejs.org/u/DerouineauNicolas)\
**Post date:** [November 4, 2019, 4:20pm UTC](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536/20 "2019-11-04T16:20:29Z")

</div>

You’re right, it’s useless to call lod.remove() !

[Next page](https://discourse.threejs.org/t/questions-on-threejs-lod-memory-impact/10536.md?page=2)