Smooth loading of non-preloaded assets

[animech-sijo]

If we have a project where nothing is preloaded, there will be a long period when first starting the app where it freezes and stutters. It's not a pleasant experience for the user who thinks the application has loaded, but can't interact with it.

Try running this scene, and move the camera. I'm measuring around 5-10 seconds of freezing and stuttering after the application has loaded. Also, if you let the application load for a while, then move the camera around, you'll get stutters and freezing when new objects come into view. This is a quite small application, just imagine a large game world having this issue.

Is there a way to smooth out these loading times?

[mvaligursky]

The main cost here from a quick profile is the shader compilation. While the shaders are being compiled / linked, the main thread is locked up.
A possible solution would be parallel shader compilation extensions. I've recently done some testing of this on multiple platforms, and it's not working / providing benefits as expected: https://github.com/mvaligursky/webgl-parallel_shader_compile

Both Chromium and WebKit based browsers have issues with this, and cannot deliver smooth experience.

When this is fixed in browsers (which might not be done very soon unfortunately), we could implement a solution where we simply don't render meshes using materials with shaders that have not finished compiling yet. (This would likely be a per material opt in, as it's not suitable for every use case).

Apart from this, keeping the shaders smaller makes them compile faster, especially on windows. If clustered lights are not needed, disable them. If area lights are not needed, disable them (disabled by default). And set up materials the same way as much as possible to avoid large number of shader variants being compiled - see pc.Tracing class where you can enable logging of shader creation and also compilation times.

[animech-sijo]

I see, so it's not the assets loading that's the problem.

Just a thought, but would it be possible to compile shaders during the preload phase? Can a placeholder/empty texture be used during this phase instead of the non-preloaded textures, just to compile the necessary shader variant? My lack of knowledge of shaders may be showing here...

Another thought I had was if texture streaming (á la Unreal, or Sketchfab) could solve some issue here? What if the lowest resolution mips were loaded first, and then progressively higher resolutions were loaded? It might not solve the shader compilation bottleneck, but it could smoothen the startup experience. Even if there was no shader compilation bottleneck, there would still be a point after initialization where no textures are loaded, where we're waiting for them to download. If we could get a low resolution version first, I think it would be way less jarring for the user.

[mvaligursky]

I answered a similar question here very recently:
https://forum.playcanvas.com/t/solved-application-will-stutter-in-the-intro-animation/29036/31

It seems on Windows, in your case, we also see a texture decode taking place, which is more costly than expected, and @slimbuck was keen to investigate it a bit soon.

We're also considering texture streaming, it's definitely on the table.