@swf2es/context3d 0.1.10 → 0.1.11

package/dist/webgl/context.js

@@ -1,4 +1,5 @@
 import { SAMPLER_FILTERS, SAMPLER_MIPS, SAMPLER_WRAPS, ScissorBoundsError, TextureBindingError, VERTEX_FORMATS, VertexOffsetError, } from "../backend.js";
+import { GlState } from "../device/state.js";
 import { blockBytes } from "../dxt.js";
 import { Context3DError } from "../errors.js";
 import { uploadBuffer, uploadBufferBytes, } from "./buffers.js";
@@ -17,6 +18,7 @@ const SAMPLER_FORMATS = {
 /** An owned WebGL2 context, deliberately independent of the 2D renderer. */
 export class WebGLContext3D {
     gl;
+    drawState;
     width = 0;
     height = 0;
     disposed = false;
@@ -48,6 +50,9 @@ export class WebGLContext3D {
     s3tc;
     maxAnisotropy = 1;
     vertices = new Array(8).fill(null);
+    enabledAttributes = 0;
+    indexBuffer = null;
+    texturesApplied = new Uint8Array(8);
     selected = null;
     framebuffer = null;
     texture = null;
@@ -57,8 +62,11 @@ export class WebGLContext3D {
     depthBuffer = null;
     antiAlias = 0;
     depthWrite = true;
+    depthCompare = "less";
     blendEnabled = false;
-    cullEnabled = false;
+    blendSource = "one";
+    blendDestination = "zero";
+    cullFace = "none";
     colorWrite = 15;
     stencilFront = new StencilState();
     stencilBack = new StencilState();
@@ -72,8 +80,18 @@ export class WebGLContext3D {
     scissorRight = 0;
     scissorBottom = 0;
     scissorOutside = false;
-    vertexConstants = new Float32Array(128 * 4);
-    fragmentConstants = new Float32Array(28 * 4);
+    vertexConstants = {
+        data: new Float32Array(128 * 4),
+        versions: new Float64Array(128),
+        version: 0,
+        writing: 0,
+    };
+    fragmentConstants = {
+        data: new Float32Array(28 * 4),
+        versions: new Float64Array(28),
+        version: 0,
+        writing: 0,
+    };
     pixels = new Uint8Array(0);
     topDown = new Uint8Array(0);
     vao;
@@ -89,6 +107,7 @@ export class WebGLContext3D {
         if (gl.getContextAttributes()?.antialias) {
             throw new Context3DError("unsupported", "Context3D requires a WebGL2 context with antialias: false");
         }
+        this.drawState = new GlState(gl);
         const vao = gl.createVertexArray();
         if (!vao) {
             throw new Context3DError("operation", "Context3D experiment: cannot create vertex array");
@@ -130,8 +149,13 @@ export class WebGLContext3D {
                 this.seedTarget(texture, state);
             }
         }
-        this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, state ? targetFramebuffer(state) : this.framebuffer);
-        this.gl.viewport(0, 0, texture?.width ?? this.width, texture?.height ?? this.height);
+        this.drawState.bindFramebuffer(state ? targetFramebuffer(state) : this.framebuffer);
+        this.drawState.viewport(0, 0, texture?.width ?? this.width, texture?.height ?? this.height);
+    }
+    /** Temporary attachments and separate READ/DRAW bindings bypass the hot target cache. */
+    bindFramebuffer(target, framebuffer) {
+        this.drawState.forget();
+        this.gl.bindFramebuffer(target, framebuffer);
     }
     configure(width, height, depth = false, antiAlias = 0) {
         this.alive();
@@ -163,17 +187,19 @@ export class WebGLContext3D {
                 (samples && (!resolveFramebuffer || !colorBuffer))) {
                 throw new Context3DError("operation", "Context3D experiment: cannot allocate back buffer");
             }
+            this.texturesApplied[0] = 0;
+            gl.activeTexture(gl.TEXTURE0);
             gl.bindTexture(gl.TEXTURE_2D, texture);
             gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
             gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
             gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA8, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
-            gl.bindFramebuffer(gl.FRAMEBUFFER, resolveFramebuffer ?? framebuffer);
+            this.bindFramebuffer(gl.FRAMEBUFFER, resolveFramebuffer ?? framebuffer);
             gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, texture, 0);
             if (resolveFramebuffer) {
                 if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) !== gl.FRAMEBUFFER_COMPLETE) {
                     throw new Context3DError("operation", "Context3D experiment: incomplete resolve buffer");
                 }
-                gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
+                this.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
                 gl.bindRenderbuffer(gl.RENDERBUFFER, colorBuffer);
                 gl.renderbufferStorageMultisample(gl.RENDERBUFFER, samples, gl.RGBA8, width, height);
                 gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.RENDERBUFFER, colorBuffer);
@@ -200,7 +226,7 @@ export class WebGLContext3D {
             gl.deleteRenderbuffer(depthBuffer);
             gl.deleteRenderbuffer(colorBuffer);
             gl.bindRenderbuffer(gl.RENDERBUFFER, null);
-            gl.bindFramebuffer(gl.FRAMEBUFFER, this.framebuffer);
+            this.bindFramebuffer(gl.FRAMEBUFFER, this.framebuffer);
             throw error;
         }
         gl.deleteTexture(this.texture);
@@ -337,9 +363,14 @@ export class WebGLContext3D {
     }
     setDepth(write, compare) {
         this.alive();
-        this.depthWrite = write;
-        this.gl.depthMask(write);
-        this.gl.depthFunc(this.gl[DEPTH_FUNCTIONS[compare]]);
+        if (this.depthWrite !== write) {
+            this.depthWrite = write;
+            this.gl.depthMask(write);
+        }
+        if (this.depthCompare !== compare) {
+            this.depthCompare = compare;
+            this.gl.depthFunc(this.gl[DEPTH_FUNCTIONS[compare]]);
+        }
     }
     setScissor(x, y = 0, width = 0, height = 0) {
         this.alive();
@@ -380,25 +411,39 @@ export class WebGLContext3D {
     }
     setBlend(source, destination) {
         this.alive();
+        if (this.blendSource === source && this.blendDestination === destination) {
+            return;
+        }
         const gl = this.gl;
+        const enabled = this.blendEnabled;
+        this.blendSource = source;
+        this.blendDestination = destination;
         this.blendEnabled = source !== "one" || destination !== "zero";
-        if (source === "one" && destination === "zero") {
+        if (!this.blendEnabled) {
             gl.disable(gl.BLEND);
         }
         else {
             gl.blendFunc(gl[BLEND_FUNCTIONS[source]], gl[BLEND_FUNCTIONS[destination]]);
-            gl.enable(gl.BLEND);
+            if (!enabled) {
+                gl.enable(gl.BLEND);
+            }
         }
     }
     setCulling(face) {
         this.alive();
+        const previous = this.cullFace;
+        if (previous === face) {
+            return;
+        }
         const gl = this.gl;
-        this.cullEnabled = face !== "none";
+        this.cullFace = face;
         if (face === "none") {
             gl.disable(gl.CULL_FACE);
             return;
         }
-        gl.enable(gl.CULL_FACE);
+        if (previous === "none") {
+            gl.enable(gl.CULL_FACE);
+        }
         switch (face) {
             case "back":
                 gl.cullFace(gl.BACK);
@@ -432,6 +477,9 @@ export class WebGLContext3D {
             throw new Context3DError("bufferAllocation", "Context3D experiment: cannot allocate buffer");
         }
         const target = stride === 0 ? gl.ELEMENT_ARRAY_BUFFER : gl.ARRAY_BUFFER;
+        if (stride === 0) {
+            this.indexBuffer = null;
+        }
         gl.bindVertexArray(this.vao);
         gl.bindBuffer(target, handle);
         gl.bufferData(target, bytes, gl.STATIC_DRAW);
@@ -452,17 +500,35 @@ export class WebGLContext3D {
             upload: (values, start, amount) => {
                 this.alive();
                 this.buffer(buffer);
-                uploadBuffer(gl, this.vao, buffer, state, values, start, amount);
+                try {
+                    uploadBuffer(gl, this.vao, buffer, state, values, start, amount);
+                }
+                finally {
+                    // Source getters can draw before the upload replaces the VAO's index binding.
+                    if (stride === 0) {
+                        this.indexBuffer = null;
+                    }
+                }
             },
             uploadBytes: (data, offset, start, amount) => {
                 this.alive();
                 this.buffer(buffer);
-                uploadBufferBytes(gl, this.vao, buffer, state, data, offset, start, amount);
+                try {
+                    uploadBufferBytes(gl, this.vao, buffer, state, data, offset, start, amount);
+                }
+                finally {
+                    if (stride === 0) {
+                        this.indexBuffer = null;
+                    }
+                }
             },
             dispose: () => {
                 if (!this.buffers.delete(buffer)) {
                     return;
                 }
+                if (this.indexBuffer === handle) {
+                    this.indexBuffer = null;
+                }
                 gl.deleteBuffer(handle);
                 this.bufferBytes -= bytes;
                 if (stride !== 0) {
@@ -505,17 +571,24 @@ export class WebGLContext3D {
         const state = {
             handle: null,
             targetY: null,
+            targetYValue: Number.NaN,
             attributes: [],
+            attributeMask: 0,
             vertex: [],
             vertexBank: null,
             fragment: [],
             samplers: [],
             samplerMask: 0,
+            samplersSet: false,
+            vertexVersions: new Float64Array(0),
+            fragmentVersions: new Float64Array(0),
+            vertexVersion: -1,
         };
         const program = {
             upload: (vertex, fragment) => {
                 this.alive();
                 this.program(program);
+                this.drawState.forget();
                 uploadProgram(this.gl, state, vertex, fragment);
                 if (this.selected === program) {
                     this.setProgram(program);
@@ -526,6 +599,7 @@ export class WebGLContext3D {
                     return;
                 }
                 // WebGL keeps a deleted program alive while it is still current.
+                this.drawState.forget();
                 if (this.gl.getParameter(this.gl.CURRENT_PROGRAM) === state.handle) {
                     this.gl.useProgram(null);
                 }
@@ -533,11 +607,14 @@ export class WebGLContext3D {
                 state.handle = null;
                 state.targetY = null;
                 state.attributes.length = 0;
+                state.attributeMask = 0;
                 state.vertex.length = 0;
                 state.vertexBank = null;
                 state.fragment.length = 0;
                 state.samplers.length = 0;
                 state.samplerMask = 0;
+                state.vertexVersions = new Float64Array(0);
+                state.fragmentVersions = new Float64Array(0);
                 if (this.selected === program) {
                     this.selected = null;
                 }
@@ -635,6 +712,7 @@ export class WebGLContext3D {
         if (!handle) {
             throw new Context3DError("textureAllocation", "Context3D experiment: cannot create texture");
         }
+        this.texturesApplied[0] = 0;
         gl.activeTexture(gl.TEXTURE0);
         const target = cube ? gl.TEXTURE_CUBE_MAP : gl.TEXTURE_2D;
         gl.bindTexture(target, handle);
@@ -664,12 +742,23 @@ export class WebGLContext3D {
             upload: (pixels, level = 0, face = 0, sourceWidth, sourceHeight) => {
                 this.alive();
                 this.textureState(texture);
-                uploadTexture(gl, texture, state, pixels, level, face, sourceWidth, sourceHeight, this.dxtEncoder);
+                try {
+                    uploadTexture(gl, texture, state, pixels, level, face, sourceWidth, sourceHeight, this.dxtEncoder);
+                }
+                finally {
+                    // An encoder can draw before the upload replaces unit zero's binding.
+                    this.texturesApplied[0] = 0;
+                }
             },
             uploadBytes: (data, offset, level = 0, face = 0) => {
                 this.alive();
                 this.textureState(texture);
-                uploadTextureBytes(gl, texture, state, data, offset, level, face, this.dxtEncoder);
+                try {
+                    uploadTextureBytes(gl, texture, state, data, offset, level, face, this.dxtEncoder);
+                }
+                finally {
+                    this.texturesApplied[0] = 0;
+                }
             },
             uploadCompressed: (blocks, level = 0, face = 0) => {
                 this.alive();
@@ -677,18 +766,24 @@ export class WebGLContext3D {
                 if (format === "bgra") {
                     throw new Context3DError("textureUpload", "Context3D experiment: BGRA texture given blocks");
                 }
-                uploadCompressedLevel(gl, texture, state, blocks, level, face);
+                try {
+                    uploadCompressedLevel(gl, texture, state, blocks, level, face);
+                }
+                finally {
+                    this.texturesApplied[0] = 0;
+                }
             },
             dispose: () => {
                 if (!this.textures.delete(texture)) {
                     return;
                 }
                 this.textureCounts[kind]--;
+                this.drawState.forget();
                 this.textureQuotaBytes[kind] -= quotaBytes;
                 if (this.renderTexture === texture) {
                     this.renderTexture = null;
                     this.renderDepth = false;
-                    gl.bindFramebuffer(gl.FRAMEBUFFER, this.framebuffer);
+                    this.bindFramebuffer(gl.FRAMEBUFFER, this.framebuffer);
                     gl.frontFace(gl.CW);
                     this.applyScissor();
                 }
@@ -707,6 +802,7 @@ export class WebGLContext3D {
                 state.depthBuffer = null;
                 for (let i = 0; i < this.textureSlots.length; i++) {
                     if (this.textureSlots[i] === texture) {
+                        this.texturesApplied[i] = 0;
                         this.textureSlots[i] = null;
                         this.textureMask &= ~(1 << i);
                         gl.activeTexture(gl.TEXTURE0 + i);
@@ -754,7 +850,7 @@ export class WebGLContext3D {
         }
         const gl = this.gl;
         const program = this.copyProgram(texture.cube);
-        gl.bindFramebuffer(gl.FRAMEBUFFER, target.framebuffer);
+        this.bindFramebuffer(gl.FRAMEBUFFER, target.framebuffer);
         gl.viewport(0, 0, texture.width, texture.height);
         gl.disable(gl.DEPTH_TEST);
         gl.disable(gl.STENCIL_TEST);
@@ -762,6 +858,7 @@ export class WebGLContext3D {
         gl.disable(gl.CULL_FACE);
         gl.disable(gl.SCISSOR_TEST);
         gl.colorMask(true, true, true, true);
+        this.texturesApplied[0] = 0;
         gl.activeTexture(gl.TEXTURE0);
         gl.bindTexture(texture.cube ? gl.TEXTURE_CUBE_MAP : gl.TEXTURE_2D, state.handle);
         gl.bindSampler(0, this.sampler(0));
@@ -780,7 +877,7 @@ export class WebGLContext3D {
         if (this.blendEnabled) {
             gl.enable(gl.BLEND);
         }
-        if (this.cullEnabled) {
+        if (this.cullFace !== "none") {
             gl.enable(gl.CULL_FACE);
         }
         if (this.scissor) {
@@ -800,6 +897,7 @@ export class WebGLContext3D {
         return this.targetSamples[key];
     }
     deleteMultisample(texture, target) {
+        this.drawState.forget();
         deleteMultisample(this.gl, target);
         const bytes = texture.width * texture.height * 4 * target.samples;
         this.targetColorBytes -= bytes + (target.texture ? texture.width * texture.height * 4 : 0);
@@ -822,6 +920,8 @@ export class WebGLContext3D {
         }
         this.copyProgram(texture.cube);
         this.sampler(0);
+        this.drawState.forget();
+        this.texturesApplied[0] = 0;
         const target = allocateMultisample(this.gl, texture, old, samples, depth, this.depthWrite, this.stencilWrite);
         if (same) {
             if (newDepth) {
@@ -877,7 +977,7 @@ export class WebGLContext3D {
                         throw new Context3DError("operation", "Context3D experiment: cannot create cube mip framebuffer");
                     }
                 }
-                gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
+                this.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
                 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, texture.cube ? gl.TEXTURE_CUBE_MAP_POSITIVE_X + face : gl.TEXTURE_2D, state.handle, 0);
                 if (singleDepth && !depthBuffer) {
                     if (this.targetDepthBytes + texture.width * texture.height * 4 >
@@ -905,7 +1005,7 @@ export class WebGLContext3D {
                     gl.deleteFramebuffer(framebuffer);
                 }
                 else if (framebuffer) {
-                    gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
+                    this.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
                     gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, texture.cube ? gl.TEXTURE_CUBE_MAP_POSITIVE_X + state.face : gl.TEXTURE_2D, state.handle, 0);
                     // Restore the attachment if this was the currently selected target.
                     gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_STENCIL_ATTACHMENT, gl.RENDERBUFFER, state.depthAttached ? state.depthBuffer : null);
@@ -917,7 +1017,7 @@ export class WebGLContext3D {
                     gl.deleteRenderbuffer(depthBuffer);
                 }
                 gl.bindRenderbuffer(gl.RENDERBUFFER, null);
-                gl.bindFramebuffer(gl.FRAMEBUFFER, this.renderTexture
+                this.bindFramebuffer(gl.FRAMEBUFFER, this.renderTexture
                     ? targetFramebuffer(this.textureState(this.renderTexture))
                     : this.framebuffer);
                 this.applyScissor();
@@ -978,6 +1078,8 @@ export class WebGLContext3D {
         const state = this.textureState(texture);
         if (state.dirty) {
             const gl = this.gl;
+            this.drawState.forget();
+            this.texturesApplied[0] = 0;
             resolveTarget(this.gl, texture, state, this.renderFace, this.scissor);
             gl.activeTexture(gl.TEXTURE0);
             if (texture.cube) {
@@ -986,19 +1088,19 @@ export class WebGLContext3D {
                 gl.disable(gl.SCISSOR_TEST);
                 const face = gl.TEXTURE_CUBE_MAP_POSITIVE_X + this.renderFace;
                 // The base-size depth attachment cannot accompany smaller mip images.
-                gl.bindFramebuffer(gl.FRAMEBUFFER, state.framebuffer);
+                this.bindFramebuffer(gl.FRAMEBUFFER, state.framebuffer);
                 if (state.depthAttached) {
                     gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_STENCIL_ATTACHMENT, gl.RENDERBUFFER, null);
                 }
                 for (let level = 1; level < texture.levels; level++) {
-                    gl.bindFramebuffer(gl.READ_FRAMEBUFFER, state.framebuffer);
+                    this.bindFramebuffer(gl.READ_FRAMEBUFFER, state.framebuffer);
                     gl.framebufferTexture2D(gl.READ_FRAMEBUFFER, gl.COLOR_ATTACHMENT0, face, state.handle, level - 1);
-                    gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, state.mipFramebuffer);
+                    this.bindFramebuffer(gl.DRAW_FRAMEBUFFER, state.mipFramebuffer);
                     gl.framebufferTexture2D(gl.DRAW_FRAMEBUFFER, gl.COLOR_ATTACHMENT0, face, state.handle, level);
                     const size = texture.width >> level;
                     gl.blitFramebuffer(0, 0, size * 2, size * 2, 0, 0, size, size, gl.COLOR_BUFFER_BIT, gl.LINEAR);
                 }
-                gl.bindFramebuffer(gl.FRAMEBUFFER, state.framebuffer);
+                this.bindFramebuffer(gl.FRAMEBUFFER, state.framebuffer);
                 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_CUBE_MAP_POSITIVE_X + state.face, state.handle, 0);
                 if (state.depthAttached) {
                     gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_STENCIL_ATTACHMENT, gl.RENDERBUFFER, state.depthBuffer);
@@ -1019,9 +1121,13 @@ export class WebGLContext3D {
             throw new Context3DError("disposed", "Context3D experiment: texture from another context");
         }
         // AIR accepts a disposed texture binding and reports 3663 when drawing.
+        if (this.textureSlots[index] !== texture) {
+            this.texturesApplied[index] = 0;
+        }
         this.textureSlots[index] = texture;
         this.textureMask = (this.textureMask & ~(1 << index)) | (texture ? 1 << index : 0);
         if (!texture) {
+            this.texturesApplied[index] = 0;
             this.gl.activeTexture(this.gl.TEXTURE0 + index);
             this.gl.bindTexture(this.gl.TEXTURE_2D, null);
             this.gl.bindTexture(this.gl.TEXTURE_CUBE_MAP, null);
@@ -1037,7 +1143,13 @@ export class WebGLContext3D {
         if (w < 0 || f < 0 || m < 0) {
             throw new Context3DError("operation", "Context3D experiment: invalid sampler state");
         }
-        this.samplerStates[index] = w | (f << 2) | (m << 5);
+        this.setSamplerState(index, w | (f << 2) | (m << 5));
+    }
+    setSamplerState(index, state) {
+        if (this.samplerStates[index] !== state) {
+            this.samplerStates[index] = state;
+            this.texturesApplied[index] = 0;
+        }
     }
     sampler(index) {
         let sampler = this.samplers[index];
@@ -1089,8 +1201,7 @@ export class WebGLContext3D {
         for (let i = 0; i < state.samplers.length; i++) {
             const source = state.samplers[i].source;
             if (!source.ignore) {
-                this.samplerStates[source.index] =
-                    (source.repeat ? 3 : 0) | (source.filter << 2) | (source.mip << 5);
+                this.setSamplerState(source.index, (source.repeat ? 3 : 0) | (source.filter << 2) | (source.mip << 5));
             }
         }
     }
@@ -1112,6 +1223,12 @@ export class WebGLContext3D {
         const valid = offset >= 0 && offset <= buffer.stride - (packed ? 1 : size);
         const previous = this.vertices[index];
         if (previous) {
+            if (previous.buffer !== buffer ||
+                previous.offset !== offset ||
+                previous.size !== size ||
+                previous.packed !== packed) {
+                previous.applied = false;
+            }
             if (previous.buffer !== buffer) {
                 previous.checkedIndex = null;
             }
@@ -1128,6 +1245,7 @@ export class WebGLContext3D {
                 size,
                 packed,
                 valid,
+                applied: false,
                 checkedIndex: null,
                 checkedIndexVersion: -1,
                 checkedVertexVersion: -1,
@@ -1139,10 +1257,20 @@ export class WebGLContext3D {
     setConstants(stage, first, values, count) {
         this.alive();
         const dest = stage === "vertex" ? this.vertexConstants : this.fragmentConstants;
-        range(first, count, dest.length / 4);
+        range(first, count, dest.data.length / 4);
         range(0, count * 4, values.length);
-        for (let i = 0; i < count * 4; i++) {
-            dest[first * 4 + i] = values[i];
+        dest.writing++;
+        try {
+            for (let i = 0; i < count * 4; i++) {
+                dest.data[first * 4 + i] = values[i];
+            }
+        }
+        finally {
+            // Source getters can draw, nest setters or throw after partially writing the bank.
+            dest.writing--;
+            if (count) {
+                dest.versions.fill(++dest.version, first, first + count);
+            }
         }
     }
     draw(indices, first, triangles) {
@@ -1184,9 +1312,13 @@ export class WebGLContext3D {
         }
         const maximum = validateIndices(index, first, count);
         const gl = this.gl;
-        gl.bindVertexArray(this.vao);
+        this.drawState.bindVertexArray(this.vao);
         for (let i = 0; i < 8; i++) {
-            gl.disableVertexAttribArray(i);
+            const bit = 1 << i;
+            if (this.enabledAttributes & bit & ~state.attributeMask) {
+                gl.disableVertexAttribArray(i);
+                this.enabledAttributes &= ~bit;
+            }
         }
         for (let i = 0; i < state.attributes.length; i++) {
             const slot = state.attributes[i];
@@ -1199,12 +1331,23 @@ export class WebGLContext3D {
                 throw new VertexOffsetError("Vertex attribute exceeds its stride");
             }
             validateVertices(buffer, index, binding, first, count, maximum);
-            gl.bindBuffer(gl.ARRAY_BUFFER, buffer.handle);
-            gl.enableVertexAttribArray(slot);
-            gl.vertexAttribPointer(slot, binding.size, binding.packed ? gl.UNSIGNED_BYTE : gl.FLOAT, binding.packed, binding.buffer.stride * 4, binding.offset * 4);
+            if (!binding.applied) {
+                gl.bindBuffer(gl.ARRAY_BUFFER, buffer.handle);
+                gl.vertexAttribPointer(slot, binding.size, binding.packed ? gl.UNSIGNED_BYTE : gl.FLOAT, binding.packed, binding.buffer.stride * 4, binding.offset * 4);
+                binding.applied = true;
+            }
+            const bit = 1 << slot;
+            if (!(this.enabledAttributes & bit)) {
+                gl.enableVertexAttribArray(slot);
+                this.enabledAttributes |= bit;
+            }
+        }
+        this.drawState.useProgram(state.handle);
+        const targetY = this.renderTexture ? -1 : 1;
+        if (state.targetYValue !== targetY) {
+            gl.uniform1f(state.targetY, targetY);
+            state.targetYValue = targetY;
         }
-        gl.useProgram(state.handle);
-        gl.uniform1f(state.targetY, this.renderTexture ? -1 : 1);
         for (let i = 0; i < state.samplers.length; i++) {
             const binding = state.samplers[i];
             const slot = binding.source.index;
@@ -1248,26 +1391,39 @@ export class WebGLContext3D {
             if (this.samplerFormats && binding.source.format !== SAMPLER_FORMATS[texture.format]) {
                 throw new TextureBindingError("format", slot);
             }
-            gl.activeTexture(gl.TEXTURE0 + slot);
-            gl.bindTexture(texture.cube ? gl.TEXTURE_CUBE_MAP : gl.TEXTURE_2D, resource.handle);
-            gl.bindSampler(slot, this.sampler(this.samplerStates[slot]));
-            gl.uniform1i(binding.location, slot);
+            if (!this.texturesApplied[slot]) {
+                gl.activeTexture(gl.TEXTURE0 + slot);
+                gl.bindTexture(texture.cube ? gl.TEXTURE_CUBE_MAP : gl.TEXTURE_2D, resource.handle);
+                gl.bindSampler(slot, this.sampler(this.samplerStates[slot]));
+                this.texturesApplied[slot] = 1;
+            }
+            if (!state.samplersSet) {
+                gl.uniform1i(binding.location, slot);
+            }
         }
+        state.samplersSet = true;
         if (state.vertexBank) {
-            gl.uniform4fv(state.vertexBank, this.vertexConstants);
+            if (this.vertexConstants.writing || state.vertexVersion !== this.vertexConstants.version) {
+                gl.uniform4fv(state.vertexBank, this.vertexConstants.data);
+                state.vertexVersion = this.vertexConstants.version;
+            }
         }
         else {
-            this.uniforms(state.vertex, this.vertexConstants);
+            this.uniforms(state.vertex, this.vertexConstants, state.vertexVersions);
+        }
+        this.uniforms(state.fragment, this.fragmentConstants, state.fragmentVersions);
+        if (this.indexBuffer !== index.handle) {
+            gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, index.handle);
+            this.indexBuffer = index.handle;
         }
-        this.uniforms(state.fragment, this.fragmentConstants);
-        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, index.handle);
         gl.drawElements(gl.TRIANGLES, count, gl.UNSIGNED_SHORT, first * 2);
         this.changedTarget();
     }
-    uniforms(locations, data) {
+    uniforms(locations, bank, previous) {
         for (let i = 0; i < locations.length; i++) {
-            if (locations[i]) {
-                this.gl.uniform4fv(locations[i], data, i * 4, 4);
+            if (locations[i] && (bank.writing || previous[i] !== bank.versions[i])) {
+                this.gl.uniform4fv(locations[i], bank.data, i * 4, 4);
+                previous[i] = bank.versions[i];
             }
         }
     }
@@ -1277,8 +1433,8 @@ export class WebGLContext3D {
         }
         const gl = this.gl;
         if (this.resolveDirty) {
-            gl.bindFramebuffer(gl.READ_FRAMEBUFFER, this.framebuffer);
-            gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, this.resolveFramebuffer);
+            this.bindFramebuffer(gl.READ_FRAMEBUFFER, this.framebuffer);
+            this.bindFramebuffer(gl.DRAW_FRAMEBUFFER, this.resolveFramebuffer);
             if (this.scissor) {
                 gl.disable(gl.SCISSOR_TEST);
             }
@@ -1288,7 +1444,7 @@ export class WebGLContext3D {
             }
             this.resolveDirty = false;
         }
-        gl.bindFramebuffer(gl.READ_FRAMEBUFFER, this.resolveFramebuffer);
+        this.bindFramebuffer(gl.READ_FRAMEBUFFER, this.resolveFramebuffer);
     }
     read(width = this.width, height = this.height) {
         width = Math.max(0, Math.min(this.width, Math.floor(width) || 0));
@@ -1310,7 +1466,7 @@ export class WebGLContext3D {
         this.target();
         this.resolve();
         const gl = this.gl;
-        gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, null);
+        this.bindFramebuffer(gl.DRAW_FRAMEBUFFER, null);
         if (this.scissor) {
             gl.disable(gl.SCISSOR_TEST);
         }
@@ -1344,7 +1500,7 @@ export class WebGLContext3D {
         this.gl.useProgram(null);
         this.gl.bindBuffer(this.gl.ARRAY_BUFFER, null);
         this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER, null);
-        this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, null);
+        this.bindFramebuffer(this.gl.FRAMEBUFFER, null);
         this.gl.bindTexture(this.gl.TEXTURE_2D, null);
         this.gl.deleteVertexArray(this.vao);
         this.gl.deleteFramebuffer(this.framebuffer);
@@ -1363,6 +1519,9 @@ export class WebGLContext3D {
         this.depthBuffer = null;
         this.pixels = new Uint8Array(0);
         this.topDown = new Uint8Array(0);
+        this.texturesApplied.fill(0);
+        this.indexBuffer = null;
+        this.drawState.forget();
     }
 }
 //# sourceMappingURL=context.js.map