WebGL and Global Illumination benchmark project

Unity Engine
1

Hey folks,

Does anyone have a benchmark project laying around to demonstrate what can be done graphically with Unity when building for WebGL? Something that pushes the bar and requires good specs.

I’m trying to build the Blacksmith environments demo for WebGL and I’ve had very little luck. I got rid of all realtime GI to replace with baked GI, remove image effects, but the scene looks awful. Looks like everything is being rendered with a diffuse shader. Lots of shaders seem to be missing given that there are pink everywhere.

Does anyone have any suggestions?

Cheers!

2

See screenshot below

2591956--181334--Screen Shot 2016-04-11 at 4.31.45 PM.jpg
2591956--181334--Screen Shot 2016-04-11 at 4.31.45 PM.jpg1940×1250 547 KB

3

I’m also getting a lot of errors in Firefox

Error: WebGL: Disallowing antialiased backbuffers due to blacklisting. UnityLoader.js:28:14
increasing TOTAL_MEMORY to 1577058304 to be compliant with the asm.js spec (and given that TOTAL_STACK=5242880) UnityLoader.js:145:2

run() called, but dependencies remain, so not running UnityLoader.js:145:2

Successfully compiled asm.js code (total compilation time 7060ms; stored in cache) 9f5b02af-da49-8e40-8af2-562aae15cbdd
pre-main prep time: 1109 ms UnityLoader.js:145:2

PlayerConnection initialized from (debug = 0) UnityLoader.js:141:3
PlayerConnection disabled - listening mode not supported UnityLoader.js:141:3
Initialize engine version: 5.3.4f1 (fdbb5133b820) UnityLoader.js:141:3
Creating WebGL 1.0 context. UnityLoader.js:141:3
Renderer: Mozilla UnityLoader.js:141:3
Vendor: Mozilla UnityLoader.js:141:3
Version: WebGL 1.0 UnityLoader.js:141:3
GLES: 0 UnityLoader.js:141:3
ANGLE_instanced_arrays GL_ANGLE_instanced_arrays EXT_blend_minmax GL_EXT_blend_minmax EXT_color_buffer_half_float GL_EXT_color_buffer_half_float EXT_frag_depth GL_EXT_frag_depth EXT_sRGB GL_EXT_sRGB EXT_texture_filter_anisotropic GL_EXT_texture_filter_anisotropic OES_element_index_uint GL_OES_element_index_uint OES_standard_derivatives GL_OES_standard_derivatives OES_texture_float GL_OES_texture_float OES_texture_float_linear GL_OES_texture_float_linear OES_texture_half_float GL_OES_texture_half_float OES_texture_half_float_linear GL_OES_texture_half_float_linear OES_vertex_array_object GL_OES_vertex_array_object WEBGL_color_buffer_float GL_WEBGL_color_buffer_float WEBGL_compressed_texture_s3tc GL_WEBGL_compressed_texture_s3tc WEBGL_depth_texture GL_WEBGL_depth_texture WEBGL_draw_buffers GL_WEBGL_draw_buffers WEBGL_lose_context GL_WEBGL_lose_context MOZ_WEBGL_lose_context GL_MOZ_WEBGL_lose_context MOZ_WEBGL_compressed_texture_s3tc GL_MOZ_WEBGL_compressed_texture_s3tc MOZ_WEBGL_depth_texture GL_MOZ_WEBGL_dept UnityLoader.js:141:3
h_texture UnityLoader.js:141:3
OPENGL LOG: Creating OpenGL ES 2.0 graphics device UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Atmospheric Scattering Sky’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Atmospheric Scattering Sky’ - Setting to default shader. UnityLoader.js:141:3
Note: Creation of internal variant of shader ‘Hidden/TonemapperLog’ failed. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TonemapperLog’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TonemapperLog’ - Setting to default shader. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard Scatter (Specular, Surface)’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard Scatter (Specular, Surface)’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard Scatter (Specular, Surface)’ - Pass ‘SHADOWCASTER’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard Scatter (Specular, Surface)’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard Scatter (Specular, Surface)’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard Scatter (Specular, Surface)’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard Scatter (Specular, Surface)’ - Pass ‘SHADOWCASTER’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard Scatter (Specular, Surface)’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard MaskyMix Scatter (Specular, Surface)’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard MaskyMix Scatter (Specular, Surface)’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard MaskyMix Scatter (Specular, Surface)’ - Pass ‘SHADOWCASTER’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard MaskyMix Scatter (Specular, Surface)’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard MaskyMix Scatter (Specular, Surface)’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard MaskyMix Scatter (Specular, Surface)’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard MaskyMix Scatter (Specular, Surface)’ - Pass ‘SHADOWCASTER’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Standard MaskyMix Scatter (Specular, Surface)’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Standard-AddPass’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Standard-AddPass’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Standard-AddPass’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Specular-AddPass’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Specular-AddPass’ - Pass ‘PREPASS’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Specular-AddPass’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Specular-AddPass’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Standard-Base’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Standard-Base’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/TerrainEngine/Splatmap/Standard-Base’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Nature/Terrain/Standard’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Nature/Terrain/Standard’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Nature/Terrain/Standard’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Undergrowth’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Undergrowth’ - Pass ‘FORWARD_DELTA’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Undergrowth’ - Pass ‘SHADOWCASTER’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Undergrowth’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Undergrowth’ - Setting to default shader. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard’ - Pass ‘FORWARD_DELTA’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard’ - Pass ‘SHADOWCASTER’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard (Specular setup)’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard (Specular setup)’ - Pass ‘FORWARD_DELTA’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard (Specular setup)’ - Pass ‘SHADOWCASTER’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard (Specular setup)’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Standard (Specular setup)’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/CameraMotionBlurDX11’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/CameraMotionBlurDX11’ - Setting to default shader. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Cloud Scatter’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Volund/Cloud Scatter’ - Setting to default shader. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Nature/Terrain/Specular’ - Pass ‘FORWARD’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Nature/Terrain/Specular’ - Pass ‘PREPASS’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Nature/Terrain/Specular’ - Pass ‘DEFERRED’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Nature/Terrain/Specular’ - All passes removed UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/FXAA Preset 3’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
Note: Creation of internal variant of shader ‘Hidden/CameraMotionBlur’ failed. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/CameraMotionBlur’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/CameraMotionBlur’ - Setting to default shader. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/NoiseAndGrainDX11’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/NoiseAndGrainDX11’ - Setting to default shader. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/AtmosphericScattering_Occlusion’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/AtmosphericScattering_Occlusion’ - Setting to default shader. UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/FXAA Preset 2’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/Volund/UndergrowthGroundCapture’ - Pass ‘’ has no vertex shader UnityLoader.js:141:3
WARNING: Shader Unsupported: ‘Hidden/Volund/UndergrowthGroundCapture’ - Setting to default shader. UnityLoader.js:141:3
UnloadTime: 0.795000 ms UnityLoader.js:141:3
The shader Hidden/CameraMotionBlur (UnityEngine.Shader) on effect Camera - Midday FPS (UnityStandardAssets.ImageEffects.CameraMotionBlur) is not supported on this platform!

9f5b02af-da49-8e40-8af2-562aae15cbdd:8555:3
The image effect Camera - Midday FPS (UnityStandardAssets.ImageEffects.CameraMotionBlur) has been disabled as it’s not supported on the current platform.

9f5b02af-da49-8e40-8af2-562aae15cbdd:8551:3
The shader Hidden/TonemapperLog (UnityEngine.Shader) on effect Camera - Midday FPS (TonemappingLog) is not supported on this platform!

9f5b02af-da49-8e40-8af2-562aae15cbdd:8555:3
The image effect Camera - Midday FPS (TonemappingLog) has been disabled as it’s not supported on the current platform.

9f5b02af-da49-8e40-8af2-562aae15cbdd:8551:3
Error: WebGL: Disallowing antialiased backbuffers due to blacklisting. 9f5b02af-da49-8e40-8af2-562aae15cbdd:6953:15
Error: WebGL: Disallowing antialiased backbuffers due to blacklisting. 9f5b02af-da49-8e40-8af2-562aae15cbdd:2003:12
Error: WebGL: blendEquationSeparate: modeRGB: invalid enum value MAX 9f5b02af-da49-8e40-8af2-562aae15cbdd:8950:2
Error: WebGL: No further warnings will be reported for this WebGL context. (already reported 32 warnings) 9f5b02af-da49-8e40-8af2-562aae15cbdd:8950:2

4

Flee in terror.

If you haven’t; then my advice is the following - build to the very best you can with 2003-era hardware.

This means simple non-PBR shaders, baked lighting done by preferably a external lightmapper (e.g. VRay, etc.). The catch is you need to then balance that against memory use (all those lightmaps will at one point be unpacked; you’re going to need to do some fancy footwork to step that over a few operations so you don’t load it onto the heap)

Some of the techniques optimised for early mobile might be worth revisiting - e.g. the sample Shadow Gun project from the Unity 3 demos might work OK – although you’re not really constrained by the same things in WebGL, it’s not a low-spec GPU, it’s a high-spec GPU with low-spec instruction sets; so you can get away with gobs of high poly meshes, you just can’t put big complex shaders on them.

5

I’m pretty sure I’ve seen PBR working in WebGL. I expect baked lighting. I also expect memory use to be complicated.
We expect our clients to have high-end specs. We can also force a user to be using a certain browser. We’re even thinking about experimenting with WebGL 2.0 in order to be using OpenGL ES 3.0. Does that change the situation a bit?

6

Kinda. We’ve found the PBR shaders look a bit ‘odd’ - flat, low-specularity and with a bit of a dull sheen.

WebGL2 does make a difference - we haven’t yet got it working without crashing on our content (yet); but in theory OpenGL ES 3.0 should be able to run most of what it should.

7

Hey AFrisby,

Just so know, 5.4.0.b14 builds to WebGL 2.0 and everything works pretty well. I’ve had Firefox crash a few times but all shading, post-effects, etc seem to be working as expecting. You should give it a shot.

8

Excellent to hear. Will give it a try