# Adding/removing lights in realtime

**URL:** <https://discourse.threejs.org/t/adding-removing-lights-in-realtime/14432>\
**Category:** Questions\
**Tags:** lights\
**Created:** [April 20, 2020, 1:33am UTC](https://discourse.threejs.org/t/adding-removing-lights-in-realtime/14432 "2020-04-20T01:33:06Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Harold](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/harold/32/32136_2.png) [@Harold](https://discourse.threejs.org/u/Harold)\
**Post date:** [April 20, 2020, 1:33am UTC](https://discourse.threejs.org/t/adding-removing-lights-in-realtime/14432/1 "2020-04-20T01:33:06Z")

</div>

Sup folks! It’s been a while 🙂

So with this whole corona quarantine going on, I’ve decided to take a few weeks off from work to pick up a game I’ve been working on last year. I’m currently in the process of building a pure GPU particle engine, which works pretty well so far.

Now I remember something in the past about threejs (or WebGL in general) not dealing with dynamically adding/removing lights to a scene very well. I was wondering if someone has figured out a way to do this efficiently by now? I’ve been searching the internet for the past few hours (including the forums), but to no avail unfortunately.

To be specific:

- I already have a particle system in-place (using a set of custom vertex shaders that utilize interleaved buffer geometries).
- I’m trying to add a light-source that lives for a second or two for those “one-off” particle effects (explosions for example).

The lightning effects of this video describe the kind of effect I’m trying to achieve (I’m talking _purely_ about the **lightning** , _not the particle effects_): [Cartoon Effects 1 - YouTube](https://www.youtube.com/watch?v=-oJCBLuf5I8)

What is the most efficient (and easy) way to add and remove light sources?

I know there are “workarounds” to get a similar effect (billboards,sprites, etc.), but I wanted see if anyone else has some ideas about this, before I start implementing “the ususal methods”.

Thanks in advance!

---

<div class="post-metadata">

**Author:** ![looeee](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/looeee/32/59_2.png) [@looeee](https://discourse.threejs.org/u/looeee)\
**Post date:** [April 20, 2020, 2:31am UTC](https://discourse.threejs.org/t/adding-removing-lights-in-realtime/14432/2 "2020-04-20T02:31:04Z")

</div>

> [@Harold](#):
>
> I’m trying to add a light-source that lives for a second or two for those “one-off” particle effects

Can you use the same light source for all one-off effects? And do you have the budget to add an extra light to your scene? If so, then add one light (call it `particleLight` or something) and set `particleLight.visible = false` when not in use. Or fade in and out the intensity/color over the course of an explosion.

This won’t work if you have more than one explosion at the same time of course. You could scale it up to a pool with a few lights that you reuse, but it’s not going to scale well so if you need, say, 10 explosions at once you should use a different technique.

---

<div class="post-metadata">

**Author:** ![Harold](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/harold/32/32136_2.png) [@Harold](https://discourse.threejs.org/u/Harold)\
**Post date:** [April 20, 2020, 9:23am UTC](https://discourse.threejs.org/t/adding-removing-lights-in-realtime/14432/3 "2020-04-20T09:23:20Z")

</div>

Hmm, I thought about this too at first. However, my game is a lot more dynamic than that (which is partially beyond my control / based on what the player is doing/making).

The only advantage I got so far is that the camera is always looking down onto the arena, so I can probably get away with making use of non-billboard sprites to create a ‘fake’ light effect. Although I wish there was a way to let the surrounding objects ‘react’ to the light source 😅
