Latency in procedural Texture

[Olgo]

Hi everybody !

 

I want to experiment my own SSAO, and render it in a proceduralTexture instead of using postProcess (for several things).

It works pretty well, but i have some "latency" when i move around my object. I guess this is due to the speed calculation difference between the procedural texture and the main frame.

Can i force the engine to "wait" my procedural Texture each frame ?

[GameMonetize]

Hi!

There must be something else as procedural textures are already in sync with main render (there is no thread in js)

[RaananW]

Or maybe just a low framerate?

[Olgo]

Thank you for your answers !

 

@RaananW, there is no problem with the framerate, 60fps on deskop, a little bit lower on mobile, but it still acceptable.

@Deltakosh, i should get the same result as using post process method ? Even if i use multiple procedural textures in the effect pipeline ? (one fore the main SSAO, one for the blur pass)

Maybe i should make a little playground to show you the problem.

[Olgo]

OK, this is an exemple of my problem :

http://www.babylonjs-playground.com/#1TDGFQ#9

I tried to make the simplest scene as possible. If you move the camera, you can see the visible "latency" between the procedural texture (in red), and the main render. The dark parts of bakground depthTexture bleeds over the objects when we move around.

[GameMonetize]

First of all thanks for the PG, this is far easier now

This issue comes from the following fact: procedural textures are generated BEFORE depth renderer.

 

Procedural textures are generated before any camera rendering (because they are independant). Then render targets (including depth renderer) are generating for every camera

 

[Olgo]

Okaaaayyyy, thank you, you're a damn wizzard, I understand now 

I don't want to use renderTargetTexture because it implies to render the scene multiple times, and it's useless since i just need to deal with the DepthRender in my texture.

Furthermore, I target mobile devices, and I want to optimize the perf.

 

The last solution that i see is to use Post effects, but I've noticed that when I use it, webgl antialiasing seems to be disabled.

 

So, what can I use instead of Procedural Textures ?

[GameMonetize]

i suggest using rendertarget actually.

DepthRenderer is a renderTarget and its render the full scene already

[Olgo]

Ok, thank you for your suggestion.

I hope it will don't drop down the FPS on mobile 

I'll tell you if it works !

[GameMonetize]

Please have a look at the depth Render

you should almost do the same: https://github.com/BabylonJS/Babylon.js/blob/e585f0417455413dbc90bd9fed1a55cae9b3b2df/src/Rendering/babylon.depthRenderer.ts

[Olgo]

Hello everybody,

I follow your advise, I tried to use renderTarget Texture instead of procedurals. Unfortunatly, it took too much ressources for my purpose :/

Is there a way to "wait" the depth Texture to be ready, before refreshing procedural texture ?

( for instance, generate SSAO in a depthbuffer onAfterRender function, or something else ?)

[GameMonetize]

do you mind sharing what you did on the PG? There must be no difference between using a renderTarget and a depthRenderer

[Olgo]

Unfortunatly, i'm not able to share the entire project (which is necessary to show you the effective perf cost).

However, i have an idea. In my opinion, the main problem is that i push the entire scene in the renderlist (like your depthbuffer). But it is totaly useless in my case.

So, if I push a simple plane facing the screen in my render list instead of the entire scene, and apply SSAO shader on it, it should works, right ?

[GameMonetize]

Correct

[Olgo]

Arf,

I tested what I said, and I now have exactly the same result has procedural workflow.

I made a PG >

http://www.babylonjs-playground.com/#1TDGFQ#15

As you can see, I use RenderTarget Texture instead of procedurals, but I still have "latency" between the texture and the main render. 

Any idea ?

[NasimiAsl]

hi  

i wanna make a  latency effect and need to make close my   imagining  and yours  i wanna  know more about your imagining

(any video sample or other media ) for latency effect ( like speed blur for objects or all scene texture have this effect when camera move ?)

[Olgo]

Hi NasimiAsl,

All scene have this effect when camera move (you can see it in my two playgrounds).

I understand what happens. Each frames, my texture is refreshed before the depth Buffer, but it should be did after.

This implies an offset of 1 frame between the two textures (my texture use the previous result of the depth Buffer since it is not refreshed yet).

I am actually playing with the refresh rate of the depth Buffer, but obviously it is not a good idea.

Is there a way to manage the renderTarget Textures order ?

[NasimiAsl]

test this

1. create scene with all texture

2. create render target for depth Buffer

3. make two postprocess

  one for get your real texture

and 2 for make your second material

4 use getTextureFromPostProcess to give it back

i have a sample (long time ago )

http://www.babylonjs-playground.com/#1HECPU#46 real textures and make post process and render target

http://www.babylonjs-playground.com/#1HECPU#45  color

http://www.babylonjs-playground.com/#1HECPU#4  set effect for my wanted color 

[Olgo]

YEAH, finally I did it !

I simply pushed manually depth buffer in the scene customRenderTargets, before pushing mine to re-order them.

It's a little bit crappy i guess, but no matter, it works !

> http://www.babylonjs-playground.com/#1TDGFQ#16

Thank you everybody for your time !

[GameMonetize]

It works! everything else does not matter

[Olgo]

Thx NasimiAsl, we replied in the same time

You're suggestion is interesting, i keep it in mind for special effects !