[SOLVED] Loading Hanging on getContext

Hi, we’re testing our project and seem to be having an intermittent issue when loading builds. Often we end up with a long hang prior to the splash screen showing (approximately 10 seconds). Looking at the Performance tab in Developer Tools it looks like it’s a call to getContext from playcanvas-stable.min.js where it’s hanging. This shows up in chrome and edge but we haven’t seen it happen with firefox. After a quick search I couldn’t find any mentions of this but any suggestions on how to avoid this would be much appreciated.

Build link

Thanks, love the engine and editor!

Hi @bolton, would you be able show which getContext call in the minified playcanvas code it’s hanging on please?

I’ve got a few ideas on what it might be related to and knowing which getContext call is hanging would help a lot :slight_smile:

Looks like it’s coming from the below in the minified code. Also appears in the standard debug from editor, seems to be line 11875 of playcanvas-stable.dbg.js in that case.

            function t(t, i) {
                var n, s;
                (n = e.call(this) || this).canvas = t, n._enableAutoInstancing = !1, n.autoInstancingMaxObjects = 16384, n.defaultFramebuffer = null, n._maxPixelRatio = 1, n._width = 0, n._height = 0, n.updateClientRect(), n.shaders = [], n.buffers = [], n.textures = [], n.targets = [], n.contextLost = !1, n._contextLostHandler = function(e) {
                    e.preventDefault(), n.contextLost = !0, n.loseContext(), n.fire("devicelost")
                }, n._contextRestoredHandler = function() {
                    n.restoreContext(), n.contextLost = !1, n.fire("devicerestored")
                };
                var r = !i || void 0 === i.preferWebGl2 || i.preferWebGl2,
                    a = r ? ["webgl2", "experimental-webgl2", "webgl", "experimental-webgl"] : ["webgl", "experimental-webgl"],
                    o = null;
                for ((i = i || {}).stencil = !0, s = 0; s < a.length; s++) {
                    try {
                        o = t.getContext(a[s], i)
                    } catch (e) {}
                    if (o) {
                        n.webgl2 = r && s < 2;
                        break
                    }
                }

Thanks!

Hmm… Not sure why it would hang here :thinking:

        // Retrieve the WebGL context
        var preferWebGl2 = (options && options.preferWebGl2 !== undefined) ? options.preferWebGl2 : true;

        var names = preferWebGl2 ? ["webgl2", "experimental-webgl2", "webgl", "experimental-webgl"] :
            ["webgl", "experimental-webgl"];
        var gl = null;
        options = options || {};
        options.stencil = true;
        for (i = 0; i < names.length; i++) {
            try {
                gl = canvas.getContext(names[i], options);
            } catch (e) { }

            if (gl) {
                this.webgl2 = preferWebGl2 && i < 2;
                break;
            }
        }

@mvaligursky Any idea here?

@bolton Are there any experimental flags on the Chrome browser that have been enabled? I can’t reproduce the issue locally.

1 Like

Sorry, some more questions :sweat_smile:

Is this only on one PC/Mac or all that it has been tested on?

Does this happen with only this project/engine? Can you try with https://threejs.org/ and http://playcanvas.github.io/#animation/blend.html please?

What specs/platform is this happening on?

Don’t seem to see it on the threejs projects. It does happen on the linked playcanvas project.

I have seen it on multiple machines. Specs for my machine below. It was first brought to my attention by the client and I confirmed with another dev that they’re seeing the same behaviour on their machine as well. I’ve attached a couple of screenshots in case that helps (dev tools with my project and the linked playcanvas animation blend project)

PC Specs
Windows 10.0.19042 Build 19042
i5-4690
16GB RAM
RTX 2070 GPU

1 Like

Thanks for this, I will log a ticket and have another go a repro’ing on a windows machine. Still at a complete loss on what it could be :thinking:

Of course. Appreciate the quick response. I’ll keep an eye on the thread.

Thanks again.

I just tested on my Dell Precision 5550 running latest Win10 + Chrome. I don’t see a pause in getContext. Can you get the same behavior in both Chrome and Firefox? Can you confirm you have the latest Nvidia drivers installed? You say this is ‘intermittent’ - how many times out of 10 does this occur on load, say?

On a desktop Windows 10 machine with 1050Ti and Ryzen 2600.

Chrome version: 90.0.4430.85
Nvidia drivers: 466.11

I’ve been constantly refreshing the browser for 10-15minutes without hitting a this issue :frowning:

I’m at a loss as well. Chrome it is consistent (will see it 10 times out 10 with the blend example) but the seemore demo loads without issue. It seems like every once and a while chrome will figure itself out and it loads fine but quitting chrome and restarting it’ll start hanging again (can’t figure out any rhyme or reason to it). Newest Nvidia drivers (466.11). Wondering about a configuration issue on my machine but doesn’t explain why two others saw the same issue. Really appreciate the two of you taking the time to investigate.

2 Likes

I would try and add logging to the engine and print out start / end times for each call to getContext there, along with its name: names[i]

Perhaps one of those names it’s having issue with?

@bolton Can you try with this version of the engine in the launch tab please?

It’s built off a branch that removes a non-possible context option and also console logs the context and timings that it is trying to get. If it hangs on this version, at least we will be able to know which once is taking the time.

Steps are here to run a custom version of the engine hosted locally: https://developer.playcanvas.com/en/user-manual/scripting/custom_engine/#launch-with-a-locally-built-engine

Basically host the file locally using something like Python http.server https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server#running_a_simple_local_http_server

And use the use_local_engine param in the URL eg https://launch.playcanvas.com/1132049?debug=true&use_local_engine=http://localhost:9000/playcanvas.dbg.js

1 Like

Thanks! I’ll give it a shot tomorrow morning and report back.

Sorry for the delay in getting back to you (rushing to finish off the last of the functionality before this goes live). Tried out the custom engine version but still having the same issue. Screenshot attached.

Not sure if this matters but I just noticed that if I have a playcanvas project (including the editor) running in another tab there’s no hang. I think what I assumed was intermittent actually might have been consistent, I just had the editor or another project open in another window occasionally when testing this. With nothing else open, the hang seems to occur every time. Also, for what it’s worth I’m seeing the same behaviour in Edge.

1 Like

Is the screenshot from the session that was slow? It looks like the application was able to grab webgl2 context in 0.01 ms, which is fine. If it is, then the issue is elsewhere…

Apologies, first screenshot was only showing as a hyperlink (reuploaded, it was 11.45 seconds for the context grab).

Thanks for the screenshots. I’m still really lost with what could be causing this and now in hail mary land.

If you can, can you please do post a screenshot of WebGL just to cover the bases https://webglreport.com/?v=2

And also try Chrome Canary and/or Beta just to see if the problem is still upstream in the future Chrome releases?


I’ve tried both Edgar and Chrome on my Windows machine and still not getting a hang during the getContext.

Can you also try forcing WebGL 1 via the launch tab options please?

No change on WebGL 1.0 or Canary. WebGL report attached.

Really appreciate the time on this. I’ll see if I can find anyone else who can replicate it but if it’s really rare or configuration related than that’s at least a silver lining.

Thanks.

1 Like