Scene freezes when adding dynamically PointLight

Good day everyone, I have such a question, when a point of light is dynamically added to the scene, the scene freezes for a second and a half, everything is in a motionless state, how can this be processed?

In more detail, there is a scene with complete darkness, when adding fire to the sword, I add a point of light with a small area of illumination, and at this moment the whole game freezes for just a second.

It’s because materials are recompiled when you add or remove lights. Try and have your light from the beginning and instead change its intensity from 0 to 1. That should give you the same effect without freeze.


Thanks, I’ll try, but if, for example, I need 5 or 10 points of light, when I try to add them immediately to the scene, there will be a bug.

It turned out to be done, the freeze became less, but you have to spend additional time to accurately handle the light using the setTimeout function with a delay to add and remove from the scene, and then call a promise at the end of the process.

However, this is a crutch, not a solution, as I understand it, there is no possibility of parallel loading of data in a separate thread so as not to interfere with the mainstream.


Intersting why this callback function dont work ( .onAfterRender and .onBeforeRender ) on PointLight ?

Did you or anybody find a good solution to those freezes?
Unfortunately I can’t prevent placing lights on runtime (the user will be able to place objects with rect-area lights on them).
Is there a way to process the material recompilation in a separate thread, so that the main scene doesn’t freeze? It would be fine to at least show a loading animation or something more elegant than a freeze.

Unfortunately there is no perfect solution yet.

Maybe tiled_forward lighting: three.js examples
In old version of three.js was deffered rendering like this three.js webgl - deferred rendering