WebGL large texture causes hidden stalling in chrome
<p>When initializing a large (4096 x 4096) texture in WebGL on Windows 10 (with Three.js) the main thread of chrome stalls for an appreciable amount of time while the profiler shows nothing happening. </p>

<p>Here's an example profile of a 4096 x 4096 texture:
<a href="https://i.stack.imgur.com/oGBJA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/oGBJA.png" alt="enter image description here"></a></p>

<p>The "plateau" at a little before 1500ms is a call to <code>texImage2D</code> in Three.js and WebGL, then the <code>requestAnimationFrame</code> code gets called twice before the phantom gap shows up.</p>

<p>What causes this? Is there something happening with the underlying WebGL code in chrome that the profiler isn't reporting? Why does the call to <code>texImage2D</code> take 90 ms, and then the blank spot happens? I would expect all the work involving loading the texture to the GPU to happen there.</p>

<p><a href="https://brenden-morales.github.io/WebGL-Texture-Test/" rel="nofollow noreferrer">Here is a link</a> that should reproduce the behavior.</p>