Unity 2018 or above WebGL Transparency Issues with Deferred Rendering.

[Meheraj7]

I am building a webgl game but everytime I build the game with deferred rendering I get weird Transparency issues that are not at all present in the editor.

The transparency issue exists only for transparent and fade not opaque or cutout. The problem only occurs when I am using Deferred Rendering and note in my making of the game it is very important to use Deferred Rendering.

Here is a picture from the editor. Notice how the transparency issue isnt present here.

Any help will be greatly appreciated. Please Help, I need a fix for this as I need to use Deferred Rendering and I need to use transparency shaders for many objects like the headlights/glass etc .

Note :

• I am using Unity 2018.3.12 and I have also upgraded to Unity 2019.1 and the problem still existed.
• This problem does not exist in unity 2017.1.1
• The Shaders I am using are standard Shaders no custom shaders are being used.
• The problem is not present when using Forward Rendering.
• The problem only exists in build
• The Issue is that transparent object can be seen through opaque objects. For example from the picture the fence can be seen through the wall

[james_unity988]

Deferred rendering doesn’t support semi-transparent objects. Unity attempts to render these objects using forward rendering, but as you can see it’s not always perfect. If you truly need semi-transparent objects, you should consider sticking with forward rendering and bake as much lighting as possible and limit the number of dynamic lights you have. This will give you great lighting and low lighting overhead. If you’re using static scenes with few dynamic lights, it doesn’t make any sense to use deferred lighting.

[Stardog]

Have you tried the editor in Edit > Graphics Emulation > WebGL 2.0.

Cutout for the fence looks like what you want anyway.

[Meheraj7]

@Stardog

Have you tried the editor in Edit > Graphics Emulation > WebGL 2.0.

Cutout for the fence looks like what you want anyway.

I did, and yeah for fence its good to use cutout by used transparent for demonstration

[Meheraj7]

@james_unity988

Deferred rendering doesn’t support semi-transparent objects. Unity attempts to render these objects using forward rendering, but as you can see it’s not always perfect. If you truly need semi-transparent objects, you should consider sticking with forward rendering and bake as much lighting as possible and limit the number of dynamic lights you have. This will give you great lighting and low lighting overhead. If you’re using static scenes with few dynamic lights, it doesn’t make any sense to use deferred lighting.

So let me start by stating why I cant use Bake. I have to limit the game’s size to 100mb and my game is already 99mb
Baking will extend the size by alot. I have alot and alot of dynamic Lights in the scene about 300 lights worth. I control these lights ofcourse for optimization but the problem still sticks with me not being able to use Deferred rendering due to transparency issues. My game runs at 190fps when using deferred rendering and with Legacy Deferred(Light prepass) I only get 80fps same goes for forward rendering only 80fps. Is there anyway I can fix this transparency issue?

[Meheraj7]

The problem also exists for particles like smokes. I can see them through the wall

[richardkettlewell]

Is the wall opaque and writing to the depth buffer?
Is the fence transparent and reading from the depth buffer?

If you’re just using the Standard Shader, this means “Opaque” for the wall and “Fade” or “Transparent” for the fence.

[Meheraj7]

@richardkettlewell

Is the wall opaque and writing to the depth buffer?
Is the fence transparent and reading from the depth buffer?

If you’re just using the Standard Shader, this means “Opaque” for the wall and “Fade” or “Transparent” for the fence.

Yes

[thepalab]

I have the same issue, do you happen to solve it?