Performance problem with outputEncoding and reflection in linux

morpheus713 · February 20, 2020, 8:07pm

If I open example webgl_mirror.html and add renderer.outputEncoding = THREE.sRGBEncoding; around line 56, I get a massive performance drop. The animation is stuttering and really slow. If I remove the line the animation is smooth again.

I also observed this in the release version of r113.

I use linux, ubuntu 19.10 and I can observer this both in Firefox and Chrome. (More severe in Firefox)

Has anyone else encountered this problem? Should I open a github issue?

Mugen87 · February 20, 2020, 8:47pm

The problem is that the encoding of the renderer and the internal render target of Reflector are different. That means all shader programs are recompiled per frame which of course totally kills the performance.

If you need sRGBEncoding, you can fix the issue by adding encoding: sRGBEncoding to the following parameters object in Reflector:

github.com

mrdoob/three.js/blob/34f9b0ebe4c1ea705b605465814375442a5131cd/examples/jsm/objects/Reflector.js#L55-L60


      
          	var parameters = {
          		minFilter: LinearFilter,
          		magFilter: LinearFilter,
          		format: RGBFormat,
          		stencilBuffer: false
          	};

Please verify first if the above approach fixes your issue. If so, I think it could still be valuable to report this at github. Ideally objects like Reflector could automatically derive the correct encoding from WebGLRenderer in some way.

morpheus713 · February 20, 2020, 9:03pm

Hi Mugen87, this indeed fixed the problem. Question: Can I set encoding: sRGBEncodingin the release version? I don’t see how (or I miss something) Should I copy Reflector.js to my project? What would be a good approach fixing this for my project using r113?

I’m happy to open up a github issue if this helps…

Mugen87 · February 21, 2020, 10:11am

Yes, you have to do this right now. In the meantime, I’ll investigate if the encoding settings can somehow be automated.

morpheus713 · February 21, 2020, 2:05pm

Corresponding github issue: https://github.com/mrdoob/three.js/issues/18699

Mugen87 · February 25, 2020, 11:31am

With R114 it will be possible to pass the encoding as a parameter to Reflector and Refractor.

yannick · March 5, 2020, 9:56pm

I have the same issue with the webgl_water example. When I add renderer.outputEncoding = THREE.sRGBEncoding; I get a huge performance drop.

We could add an encoding option to Water2.js which then passes it to Reflector and Refractor?

m1ke · December 19, 2020, 9:40pm

This should be added to the ThreeJS Documentation.

Topic		Replies	Views
I set renderer.encoding=sRGBEncoding, and now my framerate dropped to 3-4fps Questions webgl-renderer	1	610	August 4, 2020
Large lagging and fps drop with .glb file Questions performance , webgl-renderer	4	3515	June 22, 2021
WebGLRenderer outputEncoding Questions webgl-renderer	8	7484	February 20, 2020
Three JS Texture encoding optimalization problems Discussion materials , encoding	0	531	March 22, 2022
CPURenderer issues (a CPU rasterizer) Discussion webgl	2	1073	November 2, 2017

Performance problem with outputEncoding and reflection in linux

Related topics