Hello everyone!
While making my game, I have made some WebGL builds from time to time to check how it looks. Turns out, making a WebGL build is not entirely as simple as Unity Learn wants one to think. After first struggling with some resolution issues, I have realized that my shadows do not get rendered in the way I want them to in the WebGL build. They do however in the editor.
Upon investigating, I saw that when Unity made the build, it included 2 Render Pipelines which was weird. In the Pproject settings for quality, I initially only had the 2 levels “Mobile” and “PC”. I deleted the mobile level since I thought this was where the seond pipeline was coming from. But now when I make a WebGL build, and I run my game in the browser, the fps are so low that I cannot do anything on my browser.
I also opened the browser console to check for error messages but since I cannot navigate it, this didn’t help much.
Does anyone have a solution to this?
Thank you in advance!
The „mobile“ render settings are used for web by default. Now you are forcing the web build to use desktop quality settings, that‘s just too much for the web especially any postprocessing but also shadows or any other „highend desktop“ quality setting for that matter. Go back to the mobile settings (reimport from another project) or tune down settings for both platforms.
WebGL rendering is currently about one to two decades behind desktop rendering in terms of features and speed. WebGPU (experimental) is about to change that.
This worked, thank you!
The only thing now is that only my UI elements get rendered to the screen. The whole scene is just brown. Why could that be?
The issue here is specifically the Additional Light Shadows option in the URP RPAsset settings when used with Forward+ renderer, which is the default renderer. It is hitting a bug in Chrome that causes the browser to come to a crawl/freeze up. The default URP PC settings has Forward+ and Additional Light Shadows enabled by default. You should really use Forward instead of Forward+ most of the time with WebGL, and if you have that Shadows setting enabled, make sure to use Forward renderer.
I do plan on getting a work-around fix for the issue, and I have a bug reported wtih Chrome about the issue. But I don’t expect Chrome will be fixing it any time soon.