3

I've been working on a raymarched project in three.js for a little over a year now and as the complexity has increased so has the initialization time. It can now take over 40 seconds to load the project in browser however once loaded runs at +60fps. I've tracked down the culprit function through performance tests and it seems to get hung up on the InitMaterial function within three's library. Does anyone have any idea as to what could be causing this hangup? Personally I believe it could be due to the amount of uniforms we use in the shader as there are quite a few of them.

You can find the code in question here. Note that the globalsinclude.glsl is where the list of uniforms is.

8
  • Normally I'd ask you to include the relevant code in your post (because your project could change or even disappear over time), but for now would you please create a tag, and replace the link to your project with the link to your tag? That will at least provide a snapshot of the current state, which exhibits the problem. Hopefully your master will eventually include a fix. :) Commented Jan 28, 2019 at 19:49
  • 1
    I usually experience a short hiccup when initializing shaders with lots of textures or huge amounts of geometry, while all that data gets loaded into the GPU. Are you passing very large amounts of data to globalsInclude.glsl? I don't think it's a uniform quantity issue, but maybe a very large attribute problem. Also, is this the link to the live version michaelwoodard.net/hypVR-Ray ? If so, I'm only experiencing a 10s delay, but it's expected that it would vary from one machine to another. Commented Jan 28, 2019 at 20:01
  • @Marquizzo there are several mat4 arrays being passed in as uniforms to the fragment shader that I've been worried about. We actually use a very simple vertex shader which doesn't make use of any attributes, which has just been embedded into index.html. Also I've noticed that it does vary from machine to machine, my main computer has a 770 and fx6000 and can open it in similar time to yours, however a more powerful one that I've used with a gtx1070 and i7 was struggling with 40 seconds or more. The more powerful one is a laptop though, I don't know how much that would affect it. Commented Jan 28, 2019 at 23:00
  • @TheJim01 I'm not certain how to do this, I thought I wasn't able to create tags until a certain reputation. If you would like I could add a snapshot of the globalsinclude file to the original post. Sorry for the incovenience. Commented Jan 28, 2019 at 23:02
  • I meant a tag in your GitHub project. Sorry for the confusion. :) Commented Jan 28, 2019 at 23:04

1 Answer 1

1

This is a problem in general with DirectX on Windows. I suspect if you try the same page on Linux or Mac or start Chrome with --use-angle=gl on Windows you'll see the time drop.

As an example you can try this ridiculous shader. It takes about 3 seconds to compile on OpenGL but in DirectX the browser will likely decide it's taking too long and reset the GPU process.

There isn't much a browser can do about that issue as it's mostly in Microsoft's court. Microsoft designed DirectX for native games. Native games can compile shaders offline. The Web can't do that because they are opaque binaries passed to the driver and could be full of exploits.

There's been talk about adding asynchronous shader compilation functions to WebGL. The shader would still take 40 seconds to compile it just wouldn't block the page. At this point though that's unlikely to happen.

The only thing I can suggest is simplify your shaders. If you have loops maybe unwrap them and see if that helps.

Sign up to request clarification or add additional context in comments.

2 Comments

I believe the fact that DirectX uses HLSL, a different shading language from GLSL, may be related to the shader compilation slowness problem, as shader compilation would then require at least two steps -- translation from GLSL to HLSL, then compilation from HLSL to GPU code or even intermediate bytecode. I don't know exactly how ANGLE compiles GLSL shaders to accommodate DirectX, though, except that in certain cases it may even involve DirectX's geometry shader stage and that, it seems to me, it involves a separate shader compiler DLL to do the work.
ANGLE does translate GLSL to HLSL. That is not the slow part. The slow part is DirectX compiling the HLSL. Btw, even on OpenGL ANGLE translates GLSL ES to GLSL. It checks that a limits of WebGL are enforced, it rewrites all variable and uniform names, it applies workarounds to buggy drivers, and many other things. Once it's done it serializes the AST into either GLSL or HLSL. That is all the same overhead regardless of whether the backend is DirectX or OpenGL

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.