@next_term/web 0.1.0-next.0

package/dist/render-worker.js

@@ -0,0 +1,720 @@
+/**
+ * Render Worker entry point.
+ *
+ * Receives an OffscreenCanvas (transferred from the main thread) and a
+ * SharedArrayBuffer reference for the CellGrid.  Runs its own WebGL2
+ * render loop at display refresh rate via requestAnimationFrame.
+ *
+ * The worker owns the glyph atlas and all GL resources. The main thread
+ * only sends lightweight messages for cursor, selection, theme, font,
+ * and resize events.
+ */
+import { CellGrid, DEFAULT_THEME } from "@next_term/core";
+import { build256Palette } from "./renderer.js";
+import { BG_INSTANCE_FLOATS, GLYPH_INSTANCE_FLOATS, GlyphAtlas, hexToFloat4, packBgInstance, packGlyphInstance, } from "./webgl-renderer.js";
+// ---------------------------------------------------------------------------
+// Attribute bit positions
+// ---------------------------------------------------------------------------
+const ATTR_BOLD = 0x01;
+const ATTR_ITALIC = 0x02;
+const ATTR_INVERSE = 0x40;
+// ---------------------------------------------------------------------------
+// Shader sources (duplicated from webgl-renderer.ts for worker isolation)
+// ---------------------------------------------------------------------------
+const BG_VERTEX_SHADER = `#version 300 es
+in vec2 a_position;
+in vec2 a_cellPos;
+in vec4 a_color;
+uniform vec2 u_resolution;
+uniform vec2 u_cellSize;
+out vec4 v_color;
+void main() {
+  vec2 cellPixelPos = a_cellPos * u_cellSize;
+  vec2 pos = cellPixelPos + a_position * u_cellSize;
+  vec2 clipPos = (pos / u_resolution) * 2.0 - 1.0;
+  clipPos.y = -clipPos.y;
+  gl_Position = vec4(clipPos, 0.0, 1.0);
+  v_color = a_color;
+}
+`;
+const BG_FRAGMENT_SHADER = `#version 300 es
+precision mediump float;
+in vec4 v_color;
+out vec4 fragColor;
+void main() {
+  fragColor = v_color;
+}
+`;
+const GLYPH_VERTEX_SHADER = `#version 300 es
+in vec2 a_position;
+in vec2 a_cellPos;
+in vec4 a_color;
+in vec4 a_texCoord;
+in vec2 a_glyphSize;
+uniform vec2 u_resolution;
+uniform vec2 u_cellSize;
+out vec4 v_color;
+out vec2 v_texCoord;
+void main() {
+  vec2 cellPixelPos = a_cellPos * u_cellSize;
+  vec2 size = (a_glyphSize.x > 0.0) ? a_glyphSize : u_cellSize;
+  vec2 pos = cellPixelPos + a_position * size;
+  vec2 clipPos = (pos / u_resolution) * 2.0 - 1.0;
+  clipPos.y = -clipPos.y;
+  gl_Position = vec4(clipPos, 0.0, 1.0);
+  v_color = a_color;
+  v_texCoord = a_texCoord.xy + a_position * a_texCoord.zw;
+}
+`;
+const GLYPH_FRAGMENT_SHADER = `#version 300 es
+precision mediump float;
+in vec4 v_color;
+in vec2 v_texCoord;
+uniform sampler2D u_atlas;
+out vec4 fragColor;
+void main() {
+  float alpha = texture(u_atlas, v_texCoord).a;
+  fragColor = vec4(v_color.rgb, v_color.a * alpha);
+}
+`;
+// ---------------------------------------------------------------------------
+// Shader helpers
+// ---------------------------------------------------------------------------
+function compileShader(gl, type, source) {
+    const shader = gl.createShader(type);
+    if (!shader)
+        throw new Error("Failed to create shader");
+    gl.shaderSource(shader, source);
+    gl.compileShader(shader);
+    if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+        const info = gl.getShaderInfoLog(shader);
+        gl.deleteShader(shader);
+        throw new Error(`Shader compile error: ${info}`);
+    }
+    return shader;
+}
+function createProgram(gl, vertSrc, fragSrc) {
+    const vert = compileShader(gl, gl.VERTEX_SHADER, vertSrc);
+    const frag = compileShader(gl, gl.FRAGMENT_SHADER, fragSrc);
+    const program = gl.createProgram();
+    if (!program)
+        throw new Error("Failed to create program");
+    gl.attachShader(program, vert);
+    gl.attachShader(program, frag);
+    gl.linkProgram(program);
+    if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+        const info = gl.getProgramInfoLog(program);
+        gl.deleteProgram(program);
+        throw new Error(`Program link error: ${info}`);
+    }
+    gl.detachShader(program, vert);
+    gl.detachShader(program, frag);
+    gl.deleteShader(vert);
+    gl.deleteShader(frag);
+    return program;
+}
+// ---------------------------------------------------------------------------
+// Worker state
+// ---------------------------------------------------------------------------
+let canvas = null;
+let gl = null;
+let grid = null;
+let atlas = null;
+let cols = 0;
+let rows = 0;
+let dpr = 1;
+let fontSize = 14;
+let fontFamily = "monospace";
+let theme = DEFAULT_THEME;
+let palette = [];
+let paletteFloat = [];
+let themeFgFloat = [0, 0, 0, 1];
+let themeBgFloat = [0, 0, 0, 1];
+let themeCursorFloat = [0, 0, 0, 1];
+let cellWidth = 0;
+let cellHeight = 0;
+// Cursor & selection (updated via postMessage or SAB)
+let cursorRow = 0;
+let cursorCol = 0;
+let cursorVisible = true;
+let prevCursorRow = -1;
+let prevCursorCol = -1;
+let cursorStyle = "block";
+let selection = null;
+// GL resources
+let bgProgram = null;
+let glyphProgram = null;
+let quadVBO = null;
+let quadEBO = null;
+let bgInstanceVBO = null;
+let glyphInstanceVBO = null;
+let bgVAO = null;
+let glyphVAO = null;
+let bgInstances = new Float32Array(0);
+let glyphInstances = new Float32Array(0);
+let rafId = null;
+let disposed = false;
+let contextLost = false;
+// FPS tracking
+let frameCount = 0;
+let lastFpsTime = 0;
+let currentFps = 0;
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+function buildPaletteFloat() {
+    palette = build256Palette(theme);
+    paletteFloat = palette.map((c) => hexToFloat4(c));
+    themeFgFloat = hexToFloat4(theme.foreground);
+    themeBgFloat = hexToFloat4(theme.background);
+    themeCursorFloat = hexToFloat4(theme.cursor);
+}
+function measureCellSize() {
+    const measureCanvas = new OffscreenCanvas(100, 100);
+    const ctx = measureCanvas.getContext("2d");
+    if (!ctx) {
+        cellWidth = Math.ceil(fontSize * 0.6);
+        cellHeight = Math.ceil(fontSize * 1.2);
+        return;
+    }
+    ctx.font = `${fontSize}px ${fontFamily}`;
+    const metrics = ctx.measureText("M");
+    cellWidth = Math.ceil(metrics.width);
+    if (typeof metrics.fontBoundingBoxAscent === "number" &&
+        typeof metrics.fontBoundingBoxDescent === "number") {
+        cellHeight = Math.ceil(metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent);
+    }
+    else {
+        cellHeight = Math.ceil(fontSize * 1.2);
+    }
+    if (cellWidth <= 0)
+        cellWidth = Math.ceil(fontSize * 0.6);
+    if (cellHeight <= 0)
+        cellHeight = Math.ceil(fontSize * 1.2);
+}
+function resolveColorFloat(colorIdx, isRGB, g, col, isForeground) {
+    if (isRGB) {
+        const offset = isForeground ? col : 256 + col;
+        const rgb = g.rgbColors[offset];
+        const r = ((rgb >> 16) & 0xff) / 255;
+        const green = ((rgb >> 8) & 0xff) / 255;
+        const b = (rgb & 0xff) / 255;
+        return [r, green, b, 1.0];
+    }
+    if (isForeground && colorIdx === 7)
+        return themeFgFloat;
+    if (!isForeground && colorIdx === 0)
+        return themeBgFloat;
+    if (colorIdx >= 0 && colorIdx < 256) {
+        return paletteFloat[colorIdx];
+    }
+    return isForeground ? themeFgFloat : themeBgFloat;
+}
+function createGridFromSAB(buffer, c, r) {
+    // Create a CellGrid view over the shared buffer.
+    // We construct a CellGrid with matching dims then overlay the buffer.
+    // Since CellGrid constructor allocates its own buffer, we need to construct
+    // a lightweight wrapper that uses the shared buffer directly.
+    const g = Object.create(CellGrid.prototype);
+    const CELL_SIZE = 2;
+    const cellBytes = c * r * CELL_SIZE * 4;
+    const dirtyBytes = r * 4;
+    const rgbBytes = 512 * 4;
+    const cursorBytes = 4 * 4;
+    // Use Object.defineProperty to set readonly properties
+    Object.defineProperty(g, "cols", { value: c, writable: false });
+    Object.defineProperty(g, "rows", { value: r, writable: false });
+    Object.defineProperty(g, "isShared", { value: true, writable: false });
+    Object.defineProperty(g, "data", {
+        value: new Uint32Array(buffer, 0, c * r * CELL_SIZE),
+        writable: false,
+    });
+    Object.defineProperty(g, "dirtyRows", {
+        value: new Int32Array(buffer, cellBytes, r),
+        writable: false,
+    });
+    Object.defineProperty(g, "rgbColors", {
+        value: new Uint32Array(buffer, cellBytes + dirtyBytes, 512),
+        writable: false,
+    });
+    Object.defineProperty(g, "cursorData", {
+        value: new Int32Array(buffer, cellBytes + dirtyBytes + rgbBytes, 4),
+        writable: false,
+    });
+    Object.defineProperty(g, "rowOffsetData", {
+        value: new Int32Array(buffer, cellBytes + dirtyBytes + rgbBytes + cursorBytes, 1),
+        writable: false,
+    });
+    // Set private buffer field for getBuffer()
+    Object.defineProperty(g, "buffer", { value: buffer, writable: false });
+    return g;
+}
+// ---------------------------------------------------------------------------
+// GL resource management
+// ---------------------------------------------------------------------------
+function initGLResources() {
+    if (!gl)
+        return;
+    bgProgram = createProgram(gl, BG_VERTEX_SHADER, BG_FRAGMENT_SHADER);
+    glyphProgram = createProgram(gl, GLYPH_VERTEX_SHADER, GLYPH_FRAGMENT_SHADER);
+    const quadVerts = new Float32Array([0, 0, 1, 0, 0, 1, 1, 1]);
+    const quadIndices = new Uint16Array([0, 1, 2, 2, 1, 3]);
+    quadVBO = gl.createBuffer();
+    gl.bindBuffer(gl.ARRAY_BUFFER, quadVBO);
+    gl.bufferData(gl.ARRAY_BUFFER, quadVerts, gl.STATIC_DRAW);
+    quadEBO = gl.createBuffer();
+    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, quadEBO);
+    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, quadIndices, gl.STATIC_DRAW);
+    bgInstanceVBO = gl.createBuffer();
+    glyphInstanceVBO = gl.createBuffer();
+    bgVAO = gl.createVertexArray();
+    gl.bindVertexArray(bgVAO);
+    setupBgVAO(gl);
+    gl.bindVertexArray(null);
+    glyphVAO = gl.createVertexArray();
+    gl.bindVertexArray(glyphVAO);
+    setupGlyphVAO(gl);
+    gl.bindVertexArray(null);
+    if (atlas)
+        atlas.recreateTexture();
+}
+function setupBgVAO(g) {
+    const FLOAT = 4;
+    if (!bgProgram)
+        return;
+    const program = bgProgram;
+    const aPos = g.getAttribLocation(program, "a_position");
+    g.bindBuffer(g.ARRAY_BUFFER, quadVBO);
+    g.enableVertexAttribArray(aPos);
+    g.vertexAttribPointer(aPos, 2, g.FLOAT, false, 0, 0);
+    g.bindBuffer(g.ELEMENT_ARRAY_BUFFER, quadEBO);
+    g.bindBuffer(g.ARRAY_BUFFER, bgInstanceVBO);
+    const stride = BG_INSTANCE_FLOATS * FLOAT;
+    const aCellPos = g.getAttribLocation(program, "a_cellPos");
+    g.enableVertexAttribArray(aCellPos);
+    g.vertexAttribPointer(aCellPos, 2, g.FLOAT, false, stride, 0);
+    g.vertexAttribDivisor(aCellPos, 1);
+    const aColor = g.getAttribLocation(program, "a_color");
+    g.enableVertexAttribArray(aColor);
+    g.vertexAttribPointer(aColor, 4, g.FLOAT, false, stride, 2 * FLOAT);
+    g.vertexAttribDivisor(aColor, 1);
+}
+function setupGlyphVAO(g) {
+    const FLOAT = 4;
+    if (!glyphProgram)
+        return;
+    const program = glyphProgram;
+    const aPos = g.getAttribLocation(program, "a_position");
+    g.bindBuffer(g.ARRAY_BUFFER, quadVBO);
+    g.enableVertexAttribArray(aPos);
+    g.vertexAttribPointer(aPos, 2, g.FLOAT, false, 0, 0);
+    g.bindBuffer(g.ELEMENT_ARRAY_BUFFER, quadEBO);
+    g.bindBuffer(g.ARRAY_BUFFER, glyphInstanceVBO);
+    const stride = GLYPH_INSTANCE_FLOATS * FLOAT;
+    const aCellPos = g.getAttribLocation(program, "a_cellPos");
+    g.enableVertexAttribArray(aCellPos);
+    g.vertexAttribPointer(aCellPos, 2, g.FLOAT, false, stride, 0);
+    g.vertexAttribDivisor(aCellPos, 1);
+    const aColor = g.getAttribLocation(program, "a_color");
+    g.enableVertexAttribArray(aColor);
+    g.vertexAttribPointer(aColor, 4, g.FLOAT, false, stride, 2 * FLOAT);
+    g.vertexAttribDivisor(aColor, 1);
+    const aTexCoord = g.getAttribLocation(program, "a_texCoord");
+    g.enableVertexAttribArray(aTexCoord);
+    g.vertexAttribPointer(aTexCoord, 4, g.FLOAT, false, stride, 6 * FLOAT);
+    g.vertexAttribDivisor(aTexCoord, 1);
+    const aGlyphSize = g.getAttribLocation(program, "a_glyphSize");
+    g.enableVertexAttribArray(aGlyphSize);
+    g.vertexAttribPointer(aGlyphSize, 2, g.FLOAT, false, stride, 10 * FLOAT);
+    g.vertexAttribDivisor(aGlyphSize, 1);
+}
+function ensureInstanceBuffers() {
+    const totalCells = cols * rows;
+    const neededBg = totalCells * BG_INSTANCE_FLOATS;
+    const neededGlyph = totalCells * GLYPH_INSTANCE_FLOATS;
+    if (bgInstances.length < neededBg) {
+        bgInstances = new Float32Array(neededBg);
+    }
+    if (glyphInstances.length < neededGlyph) {
+        glyphInstances = new Float32Array(neededGlyph);
+    }
+}
+function syncCanvasSize() {
+    if (!canvas)
+        return;
+    const width = cols * cellWidth;
+    const height = rows * cellHeight;
+    canvas.width = Math.round(width * dpr);
+    canvas.height = Math.round(height * dpr);
+}
+// ---------------------------------------------------------------------------
+// Render
+// ---------------------------------------------------------------------------
+function render() {
+    if (disposed || contextLost || !gl || !grid)
+        return;
+    // Read cursor from SAB
+    const cursor = grid.getCursor();
+    cursorRow = cursor.row;
+    cursorCol = cursor.col;
+    cursorVisible = cursor.visible;
+    cursorStyle = cursor.style;
+    // If cursor moved, mark old and new rows dirty to erase ghost and draw fresh
+    if (prevCursorRow >= 0 &&
+        prevCursorRow < rows &&
+        (prevCursorRow !== cursorRow || prevCursorCol !== cursorCol)) {
+        grid.markDirty(prevCursorRow);
+    }
+    if (cursorRow >= 0 && cursorRow < rows) {
+        grid.markDirty(cursorRow);
+    }
+    prevCursorRow = cursorRow;
+    prevCursorCol = cursorCol;
+    // Check dirty rows
+    let anyDirty = false;
+    for (let r = 0; r < rows; r++) {
+        if (grid.isDirty(r)) {
+            anyDirty = true;
+            break;
+        }
+    }
+    if (!anyDirty)
+        return;
+    let bgCount = 0;
+    let glyphCount = 0;
+    for (let row = 0; row < rows; row++) {
+        for (let col = 0; col < cols; col++) {
+            const codepoint = grid.getCodepoint(row, col);
+            const fgIdx = grid.getFgIndex(row, col);
+            const bgIdx = grid.getBgIndex(row, col);
+            const attrs = grid.getAttrs(row, col);
+            const fgIsRGB = grid.isFgRGB(row, col);
+            const bgIsRGB = grid.isBgRGB(row, col);
+            let fg = resolveColorFloat(fgIdx, fgIsRGB, grid, col, true);
+            let bg = resolveColorFloat(bgIdx, bgIsRGB, grid, col, false);
+            if (attrs & ATTR_INVERSE) {
+                const tmp = fg;
+                fg = bg;
+                bg = tmp;
+            }
+            packBgInstance(bgInstances, bgCount * BG_INSTANCE_FLOATS, col, row, bg[0], bg[1], bg[2], bg[3]);
+            bgCount++;
+            if (codepoint > 0x20) {
+                const bold = !!(attrs & ATTR_BOLD);
+                const italic = !!(attrs & ATTR_ITALIC);
+                const glyph = atlas?.getGlyph(codepoint, bold, italic);
+                if (glyph) {
+                    packGlyphInstance(glyphInstances, glyphCount * GLYPH_INSTANCE_FLOATS, col, row, fg[0], fg[1], fg[2], fg[3], glyph.u, glyph.v, glyph.w, glyph.h, glyph.pw, glyph.ph);
+                    glyphCount++;
+                }
+            }
+        }
+        grid.clearDirty(row);
+    }
+    // Upload atlas
+    atlas?.upload(gl);
+    const canvasWidth = canvas?.width ?? 0;
+    const canvasHeight = canvas?.height ?? 0;
+    gl.viewport(0, 0, canvasWidth, canvasHeight);
+    gl.clearColor(themeBgFloat[0], themeBgFloat[1], themeBgFloat[2], 1.0);
+    gl.clear(gl.COLOR_BUFFER_BIT);
+    const cellW = cellWidth * dpr;
+    const cellH = cellHeight * dpr;
+    // Background pass
+    if (bgCount > 0 && bgProgram && bgVAO && bgInstanceVBO) {
+        gl.useProgram(bgProgram);
+        gl.uniform2f(gl.getUniformLocation(bgProgram, "u_resolution"), canvasWidth, canvasHeight);
+        gl.uniform2f(gl.getUniformLocation(bgProgram, "u_cellSize"), cellW, cellH);
+        gl.bindBuffer(gl.ARRAY_BUFFER, bgInstanceVBO);
+        gl.bufferData(gl.ARRAY_BUFFER, bgInstances.subarray(0, bgCount * BG_INSTANCE_FLOATS), gl.DYNAMIC_DRAW);
+        gl.bindVertexArray(bgVAO);
+        gl.drawElementsInstanced(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0, bgCount);
+    }
+    // Glyph pass
+    if (glyphCount > 0 && glyphProgram && glyphVAO && glyphInstanceVBO) {
+        gl.enable(gl.BLEND);
+        gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+        gl.useProgram(glyphProgram);
+        gl.uniform2f(gl.getUniformLocation(glyphProgram, "u_resolution"), canvasWidth, canvasHeight);
+        gl.uniform2f(gl.getUniformLocation(glyphProgram, "u_cellSize"), cellW, cellH);
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D, atlas?.getTexture() ?? null);
+        gl.uniform1i(gl.getUniformLocation(glyphProgram, "u_atlas"), 0);
+        gl.bindBuffer(gl.ARRAY_BUFFER, glyphInstanceVBO);
+        gl.bufferData(gl.ARRAY_BUFFER, glyphInstances.subarray(0, glyphCount * GLYPH_INSTANCE_FLOATS), gl.DYNAMIC_DRAW);
+        gl.bindVertexArray(glyphVAO);
+        gl.drawElementsInstanced(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0, glyphCount);
+        gl.disable(gl.BLEND);
+    }
+    // Selection overlay
+    drawSelection();
+    // Cursor
+    drawCursor();
+    gl.bindVertexArray(null);
+}
+function drawSelection() {
+    if (!gl || !grid || !selection)
+        return;
+    if (!bgProgram || !bgVAO || !bgInstanceVBO)
+        return;
+    const sr = Math.max(0, selection.startRow);
+    const er = Math.min(rows - 1, selection.endRow);
+    if (sr === er && selection.startCol === selection.endCol)
+        return;
+    const selColor = hexToFloat4(theme.selectionBackground);
+    const selInstances = [];
+    for (let row = sr; row <= er; row++) {
+        let colStart;
+        let colEnd;
+        if (sr === er) {
+            colStart = selection.startCol;
+            colEnd = selection.endCol;
+        }
+        else if (row === sr) {
+            colStart = selection.startCol;
+            colEnd = cols - 1;
+        }
+        else if (row === er) {
+            colStart = 0;
+            colEnd = selection.endCol;
+        }
+        else {
+            colStart = 0;
+            colEnd = cols - 1;
+        }
+        for (let col = colStart; col <= colEnd; col++) {
+            selInstances.push(col, row, selColor[0], selColor[1], selColor[2], 0.5);
+        }
+    }
+    if (selInstances.length === 0)
+        return;
+    const selData = new Float32Array(selInstances);
+    const selCount = selInstances.length / BG_INSTANCE_FLOATS;
+    gl.enable(gl.BLEND);
+    gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+    gl.useProgram(bgProgram);
+    gl.uniform2f(gl.getUniformLocation(bgProgram, "u_resolution"), canvas?.width ?? 0, canvas?.height ?? 0);
+    gl.uniform2f(gl.getUniformLocation(bgProgram, "u_cellSize"), cellWidth * dpr, cellHeight * dpr);
+    gl.bindBuffer(gl.ARRAY_BUFFER, bgInstanceVBO);
+    gl.bufferData(gl.ARRAY_BUFFER, selData, gl.DYNAMIC_DRAW);
+    gl.bindVertexArray(bgVAO);
+    gl.drawElementsInstanced(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0, selCount);
+    gl.disable(gl.BLEND);
+}
+function drawCursor() {
+    if (!gl || !cursorVisible)
+        return;
+    if (!bgProgram || !bgVAO || !bgInstanceVBO)
+        return;
+    const cc = themeCursorFloat;
+    gl.enable(gl.BLEND);
+    gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+    gl.useProgram(bgProgram);
+    gl.uniform2f(gl.getUniformLocation(bgProgram, "u_resolution"), canvas?.width ?? 0, canvas?.height ?? 0);
+    gl.uniform2f(gl.getUniformLocation(bgProgram, "u_cellSize"), cellWidth * dpr, cellHeight * dpr);
+    let cursorData;
+    switch (cursorStyle) {
+        case "block":
+            cursorData = new Float32Array([cursorCol, cursorRow, cc[0], cc[1], cc[2], 0.5]);
+            break;
+        case "underline": {
+            const lineH = Math.max(2 * dpr, 1);
+            const fractionalRow = cursorRow + (cellHeight * dpr - lineH) / (cellHeight * dpr);
+            cursorData = new Float32Array([cursorCol, fractionalRow, cc[0], cc[1], cc[2], cc[3]]);
+            break;
+        }
+        case "bar":
+            cursorData = new Float32Array([cursorCol, cursorRow, cc[0], cc[1], cc[2], cc[3]]);
+            break;
+        default:
+            cursorData = new Float32Array([cursorCol, cursorRow, cc[0], cc[1], cc[2], 0.5]);
+    }
+    gl.bindBuffer(gl.ARRAY_BUFFER, bgInstanceVBO);
+    gl.bufferData(gl.ARRAY_BUFFER, cursorData, gl.DYNAMIC_DRAW);
+    gl.bindVertexArray(bgVAO);
+    gl.drawElementsInstanced(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0, 1);
+    gl.disable(gl.BLEND);
+}
+// ---------------------------------------------------------------------------
+// Render loop
+// ---------------------------------------------------------------------------
+function startRenderLoop() {
+    if (disposed)
+        return;
+    lastFpsTime = performance.now();
+    frameCount = 0;
+    const loop = () => {
+        if (disposed)
+            return;
+        render();
+        // FPS tracking
+        frameCount++;
+        const now = performance.now();
+        const elapsed = now - lastFpsTime;
+        if (elapsed >= 1000) {
+            currentFps = Math.round((frameCount * 1000) / elapsed);
+            frameCount = 0;
+            lastFpsTime = now;
+            // Report FPS back to main thread
+            const msg = { type: "frame", fps: currentFps };
+            self.postMessage(msg);
+        }
+        rafId = requestAnimationFrame(loop);
+    };
+    rafId = requestAnimationFrame(loop);
+}
+function stopRenderLoop() {
+    if (rafId !== null) {
+        cancelAnimationFrame(rafId);
+        rafId = null;
+    }
+}
+// ---------------------------------------------------------------------------
+// Dispose
+// ---------------------------------------------------------------------------
+function disposeResources() {
+    disposed = true;
+    stopRenderLoop();
+    if (gl) {
+        if (atlas)
+            atlas.dispose(gl);
+        if (bgProgram)
+            gl.deleteProgram(bgProgram);
+        if (glyphProgram)
+            gl.deleteProgram(glyphProgram);
+        if (quadVBO)
+            gl.deleteBuffer(quadVBO);
+        if (quadEBO)
+            gl.deleteBuffer(quadEBO);
+        if (bgInstanceVBO)
+            gl.deleteBuffer(bgInstanceVBO);
+        if (glyphInstanceVBO)
+            gl.deleteBuffer(glyphInstanceVBO);
+        if (bgVAO)
+            gl.deleteVertexArray(bgVAO);
+        if (glyphVAO)
+            gl.deleteVertexArray(glyphVAO);
+    }
+    canvas = null;
+    gl = null;
+    grid = null;
+    atlas = null;
+}
+// ---------------------------------------------------------------------------
+// Message handler
+// ---------------------------------------------------------------------------
+function handleMessage(msg) {
+    switch (msg.type) {
+        case "init": {
+            canvas = msg.canvas;
+            cols = msg.cols;
+            rows = msg.rows;
+            theme = msg.theme;
+            fontSize = msg.fontSize;
+            fontFamily = msg.fontFamily;
+            dpr = msg.devicePixelRatio;
+            buildPaletteFloat();
+            measureCellSize();
+            grid = createGridFromSAB(msg.sharedBuffer, cols, rows);
+            atlas = new GlyphAtlas(Math.round(fontSize * dpr), fontFamily);
+            gl = canvas.getContext("webgl2", {
+                alpha: false,
+                antialias: false,
+                premultipliedAlpha: false,
+                preserveDrawingBuffer: false,
+            });
+            if (!gl) {
+                const err = { type: "error", message: "WebGL2 not available in worker" };
+                self.postMessage(err);
+                return;
+            }
+            // Handle context loss on the OffscreenCanvas
+            canvas.addEventListener("webglcontextlost", (e) => {
+                e.preventDefault();
+                contextLost = true;
+                stopRenderLoop();
+            });
+            canvas.addEventListener("webglcontextrestored", () => {
+                contextLost = false;
+                initGLResources();
+                if (grid)
+                    grid.markAllDirty();
+                startRenderLoop();
+            });
+            syncCanvasSize();
+            initGLResources();
+            ensureInstanceBuffers();
+            grid.markAllDirty();
+            startRenderLoop();
+            break;
+        }
+        case "update": {
+            cursorRow = msg.cursor.row;
+            cursorCol = msg.cursor.col;
+            cursorVisible = msg.cursor.visible;
+            cursorStyle = msg.cursor.style;
+            selection = msg.selection;
+            // Also write cursor to SAB for consistency
+            if (grid) {
+                grid.setCursor(cursorRow, cursorCol, cursorVisible, cursorStyle);
+            }
+            // Mark all dirty so the next frame picks up changes
+            if (grid)
+                grid.markAllDirty();
+            break;
+        }
+        case "resize": {
+            cols = msg.cols;
+            rows = msg.rows;
+            grid = createGridFromSAB(msg.sharedBuffer, cols, rows);
+            syncCanvasSize();
+            ensureInstanceBuffers();
+            grid.markAllDirty();
+            break;
+        }
+        case "theme": {
+            theme = msg.theme;
+            buildPaletteFloat();
+            if (grid)
+                grid.markAllDirty();
+            break;
+        }
+        case "font": {
+            fontSize = msg.fontSize;
+            fontFamily = msg.fontFamily;
+            measureCellSize();
+            if (gl && atlas) {
+                atlas.dispose(gl);
+            }
+            atlas = new GlyphAtlas(Math.round(fontSize * dpr), fontFamily);
+            if (gl) {
+                initGLResources();
+            }
+            syncCanvasSize();
+            ensureInstanceBuffers();
+            if (grid)
+                grid.markAllDirty();
+            break;
+        }
+        case "dispose": {
+            disposeResources();
+            self.close();
+            break;
+        }
+    }
+}
+// ---------------------------------------------------------------------------
+// Bootstrap
+// ---------------------------------------------------------------------------
+self.addEventListener("message", (event) => {
+    try {
+        handleMessage(event.data);
+    }
+    catch (e) {
+        self.postMessage({
+            type: "error",
+            message: e instanceof Error ? e.message : "Internal render error",
+        });
+    }
+});
+//# sourceMappingURL=render-worker.js.map