akarisub 0.2.2 → 1.0.0

package/dist/ts/{ts/worker.js → worker.js}

@@ -1,12 +1,11 @@
-/**
- * AkariSub Worker - TypeScript implementation.
- * Runs in a Web Worker to offload subtitle rendering from the main thread.
- */
 /// <reference lib="webworker" />
-// @ts-ignore - WASM module is aliased during build
-import WASM from 'wasm';
 import { parseAss, dropBlur, fixPlayRes, libassYCbCrMap } from './utils';
+import { glueUrlFromWasmUrl } from './wasm';
+import { compensatedMediaTime, isStalePresentation, updateTimingCompensation } from './timing';
 let lastCurrentTime = 0;
+let lastRenderedRequestTime = Number.NaN;
+let lastRenderedRequestWidth = 0;
+let lastRenderedRequestHeight = 0;
 let rate = 1;
 let rafId = null;
 let nextIsRaf = false;
@@ -14,21 +13,29 @@ const nowMs = () => (typeof performance !== 'undefined' ? performance.now() : Da
 let lastCurrentTimeReceivedAt = nowMs();
 let targetFps = 24;
 let onDemandRenderMode = false;
+let frameTimelineMode = false;
+let adaptiveTiming = true;
+let configuredRenderAheadSeconds = 0;
+let fallbackTimingCompensationSeconds = 0;
+let rawAssImageGpuEnabled = false;
 let useLocalFonts = false;
+let useFontconfigProvider = true;
 let blendMode = 'wasm';
 let availableFonts = {};
 const fontMap_ = {};
 let attachedFontId = 0; // For attached/preloaded fonts (higher priority)
 let fallbackFontId = 0; // For fallback fonts (lower priority)
-const pendingFallbackFonts = [];
+const MAX_FONT_BYTES = 32 * 1024 * 1024;
+const FONT_FETCH_TIMEOUT_MS = 30_000;
+const pendingFontFamilies = new Set();
 let debug = false;
 let clampPos = false;
 let renderInFlight = false;
+let latestPresentationId = 0;
 const MAX_QUEUED_RENDERS = 3;
 const queuedRenders = [];
 self.width = 0;
 self.height = 0;
-// Performance metrics
 const metrics = {
     framesRendered: 0,
     framesDropped: 0,
@@ -41,7 +48,9 @@ const metrics = {
     totalEvents: 0,
     currentEventIndex: 0,
     cacheHits: 0,
-    cacheMisses: 0
+    cacheMisses: 0,
+    lastImageCount: 0,
+    lastImagePixels: 0
 };
 const resetMetrics = () => {
     metrics.framesRendered = 0;
@@ -50,6 +59,8 @@ const resetMetrics = () => {
     metrics.maxRenderTime = 0;
     metrics.minRenderTime = Infinity;
     metrics.lastRenderTime = 0;
+    metrics.lastImageCount = 0;
+    metrics.lastImagePixels = 0;
     metrics.cacheHits = 0;
     metrics.cacheMisses = 0;
 };
@@ -58,19 +69,25 @@ let asyncRenderOptions = true;
 let offCanvas = null;
 let offCanvasCtx = null;
 let offscreenRender = false;
+let rawAssWebGL2Renderer = null;
 let bufferCanvas = null;
 let bufferCtx = null;
+let preparedCanvas = null;
+let preparedCtx = null;
+let preparedBufferCanvas = null;
+let preparedBufferCtx = null;
 let akariSubHandle = 0;
 let subtitleColorSpace = null;
 let dropAllBlur = false;
 let fullTrackWarmupEnabled = false;
 let hasBitmapBug = false;
 let _Module = null;
-let forceNextDemandRender = false;
+let forceNextRender = false;
+let trackGeneration = 0;
+let fullTrackWarmupGeneration = 0;
 const TEXT_ENCODER = new TextEncoder();
 const TEXT_DECODER = new TextDecoder();
 let akariSubApi = null;
-// Pre-allocated object pool for render results
 const MAX_POOLED_IMAGES = 128;
 const RENDER_COLLECT_MAX_IMAGES = Math.max(MAX_POOLED_IMAGES, 4096);
 const PREWARM_MAX_IMAGES = RENDER_COLLECT_MAX_IMAGES;
@@ -84,10 +101,12 @@ const FULL_WARMUP_YIELD_EVERY = 24;
 const ASS_TIME_SCALE = 1000;
 const imagePool = [];
 let poolInitialized = false;
-// Batch render-collect buffer: 3 header ints (changed, count, time) + 5 ints per image (x, y, w, h, image_ptr)
+// Batch render-collect buffer: 3 header ints (changed, count, time) + metadata per image.
+// RGBA paths use 5 ints per image (x, y, w, h, image_ptr); raw ASS_Image
+// GPU path uses 8 ints (dst_x, dst_y, w, h, bitmap_ptr, color, stride, type).
 const RRC_HEADER_INTS = 3;
 const RRC_IMG_STRIDE = 5;
-// Pre-allocated buffer for batch render-collect calls
+const RAW_RRC_IMG_STRIDE = 8;
 let rrcBufPtr = 0;
 let rrcBufCapacity = 0;
 // Cached views over the render-collect buffer; refreshed when the wasm memory
@@ -98,6 +117,7 @@ let rrcViewsBuffer = null;
 let rrcViewsPtr = 0;
 let rrcViewsCapacity = 0;
 const frameImages = [];
+const frameRawAssImages = [];
 const frameArrayBuffers = [];
 const frameBitmapPromises = [];
 let warmupTimer = null;
@@ -106,8 +126,365 @@ let warmupEndTime = 0;
 let warmupEnabled = false;
 let firstTrackEventStartTime = null;
 let fullTrackWarmupPromise = null;
+let fullTrackWarmupStarted = false;
+let blockingFullTrackWarmup = false;
+let fullTrackWarmupStepSeconds = FULL_WARMUP_STEP_SECONDS;
 let protectedTrackContent = false;
 const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+const RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS = 128;
+const RAW_ASS_INSTANCE_FLOATS = 12;
+const RAW_ASS_VERTEX_SHADER = `#version 300 es
+precision highp float;
+
+in vec4 a_destRect;
+in vec4 a_texInfo;
+in vec4 a_color;
+
+uniform vec2 u_resolution;
+
+out vec2 v_destXY;
+flat out int v_texIndex;
+flat out vec2 v_texSize;
+flat out vec4 v_color;
+
+vec2 quadPos(int id) {
+  if (id == 0) return vec2(0.0, 0.0);
+  if (id == 1) return vec2(1.0, 0.0);
+  if (id == 2) return vec2(0.0, 1.0);
+  if (id == 3) return vec2(1.0, 0.0);
+  if (id == 4) return vec2(1.0, 1.0);
+  return vec2(0.0, 1.0);
+}
+
+void main() {
+  vec2 qp = quadPos(gl_VertexID);
+  vec2 pixelPos = a_destRect.xy + qp * a_destRect.zw;
+  vec2 clip = (pixelPos / u_resolution) * 2.0 - 1.0;
+  clip.y = -clip.y;
+  gl_Position = vec4(clip, 0.0, 1.0);
+  v_destXY = a_destRect.xy;
+  v_texIndex = int(a_texInfo.z);
+  v_texSize = a_destRect.zw;
+  v_color = a_color;
+}
+`;
+const RAW_ASS_FRAGMENT_SHADER = `#version 300 es
+precision highp float;
+precision highp sampler2DArray;
+
+uniform sampler2DArray u_maskArray;
+uniform vec2 u_resolution;
+
+in vec2 v_destXY;
+flat in int v_texIndex;
+flat in vec2 v_texSize;
+flat in vec4 v_color;
+
+out vec4 fragColor;
+
+void main() {
+  vec2 fragPos = vec2(gl_FragCoord.x, u_resolution.y - gl_FragCoord.y);
+  ivec2 texCoord = ivec2(floor(fragPos - v_destXY));
+  ivec2 texSizeI = ivec2(v_texSize);
+  if (texCoord.x < 0 || texCoord.y < 0 || texCoord.x >= texSizeI.x || texCoord.y >= texSizeI.y) {
+    discard;
+  }
+  float coverage = texelFetch(u_maskArray, ivec3(texCoord, v_texIndex), 0).r;
+  float alpha = coverage * v_color.a;
+  fragColor = vec4(v_color.rgb * alpha, alpha);
+}
+`;
+function compileRawAssShader(gl, type, source) {
+    const shader = gl.createShader(type);
+    if (!shader)
+        throw new Error('Failed to create WebGL2 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(`Raw ASS WebGL2 shader compilation failed: ${info}`);
+    }
+    return shader;
+}
+class RawASSImageWebGL2Renderer {
+    _canvas = null;
+    _gl = null;
+    _program = null;
+    _vao = null;
+    _instanceBuffer = null;
+    _maskArray = null;
+    _resolutionLoc = null;
+    _texWidth = 0;
+    _texHeight = 0;
+    _texLayers = 0;
+    _lastWidth = 0;
+    _lastHeight = 0;
+    _instanceData = new Float32Array(RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS * RAW_ASS_INSTANCE_FLOATS);
+    _maskScratch = new Uint8Array(0);
+    init(canvas, width, height) {
+        this._canvas = canvas;
+        const gl = canvas.getContext('webgl2', {
+            alpha: true,
+            premultipliedAlpha: true,
+            antialias: false,
+            depth: false,
+            preserveDrawingBuffer: false,
+            stencil: false,
+            powerPreference: 'high-performance'
+        });
+        if (!gl)
+            return false;
+        this._gl = gl;
+        const vert = compileRawAssShader(gl, gl.VERTEX_SHADER, RAW_ASS_VERTEX_SHADER);
+        const frag = compileRawAssShader(gl, gl.FRAGMENT_SHADER, RAW_ASS_FRAGMENT_SHADER);
+        const program = gl.createProgram();
+        if (!program)
+            throw new Error('Failed to create WebGL2 program');
+        gl.attachShader(program, vert);
+        gl.attachShader(program, frag);
+        gl.linkProgram(program);
+        gl.deleteShader(vert);
+        gl.deleteShader(frag);
+        if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+            throw new Error(`Raw ASS WebGL2 program link failed: ${gl.getProgramInfoLog(program)}`);
+        }
+        this._program = program;
+        this._resolutionLoc = gl.getUniformLocation(program, 'u_resolution');
+        this._vao = gl.createVertexArray();
+        this._instanceBuffer = gl.createBuffer();
+        if (!this._vao || !this._instanceBuffer)
+            throw new Error('Failed to create WebGL2 buffers');
+        gl.bindVertexArray(this._vao);
+        gl.bindBuffer(gl.ARRAY_BUFFER, this._instanceBuffer);
+        gl.bufferData(gl.ARRAY_BUFFER, this._instanceData.byteLength, gl.DYNAMIC_DRAW);
+        const stride = RAW_ASS_INSTANCE_FLOATS * Float32Array.BYTES_PER_ELEMENT;
+        const aDestRect = gl.getAttribLocation(program, 'a_destRect');
+        gl.enableVertexAttribArray(aDestRect);
+        gl.vertexAttribPointer(aDestRect, 4, gl.FLOAT, false, stride, 0);
+        gl.vertexAttribDivisor(aDestRect, 1);
+        const aTexInfo = gl.getAttribLocation(program, 'a_texInfo');
+        gl.enableVertexAttribArray(aTexInfo);
+        gl.vertexAttribPointer(aTexInfo, 4, gl.FLOAT, false, stride, 4 * Float32Array.BYTES_PER_ELEMENT);
+        gl.vertexAttribDivisor(aTexInfo, 1);
+        const aColor = gl.getAttribLocation(program, 'a_color');
+        gl.enableVertexAttribArray(aColor);
+        gl.vertexAttribPointer(aColor, 4, gl.FLOAT, false, stride, 8 * Float32Array.BYTES_PER_ELEMENT);
+        gl.vertexAttribDivisor(aColor, 1);
+        gl.bindVertexArray(null);
+        gl.enable(gl.BLEND);
+        gl.blendEquation(gl.FUNC_ADD);
+        gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
+        gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
+        this._allocateTextureArray(256, 256, RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS);
+        this.updateSize(width, height);
+        return true;
+    }
+    _roundDim(n) {
+        return (Math.max(n, 64) + 63) & ~63;
+    }
+    _roundLayers(n) {
+        return Math.min((Math.max(n, 8) + 7) & ~7, RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS);
+    }
+    _allocateTextureArray(width, height, layers) {
+        const gl = this._gl;
+        const w = this._roundDim(width);
+        const h = this._roundDim(height);
+        const l = this._roundLayers(layers);
+        if (this._maskArray)
+            gl.deleteTexture(this._maskArray);
+        this._maskArray = gl.createTexture();
+        if (!this._maskArray)
+            throw new Error('Failed to create WebGL2 mask texture array');
+        gl.bindTexture(gl.TEXTURE_2D_ARRAY, this._maskArray);
+        gl.texImage3D(gl.TEXTURE_2D_ARRAY, 0, gl.R8, w, h, l, 0, gl.RED, gl.UNSIGNED_BYTE, null);
+        gl.texParameteri(gl.TEXTURE_2D_ARRAY, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
+        gl.texParameteri(gl.TEXTURE_2D_ARRAY, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
+        gl.texParameteri(gl.TEXTURE_2D_ARRAY, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+        gl.texParameteri(gl.TEXTURE_2D_ARRAY, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+        this._texWidth = w;
+        this._texHeight = h;
+        this._texLayers = l;
+    }
+    _ensureTextureArray(maxW, maxH, count) {
+        const c = Math.min(count, RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS);
+        if (maxW <= this._texWidth && maxH <= this._texHeight && c <= this._texLayers)
+            return;
+        this._allocateTextureArray(Math.max(this._texWidth, maxW), Math.max(this._texHeight, maxH), Math.max(this._texLayers, c));
+    }
+    updateSize(width, height) {
+        if (!this._gl || !this._canvas || width <= 0 || height <= 0)
+            return;
+        if (this._lastWidth === width && this._lastHeight === height)
+            return;
+        this._canvas.width = width;
+        this._canvas.height = height;
+        this._gl.viewport(0, 0, width, height);
+        this._lastWidth = width;
+        this._lastHeight = height;
+    }
+    _uploadMaskRegion(w, h, stride, ptr, layer, heap) {
+        const gl = this._gl;
+        gl.pixelStorei(gl.UNPACK_ROW_LENGTH, stride > 0 ? stride : w);
+        gl.texSubImage3D(gl.TEXTURE_2D_ARRAY, 0, 0, 0, layer, w, h, 1, gl.RED, gl.UNSIGNED_BYTE, heap, ptr);
+    }
+    _uploadMask(img, layer, heap) {
+        this._uploadMaskRegion(img.w, img.h, img.stride, img.bitmap, layer, heap);
+    }
+    renderRawAssImages(images, heap, width, height) {
+        if (!this._gl || !this._program || !this._maskArray || !this._instanceBuffer || !this._vao)
+            return;
+        this.updateSize(width, height);
+        let maxW = 0;
+        let maxH = 0;
+        for (const img of images) {
+            if (img.w > maxW)
+                maxW = img.w;
+            if (img.h > maxH)
+                maxH = img.h;
+        }
+        this._ensureTextureArray(maxW, maxH, Math.min(images.length, RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS));
+        const gl = this._gl;
+        gl.clearColor(0, 0, 0, 0);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+        if (!images.length)
+            return;
+        gl.useProgram(this._program);
+        gl.uniform2f(this._resolutionLoc, width, height);
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D_ARRAY, this._maskArray);
+        gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
+        let imageIndex = 0;
+        while (imageIndex < images.length) {
+            let count = 0;
+            while (imageIndex < images.length && count < RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS) {
+                const img = images[imageIndex++];
+                if (img.w <= 0 || img.h <= 0 || img.bitmap <= 0)
+                    continue;
+                const color = img.color >>> 0;
+                const opacity = (255 - (color & 0xff)) / 255;
+                if (opacity <= 0)
+                    continue;
+                this._uploadMask(img, count, heap);
+                const off = count * RAW_ASS_INSTANCE_FLOATS;
+                this._instanceData[off] = img.dst_x;
+                this._instanceData[off + 1] = img.dst_y;
+                this._instanceData[off + 2] = img.w;
+                this._instanceData[off + 3] = img.h;
+                this._instanceData[off + 4] = img.w;
+                this._instanceData[off + 5] = img.h;
+                this._instanceData[off + 6] = count;
+                this._instanceData[off + 7] = 0;
+                this._instanceData[off + 8] = ((color >>> 24) & 0xff) / 255;
+                this._instanceData[off + 9] = ((color >>> 16) & 0xff) / 255;
+                this._instanceData[off + 10] = ((color >>> 8) & 0xff) / 255;
+                this._instanceData[off + 11] = opacity;
+                count++;
+            }
+            gl.pixelStorei(gl.UNPACK_ROW_LENGTH, 0);
+            if (count === 0)
+                continue;
+            gl.bindBuffer(gl.ARRAY_BUFFER, this._instanceBuffer);
+            gl.bufferData(gl.ARRAY_BUFFER, this._instanceData.subarray(0, count * RAW_ASS_INSTANCE_FLOATS), gl.DYNAMIC_DRAW);
+            gl.bindVertexArray(this._vao);
+            gl.drawArraysInstanced(gl.TRIANGLES, 0, 6, count);
+            gl.bindVertexArray(null);
+        }
+    }
+    renderRawAssMetadata(meta, imageCount, heap, width, height) {
+        if (!this._gl || !this._program || !this._maskArray || !this._instanceBuffer || !this._vao)
+            return 0;
+        this.updateSize(width, height);
+        let maxW = 0;
+        let maxH = 0;
+        let validImages = 0;
+        for (let i = 0; i < imageCount; i++) {
+            const off = i * RAW_RRC_IMG_STRIDE;
+            const w = meta[off + 2];
+            const h = meta[off + 3];
+            const ptr = meta[off + 4];
+            if (w <= 0 || h <= 0 || ptr <= 0)
+                continue;
+            const color = meta[off + 5] >>> 0;
+            if (255 - (color & 0xff) <= 0)
+                continue;
+            if (w > maxW)
+                maxW = w;
+            if (h > maxH)
+                maxH = h;
+            validImages++;
+        }
+        this._ensureTextureArray(maxW, maxH, Math.min(validImages, RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS));
+        const gl = this._gl;
+        gl.clearColor(0, 0, 0, 0);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+        if (validImages === 0)
+            return 0;
+        gl.useProgram(this._program);
+        gl.uniform2f(this._resolutionLoc, width, height);
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D_ARRAY, this._maskArray);
+        gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1);
+        let imageIndex = 0;
+        let pixels = 0;
+        while (imageIndex < imageCount) {
+            let count = 0;
+            while (imageIndex < imageCount && count < RAW_ASS_MAX_TEXTURE_ARRAY_LAYERS) {
+                const metaOffset = imageIndex++ * RAW_RRC_IMG_STRIDE;
+                const w = meta[metaOffset + 2];
+                const h = meta[metaOffset + 3];
+                const ptr = meta[metaOffset + 4];
+                if (w <= 0 || h <= 0 || ptr <= 0)
+                    continue;
+                const color = meta[metaOffset + 5] >>> 0;
+                const opacity = (255 - (color & 0xff)) / 255;
+                if (opacity <= 0)
+                    continue;
+                const stride = meta[metaOffset + 6];
+                this._uploadMaskRegion(w, h, stride, ptr, count, heap);
+                const off = count * RAW_ASS_INSTANCE_FLOATS;
+                this._instanceData[off] = meta[metaOffset];
+                this._instanceData[off + 1] = meta[metaOffset + 1];
+                this._instanceData[off + 2] = w;
+                this._instanceData[off + 3] = h;
+                this._instanceData[off + 4] = w;
+                this._instanceData[off + 5] = h;
+                this._instanceData[off + 6] = count;
+                this._instanceData[off + 7] = 0;
+                this._instanceData[off + 8] = ((color >>> 24) & 0xff) / 255;
+                this._instanceData[off + 9] = ((color >>> 16) & 0xff) / 255;
+                this._instanceData[off + 10] = ((color >>> 8) & 0xff) / 255;
+                this._instanceData[off + 11] = opacity;
+                pixels += w * h;
+                count++;
+            }
+            gl.pixelStorei(gl.UNPACK_ROW_LENGTH, 0);
+            if (count === 0)
+                continue;
+            gl.bindBuffer(gl.ARRAY_BUFFER, this._instanceBuffer);
+            gl.bufferData(gl.ARRAY_BUFFER, this._instanceData.subarray(0, count * RAW_ASS_INSTANCE_FLOATS), gl.DYNAMIC_DRAW);
+            gl.bindVertexArray(this._vao);
+            gl.drawArraysInstanced(gl.TRIANGLES, 0, 6, count);
+            gl.bindVertexArray(null);
+        }
+        return pixels;
+    }
+    destroy() {
+        const gl = this._gl;
+        if (gl) {
+            gl.deleteProgram(this._program);
+            gl.deleteVertexArray(this._vao);
+            gl.deleteBuffer(this._instanceBuffer);
+            gl.deleteTexture(this._maskArray);
+        }
+        this._canvas = null;
+        this._gl = null;
+        this._program = null;
+        this._vao = null;
+        this._instanceBuffer = null;
+        this._maskArray = null;
+    }
+}
 const initPool = () => {
     if (poolInitialized)
         return;
@@ -119,7 +496,6 @@ const initPool = () => {
 const getPooledItem = (index) => {
     let item = imagePool[index];
     if (!item) {
-        // Grow the pool on demand so frames with many images reuse items too
         item = { w: 0, h: 0, x: 0, y: 0, image: 0 };
         imagePool[index] = item;
     }
@@ -130,10 +506,10 @@ const getPooledItem = (index) => {
  * Layout: [changed, count, time, (x, y, w, h, image_ptr) * N]
  * = 3 + 5*N ints
  */
-const ensureRenderCollectBuffer = (maxImages) => {
+const ensureRenderCollectBuffer = (maxImages, imageStride = RRC_IMG_STRIDE) => {
     if (!_Module || maxImages <= 0)
         return;
-    const totalInts = RRC_HEADER_INTS + RRC_IMG_STRIDE * maxImages;
+    const totalInts = RRC_HEADER_INTS + imageStride * maxImages;
     if (rrcBufCapacity >= totalInts && rrcBufPtr)
         return;
     const nextCapacity = Math.max(totalInts, (rrcBufCapacity || 64) * 2);
@@ -161,8 +537,8 @@ const refreshRrcViews = () => {
     rrcViewsPtr = rrcBufPtr;
     rrcViewsCapacity = rrcBufCapacity;
 };
-const prewarmRenderer = (time) => {
-    if (!akariSubHandle)
+const prewarmRenderer = (time, generation = trackGeneration) => {
+    if (!akariSubHandle || generation !== trackGeneration)
         return;
     const api = requireApi();
     const handle = requireHandle();
@@ -173,6 +549,10 @@ const prewarmRenderer = (time) => {
     else {
         api.renderImageCollect(handle, time, 0, rrcBufPtr, rrcBufCapacity);
     }
+    // Prewarming uses the visible libass renderer and can advance libass'
+    // internal changed-frame baseline without painting the result. Force the next
+    // visible render so a changed=0 response cannot leave stale/blank output.
+    markNextRenderForced();
 };
 const syncTotalEventsMetric = () => {
     metrics.totalEvents = akariSubHandle ? requireApi().getEventCount(akariSubHandle) : 0;
@@ -205,6 +585,25 @@ let emptyWindowUntil = -1;
 const invalidateEmptyWindow = () => {
     emptyWindowFrom = -1;
     emptyWindowUntil = -1;
+    lastRenderedRequestTime = Number.NaN;
+};
+const markNextRenderForced = () => {
+    forceNextRender = true;
+    invalidateEmptyWindow();
+};
+const consumeNextRenderForce = () => {
+    if (!forceNextRender)
+        return 0;
+    forceNextRender = false;
+    return 1;
+};
+const advanceTrackGeneration = () => {
+    trackGeneration++;
+    fullTrackWarmupGeneration = trackGeneration;
+    fullTrackWarmupPromise = null;
+    fullTrackWarmupStarted = false;
+    markNextRenderForced();
+    return trackGeneration;
 };
 const computeEmptyWindow = (time) => {
     if (!akariSubHandle || !_Module)
@@ -223,28 +622,32 @@ const computeEmptyWindow = (time) => {
         _Module._free(outPtr);
     }
 };
-const prewarmEntireTrack = async () => {
-    if (!akariSubHandle)
+const prewarmEntireTrack = async (generation) => {
+    if (!akariSubHandle || generation !== trackGeneration)
         return;
     const range = getTrackEventTimeRange();
-    if (!range)
+    if (!range || generation !== trackGeneration)
         return;
     const cappedEnd = Math.min(range.end, range.start + FULL_WARMUP_CAP_SECONDS);
     let ticks = 0;
-    for (let time = range.start; time <= cappedEnd; time += FULL_WARMUP_STEP_SECONDS) {
-        if (!akariSubHandle)
+    for (let time = range.start; time <= cappedEnd; time += fullTrackWarmupStepSeconds) {
+        if (!akariSubHandle || generation !== trackGeneration)
             return;
         if (onDemandRenderMode && (renderInFlight || queuedRenders.length > 0 || metrics.pendingRenders > 0)) {
             await sleep(0);
+            if (generation !== trackGeneration)
+                return;
             continue;
         }
-        prewarmRenderer(time);
+        prewarmRenderer(time, generation);
         ticks++;
         if (onDemandRenderMode || ticks % FULL_WARMUP_YIELD_EVERY === 0) {
             await sleep(0);
+            if (generation !== trackGeneration)
+                return;
         }
     }
-    prewarmRenderer(cappedEnd);
+    prewarmRenderer(cappedEnd, generation);
 };
 const getWarmupAnchorTime = (fallbackTime) => {
     if (firstTrackEventStartTime == null)
@@ -261,20 +664,30 @@ const stopWarmup = () => {
     }
 };
 const scheduleFullTrackWarmup = () => {
-    if (!fullTrackWarmupEnabled || fullTrackWarmupPromise || !akariSubHandle)
+    if (frameTimelineMode ||
+        !fullTrackWarmupEnabled ||
+        fullTrackWarmupStarted ||
+        fullTrackWarmupPromise ||
+        !akariSubHandle) {
         return;
+    }
+    fullTrackWarmupStarted = true;
+    const generation = trackGeneration;
+    fullTrackWarmupGeneration = generation;
     fullTrackWarmupPromise = (async () => {
         await sleep(0);
+        if (generation !== trackGeneration)
+            return;
         try {
-            await prewarmEntireTrack();
+            await prewarmEntireTrack(generation);
         }
         catch (e) {
             if (debug)
                 console.warn('[AkariSub] Full track warmup failed, continuing:', e);
         }
         try {
-            if (akariSubHandle) {
-                prewarmRenderer(getCurrentTime());
+            if (akariSubHandle && generation === trackGeneration) {
+                prewarmRenderer(getCurrentTime(), generation);
             }
         }
         catch (e) {
@@ -282,7 +695,9 @@ const scheduleFullTrackWarmup = () => {
                 console.warn('[AkariSub] Post-warmup re-prime failed, continuing:', e);
         }
     })().finally(() => {
-        fullTrackWarmupPromise = null;
+        if (fullTrackWarmupGeneration === generation) {
+            fullTrackWarmupPromise = null;
+        }
     });
 };
 const scheduleWarmupTick = () => {
@@ -494,49 +909,119 @@ const requireHandle = () => {
         throw new Error('AkariSub instance is not initialized');
     return akariSubHandle;
 };
-// =============================================================================
-// Font Management
-// =============================================================================
-// Fonts added via addFont are explicitly requested, so they should be attached (high priority)
-self.addFont = ({ font }) => asyncWrite(font, false);
+// Fonts added via addFont are explicitly requested, so they should be attached (high priority).
+// A correlated acknowledgement prevents callers from treating rejected bytes as loaded.
+const readBoundedFontUrl = async (url) => {
+    const controller = new AbortController();
+    const timeout = setTimeout(() => controller.abort(), FONT_FETCH_TIMEOUT_MS);
+    try {
+        const response = await fetch(url, { signal: controller.signal });
+        if (!response.ok)
+            throw new Error(`Font request failed with HTTP ${response.status}`);
+        const declaredLength = Number(response.headers.get('content-length'));
+        if (Number.isFinite(declaredLength) && declaredLength > MAX_FONT_BYTES) {
+            await response.body?.cancel();
+            throw new Error('Font files are limited to 32 MiB');
+        }
+        if (!response.body) {
+            const bytes = new Uint8Array(await response.arrayBuffer());
+            if (bytes.byteLength > MAX_FONT_BYTES)
+                throw new Error('Font files are limited to 32 MiB');
+            return bytes;
+        }
+        const reader = response.body.getReader();
+        const chunks = [];
+        let total = 0;
+        while (true) {
+            const { done, value } = await reader.read();
+            if (done)
+                break;
+            total += value.byteLength;
+            if (total > MAX_FONT_BYTES) {
+                await reader.cancel();
+                throw new Error('Font files are limited to 32 MiB');
+            }
+            chunks.push(value);
+        }
+        const result = new Uint8Array(total);
+        let offset = 0;
+        for (const chunk of chunks) {
+            result.set(chunk, offset);
+            offset += chunk.byteLength;
+        }
+        return result;
+    }
+    finally {
+        clearTimeout(timeout);
+    }
+};
+self.addFont = async ({ font, requestId }) => {
+    const respond = (bytes) => {
+        if (bytes.byteLength > MAX_FONT_BYTES) {
+            postMessage({ target: 'addFont', requestId, success: false, error: 'Font files are limited to 32 MiB' });
+            return;
+        }
+        const success = writeFontToFS(bytes, false);
+        postMessage({
+            target: 'addFont',
+            requestId,
+            success,
+            error: success ? undefined : 'The renderer rejected the font bytes'
+        });
+    };
+    try {
+        respond(typeof font === 'string' ? await readBoundedFontUrl(font) : font);
+    }
+    catch (cause) {
+        const error = cause instanceof Error ? cause.message : 'The font could not be read';
+        postMessage({ target: 'addFont', requestId, success: false, error });
+    }
+};
+self.localFontResult = ({ font, success }) => {
+    pendingFontFamilies.delete(font);
+    if (success)
+        fontMap_[font] = true;
+};
 const findAvailableFonts = (font) => {
     font = font.trim().toLowerCase();
     if (font.startsWith('@'))
         font = font.substring(1);
     if (fontMap_[font])
         return;
-    fontMap_[font] = true;
     if (!availableFonts[font]) {
-        if (useLocalFonts)
+        if (useLocalFonts && !pendingFontFamilies.has(font)) {
+            pendingFontFamilies.add(font);
             postMessage({ target: 'getLocalFont', font });
+        }
     }
     else {
-        asyncWrite(availableFonts[font]);
-    }
-};
-const asyncWrite = (font, isFallback = true) => {
-    if (typeof font === 'string') {
-        readAsync(font, (fontData) => {
-            writeFontToFS(new Uint8Array(fontData), isFallback);
-        }, console.error);
-    }
-    else {
-        writeFontToFS(font, isFallback);
+        if (pendingFontFamilies.has(font))
+            return;
+        pendingFontFamilies.add(font);
+        asyncWrite(availableFonts[font], true, (success) => {
+            pendingFontFamilies.delete(font);
+            if (success)
+                fontMap_[font] = true;
+        });
     }
 };
-// Synchronous font loading for critical fonts (fallback fonts)
-const syncWrite = (font, isFallback = true) => {
+const asyncWrite = (font, isFallback = true, settled) => {
     if (typeof font === 'string') {
-        const fontData = read_(font, true);
-        if (fontData) {
-            writeFontToFSImmediate(new Uint8Array(fontData), isFallback);
-        }
+        void readBoundedFontUrl(font)
+            .then((fontData) => {
+            const success = writeFontToFS(fontData, isFallback);
+            settled?.(success);
+        })
+            .catch((error) => {
+            console.error(error);
+            settled?.(false);
+        });
     }
     else {
-        writeFontToFSImmediate(font, isFallback);
+        const success = writeFontToFS(font, isFallback);
+        settled?.(success);
     }
 };
-// Debounced font reload
 let pendingFontReload = null;
 const scheduleReloadFonts = () => {
     if (pendingFontReload)
@@ -546,6 +1031,7 @@ const scheduleReloadFonts = () => {
         if (akariSubHandle) {
             const api = requireApi();
             api.reloadFonts(akariSubHandle);
+            markNextRenderForced();
         }
     }, 16);
 };
@@ -557,30 +1043,63 @@ const addFontAsEmbedded = (uint8, name) => {
     if (!_Module || !akariSubHandle) {
         if (debug)
             console.warn('[AkariSub] Cannot add embedded font, module or AkariSub not ready:', name);
-        return;
+        return false;
+    }
+    if (uint8.byteLength > MAX_FONT_BYTES) {
+        if (debug)
+            console.warn('[AkariSub] Rejected oversized embedded font:', name);
+        return false;
     }
     try {
         const api = requireApi();
-        // Allocate memory in WASM heap and copy font data
         const ptr = _Module._malloc(uint8.length);
         if (!ptr) {
             console.warn('[AkariSub] Failed to allocate memory for embedded font:', name);
-            return;
+            return false;
         }
-        // Copy font data to WASM heap
         self.HEAPU8.set(uint8, ptr);
-        withCString(name, (namePtr) => {
-            api.addFont(akariSubHandle, namePtr, ptr, uint8.length);
-        });
+        let handedToNative = false;
+        let accepted = false;
+        try {
+            accepted = withCString(name, (namePtr) => {
+                handedToNative = true;
+                return api.addFont(akariSubHandle, namePtr, ptr, uint8.length) === 1;
+            });
+        }
+        finally {
+            if (!handedToNative)
+                _Module._free(ptr);
+        }
+        if (!accepted) {
+            if (debug)
+                console.warn('[AkariSub] Rejected embedded font:', name);
+            return false;
+        }
         if (debug)
             console.log('[AkariSub] Added embedded font:', name, 'size:', uint8.length);
+        return true;
     }
     catch (e) {
         console.warn('[AkariSub] Failed to add embedded font:', name, e);
+        return false;
     }
 };
 /**
- * Write a font to the virtual filesystem so fontconfig can index it.
+ * Admit a font through FreeType/libass before retaining a MEMFS copy.
+ */
+const admitAndPersistFont = (uint8, fontDir, fontFileName) => {
+    if (!_Module || !akariSubHandle || !addFontAsEmbedded(uint8, fontFileName))
+        return false;
+    try {
+        _Module.FS_createDataFile(fontDir, fontFileName, uint8, true, true, true);
+    }
+    catch (e) {
+        console.warn('Failed to write font to filesystem:', fontDir + '/' + fontFileName, e);
+    }
+    return true;
+};
+/**
+ * Write an admitted font to the virtual filesystem so fontconfig can index it.
  * Fonts are written to separate directories based on priority:
  * - /fonts/attached: For attached/preloaded fonts (highest priority)
  * - /fonts/fallback: For fallback fonts
@@ -588,67 +1107,35 @@ const addFontAsEmbedded = (uint8, name) => {
 const writeFontToFS = (uint8, isFallback = true) => {
     const fontDir = isFallback ? '/fonts/fallback' : '/fonts/attached';
     const fontFileName = isFallback ? 'fallback-' + fallbackFontId++ : 'attached-' + attachedFontId++;
-    if (_Module) {
-        try {
-            _Module.FS_createDataFile(fontDir, fontFileName, uint8, true, true, true);
-        }
-        catch (e) {
-            console.warn('Failed to write font to filesystem:', fontDir + '/' + fontFileName, e);
-        }
-        if (!isFallback) {
-            addFontAsEmbedded(uint8, fontFileName);
-        }
-        else if (akariSubHandle) {
-            addFontAsEmbedded(uint8, fontFileName);
-        }
-        else {
-            pendingFallbackFonts.push({ data: uint8, name: fontFileName });
-        }
-    }
+    if (!admitAndPersistFont(uint8, fontDir, fontFileName))
+        return false;
     scheduleReloadFonts();
+    return true;
 };
 /**
- * Immediate font write without debounced reload (for synchronous loading).
+ * Immediate admitted-font write without debounced reload (for synchronous loading).
  */
 const writeFontToFSImmediate = (uint8, isFallback = true) => {
     const fontDir = isFallback ? '/fonts/fallback' : '/fonts/attached';
     const fontFileName = isFallback ? 'fallback-' + fallbackFontId++ : 'attached-' + attachedFontId++;
-    if (_Module) {
-        try {
-            _Module.FS_createDataFile(fontDir, fontFileName, uint8, true, true, true);
-            if (debug)
-                console.log('[AkariSub] Wrote font to FS:', fontDir + '/' + fontFileName, 'size:', uint8.length);
-        }
-        catch (e) {
-            console.warn('Failed to write font to filesystem:', fontDir + '/' + fontFileName, e);
-        }
-        if (!isFallback) {
-            addFontAsEmbedded(uint8, fontFileName);
-        }
-        else if (akariSubHandle) {
-            addFontAsEmbedded(uint8, fontFileName);
-        }
-        else {
-            pendingFallbackFonts.push({ data: uint8, name: fontFileName });
-        }
-    }
+    const success = admitAndPersistFont(uint8, fontDir, fontFileName);
+    if (success && debug)
+        console.log('[AkariSub] Wrote admitted font to FS:', fontDir + '/' + fontFileName, 'size:', uint8.length);
+    return success;
 };
 const processAvailableFonts = (content) => {
     if (!availableFonts)
         return;
     const isLargeFile = content.length > 500000;
     if (isLargeFile) {
-        // Extract only the styles section for large files
         const stylesMatch = content.match(/\[V4\+?\s*Styles?\][^\[]*(?=\[|$)/i);
         if (stylesMatch) {
             const stylesSection = stylesMatch[0];
-            // Parse only the styles section
             const styleFontMatches = stylesSection.matchAll(/^Style:[^,]*,([^,]+)/gm);
             for (const match of styleFontMatches) {
                 findAvailableFonts(match[1].trim());
             }
         }
-        // For Events section in large files, limit to first 1000 \fn tags
         const eventsMatch = content.match(/\[Events\][\s\S]*/i);
         if (eventsMatch) {
             const eventsContent = eventsMatch[0];
@@ -662,7 +1149,6 @@ const processAvailableFonts = (content) => {
         }
     }
     else {
-        // Original behavior for small files
         const sections = parseAss(content, true);
         for (let i = 0; i < sections.length; i++) {
             for (let j = 0; j < sections[i].body.length; j++) {
@@ -672,7 +1158,6 @@ const processAvailableFonts = (content) => {
                 }
             }
         }
-        // Use matchAll for Events section
         const eventsMatch = content.match(/\[Events\][\s\S]*/i);
         if (eventsMatch) {
             const eventsContent = eventsMatch[0];
@@ -683,9 +1168,6 @@ const processAvailableFonts = (content) => {
         }
     }
 };
-// =============================================================================
-// Network Utilities
-// =============================================================================
 const read_ = (url, ab) => {
     const xhr = new XMLHttpRequest();
     xhr.open('GET', url, false);
@@ -705,22 +1187,19 @@ const readAsync = (url, load, err) => {
     xhr.onerror = err;
     xhr.send(null);
 };
-// =============================================================================
-// Track Management
-// =============================================================================
 const finishTrackLoad = () => {
     const api = requireApi();
     const handle = requireHandle();
     syncTotalEventsMetric();
     firstTrackEventStartTime = getFirstEventStartTime();
     subtitleColorSpace = libassYCbCrMap[api.getTrackColorSpace(handle)];
-    forceNextDemandRender = true;
+    markNextRenderForced();
     postMessage({ target: 'verifyColorSpace', subtitleColorSpace });
     postMessage({ target: 'trackReady' });
 };
 self.setTrack = ({ content }) => {
     stopWarmup();
-    fullTrackWarmupPromise = null;
+    advanceTrackGeneration();
     protectedTrackContent = false;
     if (isBinaryContent(content)) {
         createTrackFromBytes(toUint8Array(content));
@@ -737,7 +1216,7 @@ self.setTrack = ({ content }) => {
 };
 self.setEncryptedTrack = async ({ content }) => {
     stopWarmup();
-    fullTrackWarmupPromise = null;
+    advanceTrackGeneration();
     protectedTrackContent = true;
     const decrypted = await decryptSubtitleContent(content);
     try {
@@ -753,21 +1232,35 @@ self.getColorSpace = () => {
 };
 self.freeTrack = () => {
     stopWarmup();
-    fullTrackWarmupPromise = null;
+    advanceTrackGeneration();
     firstTrackEventStartTime = null;
     protectedTrackContent = false;
     const api = requireApi();
     const handle = requireHandle();
     api.removeTrack(handle);
     syncTotalEventsMetric();
+    markNextRenderForced();
 };
 self.setTrackByUrl = ({ url }) => {
     self.setTrack({ content: read_(url) });
 };
-// =============================================================================
-// Time Management
-// =============================================================================
 let _isPaused = true;
+const projectedCurrentTime = () => {
+    if (_isPaused)
+        return lastCurrentTime;
+    return lastCurrentTime + ((nowMs() - lastCurrentTimeReceivedAt) / 1000) * rate;
+};
+const freezeClockAtProjectedTime = () => {
+    lastCurrentTime = projectedCurrentTime();
+    lastCurrentTimeReceivedAt = nowMs();
+};
+const setPlaybackRate = (newRate) => {
+    if (!Number.isFinite(newRate))
+        return;
+    if (!_isPaused)
+        freezeClockAtProjectedTime();
+    rate = newRate;
+};
 const getCurrentTime = () => {
     const diff = (nowMs() - lastCurrentTimeReceivedAt) / 1000;
     if (_isPaused) {
@@ -776,18 +1269,27 @@ const getCurrentTime = () => {
     else {
         if (diff > 5) {
             console.error("Didn't receive currentTime > 5 seconds. Assuming video was paused.");
+            freezeClockAtProjectedTime();
             setIsPaused(true);
+            return lastCurrentTime;
         }
         return lastCurrentTime + diff * rate;
     }
 };
+const getRenderClockTime = () => compensatedMediaTime(getCurrentTime(), rate, configuredRenderAheadSeconds, adaptiveTiming ? fallbackTimingCompensationSeconds : 0, _isPaused);
 const setCurrentTime = (currentTime) => {
+    if (!Number.isFinite(currentTime))
+        return;
     lastCurrentTime = currentTime;
     lastCurrentTimeReceivedAt = nowMs();
     if (onDemandRenderMode) {
         return;
     }
     if (!rafId) {
+        if (_isPaused) {
+            renderLoop();
+            return;
+        }
         if (nextIsRaf) {
             rafId = requestAnimationFrame(renderLoop);
         }
@@ -801,27 +1303,32 @@ const setCurrentTime = (currentTime) => {
     }
 };
 const setIsPaused = (isPaused) => {
+    if (isPaused === _isPaused)
+        return;
+    if (isPaused) {
+        freezeClockAtProjectedTime();
+    }
     if (onDemandRenderMode) {
         _isPaused = isPaused;
+        if (!isPaused)
+            lastCurrentTimeReceivedAt = nowMs();
         if (rafId) {
             cancelAnimationFrame(rafId);
             rafId = null;
         }
         return;
     }
-    if (isPaused !== _isPaused) {
-        _isPaused = isPaused;
-        if (isPaused) {
-            if (rafId) {
-                cancelAnimationFrame(rafId);
-                rafId = null;
-            }
-        }
-        else {
-            lastCurrentTimeReceivedAt = nowMs();
-            rafId = requestAnimationFrame(renderLoop);
+    _isPaused = isPaused;
+    if (isPaused) {
+        if (rafId) {
+            cancelAnimationFrame(rafId);
+            rafId = null;
         }
     }
+    else {
+        lastCurrentTimeReceivedAt = nowMs();
+        rafId = requestAnimationFrame(renderLoop);
+    }
 };
 const flushQueuedRender = () => {
     if (renderInFlight || queuedRenders.length === 0)
@@ -830,41 +1337,72 @@ const flushQueuedRender = () => {
         const dropped = queuedRenders.length - 1;
         metrics.framesDropped += dropped;
         const latest = queuedRenders[queuedRenders.length - 1];
+        latest.force = queuedRenders.some((item) => item.force) ? 1 : latest.force;
         queuedRenders.length = 0;
         queuedRenders.push(latest);
     }
     const next = queuedRenders.shift();
     if (!next)
         return;
-    render(next.time, next.force);
+    render(next.time, next.force, next.requestId, next.renderEpoch, next.prepareId, next.presentationId);
 };
-const completeRenderCycle = () => {
+const completeRenderCycle = (painted = false) => {
+    if (painted && !onDemandRenderMode && !_isPaused && metrics.renderStartTime > 0 && adaptiveTiming) {
+        fallbackTimingCompensationSeconds = updateTimingCompensation(fallbackTimingCompensationSeconds, performance.now(), metrics.renderStartTime);
+    }
+    metrics.renderStartTime = 0;
     renderInFlight = false;
+    const hadQueuedRender = queuedRenders.length > 0;
     flushQueuedRender();
+    if (!hadQueuedRender && !renderInFlight)
+        scheduleFullTrackWarmup();
 };
-const render = (time, force) => {
+const render = (time, force, requestId, renderEpoch, prepareId, presentationId) => {
     if (renderInFlight) {
-        const queuedItem = { time, force: force ? 1 : 0 };
+        const queuedItem = { time, force: force ? 1 : 0, requestId, renderEpoch, prepareId, presentationId };
         if (queuedItem.force) {
             queuedRenders.length = 0;
         }
         else {
             const lastQueued = queuedRenders[queuedRenders.length - 1];
             if (lastQueued && Math.abs(lastQueued.time - queuedItem.time) > 0.25) {
+                queuedItem.force = queuedRenders.some((item) => item.force) ? 1 : queuedItem.force;
                 queuedRenders.length = 0;
             }
         }
         if (queuedRenders.length >= MAX_QUEUED_RENDERS) {
-            queuedRenders.shift();
+            const dropped = queuedRenders.shift();
+            if (dropped?.force)
+                queuedItem.force = 1;
             metrics.framesDropped++;
         }
         queuedRenders.push(queuedItem);
         return;
     }
+    // Repeated manual renders at the exact same media time and canvas size are
+    // deterministic. Skip the WASM call and reuse the existing canvas contents;
+    // this matches players/benchmark harnesses that repaint paused frames.
+    if (!force &&
+        time === lastRenderedRequestTime &&
+        self.width === lastRenderedRequestWidth &&
+        self.height === lastRenderedRequestHeight) {
+        metrics.cacheHits++;
+        if (prepareId == null)
+            postMessage({ target: 'unbusy', requestId, renderEpoch });
+        else
+            postPreparedSnapshot(prepareId, renderEpoch, time);
+        return;
+    }
+    lastRenderedRequestTime = time;
+    lastRenderedRequestWidth = self.width;
+    lastRenderedRequestHeight = self.height;
     // Inside a known-empty window the output cannot change: skip the WASM call
     if (!force && emptyWindowFrom >= 0 && time >= emptyWindowFrom && time < emptyWindowUntil) {
         metrics.cacheHits++;
-        postMessage({ target: 'unbusy' });
+        if (prepareId == null)
+            postMessage({ target: 'unbusy', requestId, renderEpoch });
+        else
+            postPreparedSnapshot(prepareId, renderEpoch, time);
         return;
     }
     renderInFlight = true;
@@ -876,11 +1414,14 @@ const render = (time, force) => {
     const api = requireApi();
     const handle = requireHandle();
     const forceInt = force ? 1 : 0;
-    // Use the batch render-collect API: single WASM call does render + metadata + image data extraction.
-    ensureRenderCollectBuffer(RENDER_COLLECT_MAX_IMAGES);
-    const written = blendMode === 'wasm'
-        ? api.renderBlendCollect(handle, time, forceInt, rrcBufPtr, rrcBufCapacity)
-        : api.renderImageCollect(handle, time, forceInt, rrcBufPtr, rrcBufCapacity);
+    const useRawAssImagePath = prepareId == null && !!rawAssWebGL2Renderer && offscreenRender === true;
+    const imageStride = useRawAssImagePath ? RAW_RRC_IMG_STRIDE : RRC_IMG_STRIDE;
+    ensureRenderCollectBuffer(RENDER_COLLECT_MAX_IMAGES, imageStride);
+    const written = useRawAssImagePath
+        ? api.renderRawCollect(handle, time, forceInt, rrcBufPtr, rrcBufCapacity)
+        : blendMode === 'wasm'
+            ? api.renderBlendCollect(handle, time, forceInt, rrcBufPtr, rrcBufCapacity)
+            : api.renderImageCollect(handle, time, forceInt, rrcBufPtr, rrcBufCapacity);
     // Refresh after the WASM call: rendering may have grown the memory
     refreshRrcViews();
     const headerView = rrcHeaderView;
@@ -889,7 +1430,6 @@ const render = (time, force) => {
     if (headerView[1] === 0 && (emptyWindowFrom < 0 || time < emptyWindowFrom || time >= emptyWindowUntil)) {
         computeEmptyWindow(time);
     }
-    // Update metrics
     const renderEndTime = performance.now();
     const renderDuration = renderEndTime - renderStartTime;
     metrics.lastRenderTime = renderDuration;
@@ -903,6 +1443,8 @@ const render = (time, force) => {
         metrics.cacheMisses++;
     }
     else {
+        metrics.lastImageCount = 0;
+        metrics.lastImagePixels = 0;
         metrics.cacheHits++;
     }
     if (debug) {
@@ -917,10 +1459,21 @@ const render = (time, force) => {
         const buffers = frameArrayBuffers;
         images.length = 0;
         buffers.length = 0;
-        if (written === 0)
-            return paintImages({ images, buffers, times });
         const meta = rrcMetaView;
-        const useAsyncBitmapPath = asyncRender && offscreenRender !== true;
+        metrics.lastImageCount = written;
+        metrics.lastImagePixels = 0;
+        const stride = useRawAssImagePath ? RAW_RRC_IMG_STRIDE : RRC_IMG_STRIDE;
+        for (let i = 0; i < written; ++i) {
+            const metaOffset = i * stride;
+            metrics.lastImagePixels += Math.max(0, meta[metaOffset + 2]) * Math.max(0, meta[metaOffset + 3]);
+        }
+        if (useRawAssImagePath) {
+            return paintRawAssImages({ meta, count: written, times, requestId, renderEpoch, presentationId });
+        }
+        if (written === 0) {
+            return paintImages({ images, buffers, times, requestId, renderEpoch, prepareId, time, presentationId });
+        }
+        const useAsyncBitmapPath = asyncRender;
         if (useAsyncBitmapPath) {
             const promises = frameBitmapPromises;
             promises.length = written;
@@ -946,25 +1499,32 @@ const render = (time, force) => {
                     : createImageBitmap(imageData);
                 images[i] = item;
             }
-            Promise.all(promises).then((bitmaps) => {
+            Promise.all(promises)
+                .then((bitmaps) => {
                 for (let i = 0; i < written; i++) {
                     images[i].image = bitmaps[i];
                 }
                 if (debug)
                     times.JSBitmapGenerationTime = Date.now() - (times.JSRenderTime || 0);
-                paintImages({ images, buffers: bitmaps, times });
-            }).catch(() => {
+                paintImages({ images, buffers: bitmaps, times, requestId, renderEpoch, prepareId, time, presentationId });
+            })
+                .catch(() => {
                 if (asyncRenderOptions) {
                     asyncRenderOptions = false;
                     console.warn('[AkariSub] createImageBitmap options not supported, disabling');
                     metrics.pendingRenders--;
                     completeRenderCycle();
-                    render(time, force);
+                    render(time, force, requestId, renderEpoch, prepareId, presentationId);
                 }
                 else {
                     metrics.pendingRenders--;
-                    postMessage({ target: 'unbusy' });
-                    completeRenderCycle();
+                    if (prepareId == null) {
+                        postMessage({ target: 'unbusy', requestId, renderEpoch });
+                        completeRenderCycle();
+                    }
+                    else {
+                        void postPreparedSnapshot(prepareId, renderEpoch, time).finally(() => completeRenderCycle());
+                    }
                 }
             });
         }
@@ -1000,31 +1560,156 @@ const render = (time, force) => {
                 }
                 images[i] = item;
             }
-            paintImages({ images, buffers, times });
+            paintImages({ images, buffers, times, requestId, renderEpoch, prepareId, time, presentationId });
         }
     }
     else {
         metrics.pendingRenders--;
-        postMessage({ target: 'unbusy' });
-        completeRenderCycle();
+        if (prepareId == null) {
+            postMessage({ target: 'unbusy', requestId, renderEpoch });
+            completeRenderCycle();
+        }
+        else {
+            void postPreparedSnapshot(prepareId, renderEpoch, time).finally(() => completeRenderCycle());
+        }
     }
 };
-self.demand = ({ time }) => {
+self.demand = ({ time, force: demandForce, requestId, renderEpoch, presentationId }) => {
     lastCurrentTime = time;
     lastCurrentTimeReceivedAt = nowMs();
-    const force = forceNextDemandRender ? 1 : 0;
-    forceNextDemandRender = false;
-    render(time, force);
+    if (presentationId != null)
+        latestPresentationId = Math.max(latestPresentationId, presentationId);
+    const force = demandForce ? 1 : consumeNextRenderForce();
+    render(time, force, requestId, renderEpoch, undefined, presentationId);
+};
+self.prepare = ({ time, prepareId, renderEpoch, force }) => {
+    render(time, force ? 1 : 0, undefined, renderEpoch, prepareId);
 };
 const renderLoop = (force) => {
     rafId = null;
-    render(getCurrentTime(), force);
+    render(getRenderClockTime(), force || consumeNextRenderForce());
     if (!_isPaused) {
         rafId = requestAnimationFrame(renderLoop);
     }
 };
-const paintImages = ({ times, images, buffers }) => {
+const paintRawAssImages = ({ times, meta, count, requestId, renderEpoch, presentationId }) => {
     metrics.pendingRenders--;
+    if (isStalePresentation(presentationId, latestPresentationId)) {
+        postMessage({ target: 'unbusy', requestId, renderEpoch, presentationId, painted: false });
+        completeRenderCycle();
+        return;
+    }
+    const width = self.width;
+    const height = self.height;
+    const renderStart = performance.now();
+    let painted = true;
+    try {
+        const pixels = rawAssWebGL2Renderer.renderRawAssMetadata(meta, count, self.HEAPU8, width, height);
+        if (debug) {
+            times.JSRenderTime = performance.now() - renderStart;
+            times.bitmaps = count;
+            times.rawPixels = pixels;
+            let total = 0;
+            for (const key in times) {
+                if (key !== 'bitmaps' && key !== 'rawPixels')
+                    total += times[key] || 0;
+            }
+            console.log(`[WEBGL2-RAW-ASS] Bitmaps: ${count} Pixels: ${pixels} Total: ${total | 0}ms`, times);
+        }
+    }
+    catch (error) {
+        painted = false;
+        console.error('[AkariSub] Raw ASS_Image WebGL2 render failed:', error);
+    }
+    postMessage({ target: 'unbusy', requestId, renderEpoch, presentationId, painted });
+    completeRenderCycle(painted);
+};
+const ensurePreparedCanvas = () => {
+    const width = self.width;
+    const height = self.height;
+    if (!preparedCanvas)
+        preparedCanvas = new OffscreenCanvas(width, height);
+    if (preparedCanvas.width !== width || preparedCanvas.height !== height) {
+        preparedCanvas.width = width;
+        preparedCanvas.height = height;
+        preparedCtx = null;
+    }
+    preparedCtx ??= preparedCanvas.getContext('2d');
+    if (!preparedCtx)
+        throw new Error('Prepared-frame canvas is unavailable');
+    return preparedCtx;
+};
+const postPreparedSnapshot = async (prepareId, renderEpoch, time) => {
+    try {
+        const context = ensurePreparedCanvas();
+        const bitmap = context.canvas.transferToImageBitmap();
+        postMessage({ target: 'preparedFrame', prepareId, renderEpoch, time, width: self.width, height: self.height, bitmap }, [bitmap]);
+    }
+    catch (error) {
+        if (debug)
+            console.warn('[AkariSub] Failed to copy prepared exact frame:', error);
+        postMessage({ target: 'preparedFrame', prepareId, renderEpoch, time });
+    }
+};
+const paintPreparedImages = (images, prepareId, renderEpoch, time) => {
+    const width = self.width;
+    const height = self.height;
+    try {
+        preparedCtx = ensurePreparedCanvas();
+        preparedCtx.clearRect(0, 0, width, height);
+        for (const image of images) {
+            if (!image.image)
+                continue;
+            if (image.image instanceof ImageBitmap) {
+                preparedCtx.drawImage(image.image, image.x, image.y);
+                image.image.close();
+                continue;
+            }
+            if (!preparedBufferCanvas)
+                preparedBufferCanvas = new OffscreenCanvas(image.w, image.h);
+            if (preparedBufferCanvas.width !== image.w || preparedBufferCanvas.height !== image.h) {
+                preparedBufferCanvas.width = image.w;
+                preparedBufferCanvas.height = image.h;
+                preparedBufferCtx = null;
+            }
+            preparedBufferCtx ??= preparedBufferCanvas.getContext('2d');
+            if (!preparedBufferCtx)
+                throw new Error('Prepared-frame buffer canvas is unavailable');
+            const byteLength = image.w * image.h * 4;
+            const pixels = image.image instanceof Uint8ClampedArray
+                ? image.image
+                : self.HEAPU8C.subarray(image.image, image.image + byteLength);
+            preparedBufferCtx.putImageData(new ImageData(pixels, image.w, image.h), 0, 0);
+            preparedCtx.drawImage(preparedBufferCanvas, image.x, image.y);
+        }
+        void postPreparedSnapshot(prepareId, renderEpoch, time).finally(() => completeRenderCycle());
+    }
+    catch (error) {
+        for (const image of images) {
+            if (image.image instanceof ImageBitmap)
+                image.image.close();
+        }
+        if (debug)
+            console.warn('[AkariSub] Failed to prepare exact frame:', error);
+        postMessage({ target: 'preparedFrame', prepareId, renderEpoch, time, unchanged: true });
+        completeRenderCycle();
+    }
+};
+const paintImages = ({ times, images, buffers, requestId, renderEpoch, prepareId, time, presentationId }) => {
+    metrics.pendingRenders--;
+    if (prepareId != null) {
+        paintPreparedImages(images, prepareId, renderEpoch, time ?? 0);
+        return;
+    }
+    if (isStalePresentation(presentationId, latestPresentationId)) {
+        for (const image of images) {
+            if (image.image instanceof ImageBitmap)
+                image.image.close();
+        }
+        postMessage({ target: 'unbusy', requestId, renderEpoch, presentationId, painted: false });
+        completeRenderCycle();
+        return;
+    }
     const width = self.width;
     const height = self.height;
     const imageCount = images.length;
@@ -1035,17 +1720,23 @@ const paintImages = ({ times, images, buffers }) => {
         times,
         width,
         height,
-        colorSpace: subtitleColorSpace
+        colorSpace: subtitleColorSpace,
+        requestId,
+        renderEpoch,
+        presentationId
     };
     if (offscreenRender) {
-        // Only resize canvas when dimensions actually change
         if (offCanvas.height !== height || offCanvas.width !== width) {
             offCanvas.width = width;
             offCanvas.height = height;
         }
         offCanvasCtx.clearRect(0, 0, width, height);
-        if (asyncRender) {
-            // Batch draw all images
+        const firstImage = imageCount > 0 ? images[0].image : null;
+        const hasImageBitmapInputs = typeof ImageBitmap !== 'undefined' && firstImage instanceof ImageBitmap;
+        if (hasImageBitmapInputs) {
+            // Batch draw all ImageBitmaps. This is much faster than rebuilding ImageData
+            // from WASM-backed RGBA pointers and works for both plain offscreenRender=true
+            // and hybrid offscreen rendering.
             for (let i = 0; i < imageCount; i++) {
                 const img = images[i];
                 if (img.image) {
@@ -1055,13 +1746,11 @@ const paintImages = ({ times, images, buffers }) => {
             }
         }
         else {
-            // Non-async path with buffer canvas
             for (let i = 0; i < imageCount; i++) {
                 const img = images[i];
                 if (img.image) {
                     const imgW = img.w;
                     const imgH = img.h;
-                    // Only resize buffer canvas when needed
                     if (bufferCanvas.width !== imgW || bufferCanvas.height !== imgH) {
                         bufferCanvas.width = imgW;
                         bufferCanvas.height = imgH;
@@ -1077,7 +1766,7 @@ const paintImages = ({ times, images, buffers }) => {
         if (offscreenRender === 'hybrid') {
             if (!imageCount) {
                 postMessage(resultObject);
-                completeRenderCycle();
+                completeRenderCycle(true);
                 return;
             }
             if (debug)
@@ -1090,10 +1779,10 @@ const paintImages = ({ times, images, buffers }) => {
                     asyncRender: true
                 };
                 postMessage(result, [bitmap]);
-                completeRenderCycle();
+                completeRenderCycle(true);
             }
             catch {
-                postMessage({ target: 'unbusy' });
+                postMessage({ target: 'unbusy', requestId, renderEpoch });
                 completeRenderCycle();
             }
         }
@@ -1105,41 +1794,54 @@ const paintImages = ({ times, images, buffers }) => {
                     total += times[key] || 0;
                 console.log('Bitmaps: ' + imageCount + ' Total: ' + (total | 0) + 'ms', times);
             }
-            postMessage({ target: 'unbusy' });
-            completeRenderCycle();
+            postMessage({ target: 'unbusy', requestId, renderEpoch, painted: true });
+            completeRenderCycle(true);
         }
     }
     else {
         postMessage(resultObject, buffers);
-        completeRenderCycle();
+        completeRenderCycle(true);
     }
 };
-// Custom requestAnimationFrame for worker
-const requestAnimationFrame = self.requestAnimationFrame ? self.requestAnimationFrame.bind(self) : (() => {
-    let nextRAF = 0;
-    return (func) => {
-        const now = nowMs();
-        if (nextRAF === 0) {
-            nextRAF = now + 1000 / targetFps;
-        }
-        else {
-            while (now + 2 >= nextRAF) {
-                nextRAF += 1000 / targetFps;
+const requestAnimationFrame = self.requestAnimationFrame
+    ? self.requestAnimationFrame.bind(self)
+    : (() => {
+        let nextRAF = 0;
+        return (func) => {
+            const now = nowMs();
+            if (nextRAF === 0) {
+                nextRAF = now + 1000 / targetFps;
             }
-        }
-        const delay = Math.max(nextRAF - now, 0);
-        return setTimeout(func, delay);
-    };
-})();
+            else {
+                while (now + 2 >= nextRAF) {
+                    nextRAF += 1000 / targetFps;
+                }
+            }
+            const delay = Math.max(nextRAF - now, 0);
+            return setTimeout(func, delay);
+        };
+    })();
 const cancelAnimationFrame = self.cancelAnimationFrame ? self.cancelAnimationFrame.bind(self) : clearTimeout;
-// =============================================================================
-// WASM Initialization
-// =============================================================================
 self.init = async (data) => {
     hasBitmapBug = data.hasBitmapBug;
     fullTrackWarmupEnabled = !!data.fullTrackWarmup;
+    frameTimelineMode = !!data.frameTimelineMode;
+    adaptiveTiming = data.adaptiveTiming ?? true;
+    configuredRenderAheadSeconds = Number.isFinite(data.renderAhead) ? data.renderAhead : 0;
+    _isPaused = data.initialIsPaused ?? true;
+    if (typeof data.initialPlaybackRate === 'number' && Number.isFinite(data.initialPlaybackRate)) {
+        rate = data.initialPlaybackRate;
+    }
     if (typeof data.initialTime === 'number' && Number.isFinite(data.initialTime)) {
         lastCurrentTime = data.initialTime;
+        if (!_isPaused &&
+            typeof data.initialTimeSnapshotAtMs === 'number' &&
+            Number.isFinite(data.initialTimeSnapshotAtMs)) {
+            lastCurrentTimeReceivedAt = nowMs() - Math.max(0, Date.now() - data.initialTimeSnapshotAtMs);
+        }
+        else {
+            lastCurrentTimeReceivedAt = nowMs();
+        }
     }
     const _fetch = self.fetch;
     const setWasmUrl = (wasmUrl) => {
@@ -1150,11 +1852,20 @@ self.init = async (data) => {
     const restoreFetch = () => {
         self.fetch = _fetch;
     };
-    const loadWasm = (wasmUrl) => {
+    const loadWasm = async (wasmUrl, glueUrl) => {
+        const jsGlueUrl = glueUrl || glueUrlFromWasmUrl(wasmUrl);
+        const glue = (await import(/* @vite-ignore */ jsGlueUrl));
+        const WASM = glue.default;
         setWasmUrl(wasmUrl);
-        return WASM({
-            wasm: !WebAssembly.instantiateStreaming ? read_(wasmUrl, true) : undefined
-        }).finally(restoreFetch);
+        try {
+            return await WASM({
+                locateFile: (path) => (path.endsWith('.wasm') ? wasmUrl : path),
+                wasm: !WebAssembly.instantiateStreaming ? read_(wasmUrl, true) : undefined
+            });
+        }
+        finally {
+            restoreFetch();
+        }
     };
     const onWasmLoaded = async (Module) => {
         _Module = Module; // Store module reference for FS access
@@ -1162,6 +1873,7 @@ self.init = async (data) => {
             create: Module._akarisub_create,
             destroy: Module._akarisub_destroy,
             setDropAnimations: Module._akarisub_set_drop_animations,
+            setAdaptiveBlendLayouts: Module._akarisub_set_adaptive_blend_layouts,
             createTrackMem: Module._akarisub_create_track_mem,
             removeTrack: Module._akarisub_remove_track,
             resizeCanvas: Module._akarisub_resize_canvas,
@@ -1169,6 +1881,7 @@ self.init = async (data) => {
             reloadFonts: Module._akarisub_reload_fonts,
             setDefaultFont: Module._akarisub_set_default_font,
             setFallbackFonts: Module._akarisub_set_fallback_fonts,
+            setUseFontconfigProvider: Module._akarisub_set_use_fontconfig_provider,
             setMemoryLimits: Module._akarisub_set_memory_limits,
             getEventCount: Module._akarisub_get_event_count,
             allocEvent: Module._akarisub_alloc_event,
@@ -1190,9 +1903,9 @@ self.init = async (data) => {
             getEventTimeRange: Module._akarisub_get_event_time_range,
             getEmptyWindow: Module._akarisub_get_empty_window,
             renderBlendCollect: Module._akarisub_render_blend_collect,
-            renderImageCollect: Module._akarisub_render_image_collect
+            renderImageCollect: Module._akarisub_render_image_collect,
+            renderRawCollect: Module._akarisub_render_raw_collect
         };
-        // Normalize fallback fonts and deduplicate
         const fallbackFonts = [];
         const fallbackFontKeys = new Set();
         if (data.fallbackFonts && data.fallbackFonts.length > 0) {
@@ -1262,6 +1975,7 @@ self.init = async (data) => {
         self.width = data.width;
         self.height = data.height;
         onDemandRenderMode = !!data.onDemandRender;
+        rawAssImageGpuEnabled = !!data.rawAssImageGpu;
         blendMode = data.blendMode;
         asyncRender = data.asyncRender;
         if (asyncRender && typeof createImageBitmap === 'undefined') {
@@ -1274,8 +1988,7 @@ self.init = async (data) => {
                 const testCtx = testCanvas.getContext('2d');
                 if (testCtx) {
                     const testData = testCtx.getImageData(0, 0, 1, 1);
-                    await createImageBitmap(testData, { premultiplyAlpha: 'none', colorSpaceConversion: 'none' })
-                        .catch(() => {
+                    await createImageBitmap(testData, { premultiplyAlpha: 'none', colorSpaceConversion: 'none' }).catch(() => {
                         asyncRenderOptions = false;
                         console.warn('[AkariSub] createImageBitmap options not supported (Safari?), rendering without options');
                     });
@@ -1289,6 +2002,7 @@ self.init = async (data) => {
         debug = data.debug;
         targetFps = data.targetFps || targetFps;
         useLocalFonts = data.useLocalFonts;
+        useFontconfigProvider = data.useFontconfigProvider;
         dropAllBlur = data.dropAllBlur;
         clampPos = data.clampPos;
         // Load fallback fonts asynchronously to avoid blocking worker thread
@@ -1301,29 +2015,26 @@ self.init = async (data) => {
                 if (availableFonts && availableFonts[fontKey]) {
                     const fontUrl = availableFonts[fontKey];
                     if (typeof fontUrl === 'string') {
-                        // Async fetch for URL-based fonts
-                        const promise = new Promise((resolve) => {
-                            readAsync(fontUrl, (fontData) => {
-                                writeFontToFSImmediate(new Uint8Array(fontData), true);
+                        const promise = readBoundedFontUrl(fontUrl)
+                            .then((fontData) => {
+                            const accepted = writeFontToFSImmediate(fontData, true);
+                            if (accepted) {
                                 fontMap_[fontKey] = true;
                                 if (debug)
                                     console.log('[AkariSub] Loaded fallback font async:', fontKey);
-                                resolve();
-                            }, (e) => {
-                                console.error('Failed to load fallback font:', fontKey, e);
-                                resolve(); // Don't fail initialization if a single font fails
-                            });
+                            }
+                        })
+                            .catch((error) => {
+                            console.error('Failed to load fallback font:', fontKey, error);
                         });
                         fontPromises.push(promise);
                     }
                     else {
-                        // Font data directly provided - synchronous write is OK here
-                        writeFontToFSImmediate(fontUrl, true);
-                        fontMap_[fontKey] = true;
+                        if (writeFontToFSImmediate(fontUrl, true))
+                            fontMap_[fontKey] = true;
                     }
                 }
             }
-            // Wait for all fonts to load (with 30s timeout to prevent blocking forever)
             if (fontPromises.length > 0) {
                 let timeoutId = null;
                 let timedOut = false;
@@ -1346,18 +2057,13 @@ self.init = async (data) => {
                 }
             }
         };
-        await loadFallbackFontsAsync();
         const primaryFallback = fallbackFonts.length > 0 ? fallbackFonts[0] : null;
         akariSubHandle = withCString(primaryFallback || '', (fontPtr) => {
             return requireApi().create(self.width, self.height, fontPtr, debug ? 1 : 0);
         });
-        if (pendingFallbackFonts.length > 0) {
-            for (const { data: fontData, name: fontName } of pendingFallbackFonts) {
-                addFontAsEmbedded(fontData, fontName);
-            }
-            pendingFallbackFonts.length = 0;
-            requireApi().reloadFonts(akariSubHandle);
-        }
+        // Admission requires a live libass handle. Load fallback bytes only after
+        // creation so rejected files are never retained in MEMFS or fontMap_.
+        await loadFallbackFontsAsync();
         if (fallbackFonts.length > 0) {
             withCString(fallbackFonts.join(','), (fontsPtr) => {
                 requireApi().setFallbackFonts(requireHandle(), fontsPtr);
@@ -1375,11 +2081,7 @@ self.init = async (data) => {
             if (!subContent)
                 subContent = read_(data.subUrl);
         }
-        // For large files, emit partial_ready early to allow playback to start
-        // while font loading and track parsing continues in the background
-        const isLargeSubtitle = typeof subContent === 'string'
-            ? subContent.length > 500000
-            : toUint8Array(subContent).byteLength > 500000;
+        const isLargeSubtitle = typeof subContent === 'string' ? subContent.length > 500000 : toUint8Array(subContent).byteLength > 500000;
         if (isLargeSubtitle) {
             postMessage({ target: 'partial_ready' });
             if (debug)
@@ -1400,23 +2102,23 @@ self.init = async (data) => {
         const attachedFontPromises = [];
         for (const font of data.fonts || []) {
             if (typeof font === 'string') {
-                const promise = new Promise((resolve) => {
-                    readAsync(font, (fontData) => {
-                        writeFontToFSImmediate(new Uint8Array(fontData), false);
+                const promise = readBoundedFontUrl(font)
+                    .then((fontData) => {
+                    const accepted = writeFontToFSImmediate(fontData, false);
+                    if (accepted) {
                         hasAttachedFonts = true;
                         if (debug)
                             console.log('[AkariSub] Loaded attached font async:', font);
-                        resolve();
-                    }, (e) => {
-                        console.error('Failed to load attached font:', font, e);
-                        resolve();
-                    });
+                    }
+                })
+                    .catch((error) => {
+                    console.error('Failed to load attached font:', font, error);
                 });
                 attachedFontPromises.push(promise);
             }
             else {
-                writeFontToFSImmediate(font, false);
-                hasAttachedFonts = true;
+                if (writeFontToFSImmediate(font, false))
+                    hasAttachedFonts = true;
             }
         }
         if (attachedFontPromises.length > 0) {
@@ -1447,6 +2149,8 @@ self.init = async (data) => {
             if (debug)
                 console.log('[AkariSub] Font reload complete');
         }
+        // Enable fontconfig only after startup fonts are in MEMFS (see AkariSub ctor).
+        requireApi().setUseFontconfigProvider(requireHandle(), useFontconfigProvider ? 1 : 0);
         if (typeof subContent === 'string') {
             createTrackFromString(subContent);
         }
@@ -1462,45 +2166,118 @@ self.init = async (data) => {
         firstTrackEventStartTime = getFirstEventStartTime();
         subtitleColorSpace = libassYCbCrMap[requireApi().getTrackColorSpace(requireHandle())];
         requireApi().setDropAnimations(requireHandle(), data.dropAllAnimations || 0);
+        requireApi().setAdaptiveBlendLayouts(requireHandle(), data.adaptiveBlendLayouts ? 1 : 0);
+        blockingFullTrackWarmup = data.blockingFullTrackWarmup;
+        fullTrackWarmupStepSeconds = data.fullTrackWarmupStep > 0 ? data.fullTrackWarmupStep : FULL_WARMUP_STEP_SECONDS;
         if (data.libassMemoryLimit > 0 || data.libassGlyphLimit > 0) {
             requireApi().setMemoryLimits(requireHandle(), data.libassGlyphLimit || 0, data.libassMemoryLimit || 0);
         }
         initPool();
         ensureRenderCollectBuffer(PREWARM_MAX_IMAGES);
         try {
-            prewarmRenderer(lastCurrentTime);
+            prewarmRenderer(getCurrentTime());
         }
         catch (e) {
             if (debug)
                 console.warn('[AkariSub] Prewarm render failed, continuing:', e);
         }
-        forceNextDemandRender = true;
+        if (blockingFullTrackWarmup && fullTrackWarmupEnabled && !fullTrackWarmupStarted) {
+            fullTrackWarmupStarted = true;
+            const generation = trackGeneration;
+            fullTrackWarmupGeneration = generation;
+            try {
+                await prewarmEntireTrack(generation);
+            }
+            catch (e) {
+                if (debug)
+                    console.warn('[AkariSub] Full track warmup failed, continuing:', e);
+            }
+            try {
+                prewarmRenderer(getCurrentTime(), generation);
+            }
+            catch (e) {
+                if (debug)
+                    console.warn('[AkariSub] Post-warmup re-prime failed, continuing:', e);
+            }
+        }
+        markNextRenderForced();
         postMessage({ target: 'ready' });
         postMessage({ target: 'verifyColorSpace', subtitleColorSpace });
-        scheduleFullTrackWarmup();
     };
-    loadWasm(data.wasmUrl).then(onWasmLoaded).catch((e) => {
+    loadWasm(data.wasmUrl, data.glueUrl)
+        .then(onWasmLoaded)
+        .catch((e) => {
         console.error('[AkariSub] WASM loading failed:', e);
         postMessage({ target: 'error', error: 'WASM loading failed: ' + (e && e.message ? e.message : String(e)) });
     });
 };
-// =============================================================================
-// Canvas Management
-// =============================================================================
-self.offscreenCanvas = ({ transferable }) => {
+self.offscreenCanvas = ({ transferable, rawAssImageGpu }) => {
     offCanvas = transferable[0];
-    offCanvasCtx = offCanvas.getContext('2d', { desynchronized: true });
-    if (!asyncRender) {
-        bufferCanvas = new OffscreenCanvas(self.width, self.height);
-        bufferCtx = bufferCanvas.getContext('2d', { desynchronized: true });
+    rawAssWebGL2Renderer = null;
+    const useRawAssImageGpu = rawAssImageGpu ?? rawAssImageGpuEnabled;
+    if (useRawAssImageGpu) {
+        try {
+            const renderer = new RawASSImageWebGL2Renderer();
+            if (renderer.init(offCanvas, self.width, self.height)) {
+                rawAssWebGL2Renderer = renderer;
+                offCanvasCtx = null;
+                bufferCanvas = null;
+                bufferCtx = null;
+                offscreenRender = true;
+                if (debug)
+                    console.log('[AkariSub] Using worker WebGL2 raw ASS_Image renderer');
+                return;
+            }
+        }
+        catch (error) {
+            rawAssWebGL2Renderer = null;
+            if (debug)
+                console.warn('[AkariSub] Worker WebGL2 raw ASS_Image renderer unavailable:', error);
+        }
     }
+    offCanvasCtx = offCanvas.getContext('2d');
+    // Plain offscreen rendering draws raw WASM image pointers through a reusable
+    // buffer canvas. Create it regardless of asyncRender because the render path
+    // deliberately disables per-image ImageBitmap creation for offscreenRender=true.
+    bufferCanvas = new OffscreenCanvas(self.width, self.height);
+    bufferCtx = bufferCanvas.getContext('2d');
     offscreenRender = true;
 };
 self.detachOffscreen = () => {
+    rawAssWebGL2Renderer?.destroy();
+    rawAssWebGL2Renderer = null;
     offCanvas = new OffscreenCanvas(self.width, self.height);
-    offCanvasCtx = offCanvas.getContext('2d', { desynchronized: true });
+    offCanvasCtx = offCanvas.getContext('2d');
     offscreenRender = 'hybrid';
 };
+self.presentFrame = ({ bitmap, presentationId, renderEpoch, frameIndex }) => {
+    let painted = false;
+    try {
+        if (isStalePresentation(presentationId, latestPresentationId))
+            return;
+        latestPresentationId = Math.max(latestPresentationId, presentationId);
+        if (!offCanvasCtx || !offCanvas)
+            return;
+        offCanvasCtx.clearRect(0, 0, offCanvas.width, offCanvas.height);
+        offCanvasCtx.drawImage(bitmap, 0, 0);
+        painted = true;
+    }
+    finally {
+        bitmap.close();
+        if (painted)
+            postMessage({ target: 'presentedFrame', presentationId, renderEpoch, frameIndex });
+    }
+};
+self.presentation = ({ presentationId }) => {
+    if (Number.isSafeInteger(presentationId)) {
+        latestPresentationId = Math.max(latestPresentationId, presentationId);
+    }
+};
+self.frameTimelineMode = ({ enabled }) => {
+    frameTimelineMode = enabled;
+    if (enabled)
+        stopWarmup();
+};
 self.canvas = ({ width, height, videoWidth, videoHeight, force }) => {
     if (width == null)
         throw new Error('Invalid canvas size specified');
@@ -1509,20 +2286,28 @@ self.canvas = ({ width, height, videoWidth, videoHeight, force }) => {
     if (akariSubHandle)
         requireApi().resizeCanvas(akariSubHandle, width, height, videoWidth, videoHeight);
     if (force)
-        render(lastCurrentTime, true);
+        render(getRenderClockTime(), true);
 };
-self.video = ({ currentTime, isPaused, rate: newRate }) => {
+self.video = ({ currentTime, isPaused, rate: newRate, renderAhead }) => {
+    if (renderAhead != null && Number.isFinite(renderAhead))
+        configuredRenderAheadSeconds = renderAhead;
     if (currentTime != null)
         setCurrentTime(currentTime);
     if (isPaused != null)
         setIsPaused(isPaused);
     if (newRate != null)
-        rate = newRate;
+        setPlaybackRate(newRate);
 };
 self.destroy = () => {
     stopWarmup();
-    fullTrackWarmupPromise = null;
+    advanceTrackGeneration();
     firstTrackEventStartTime = null;
+    rawAssWebGL2Renderer?.destroy();
+    rawAssWebGL2Renderer = null;
+    preparedCanvas = null;
+    preparedCtx = null;
+    preparedBufferCanvas = null;
+    preparedBufferCtx = null;
     if (_Module) {
         if (rrcBufPtr) {
             _Module._free(rrcBufPtr);
@@ -1544,9 +2329,6 @@ self.destroy = () => {
 self.setAsyncRender = ({ value }) => {
     asyncRender = value && typeof createImageBitmap !== 'undefined';
 };
-// =============================================================================
-// Event Management
-// =============================================================================
 const applyEventFields = (index, event) => {
     const api = requireApi();
     const handle = requireHandle();
@@ -1637,6 +2419,7 @@ self.createEvent = ({ event }) => {
     if (index >= 0)
         applyEventFields(index, event);
     syncTotalEventsMetric();
+    markNextRenderForced();
 };
 self.getEvents = () => {
     const events = [];
@@ -1655,18 +2438,18 @@ self.getEvents = () => {
 };
 self.setEvent = ({ event, index }) => {
     applyEventFields(index, event);
+    markNextRenderForced();
 };
 self.removeEvent = ({ index }) => {
     requireApi().removeEvent(requireHandle(), index);
     syncTotalEventsMetric();
+    markNextRenderForced();
 };
-// =============================================================================
-// Style Management
-// =============================================================================
 self.createStyle = ({ style }) => {
     const index = requireApi().allocStyle(requireHandle());
     if (index >= 0)
         applyStyleFields(index, style);
+    markNextRenderForced();
     return index;
 };
 self.getStyles = () => {
@@ -1680,27 +2463,29 @@ self.getStyles = () => {
 };
 self.setStyle = ({ style, index }) => {
     applyStyleFields(index, style);
+    markNextRenderForced();
 };
 self.removeStyle = ({ index }) => {
     requireApi().removeStyle(requireHandle(), index);
+    markNextRenderForced();
 };
 self.styleOverride = (data) => {
     const index = self.createStyle(data);
     if (typeof index === 'number' && index >= 0) {
         requireApi().styleOverrideIndex(requireHandle(), index);
     }
+    markNextRenderForced();
 };
 self.disableStyleOverride = () => {
     requireApi().disableStyleOverride(requireHandle());
+    markNextRenderForced();
 };
 self.defaultFont = ({ font }) => {
     withCString(font, (fontPtr) => {
         requireApi().setDefaultFont(requireHandle(), fontPtr);
     });
+    markNextRenderForced();
 };
-// =============================================================================
-// Performance Metrics
-// =============================================================================
 self.getStats = () => {
     const avgRenderTime = metrics.framesRendered > 0 ? metrics.totalRenderTime / metrics.framesRendered : 0;
     postMessage({
@@ -1712,8 +2497,22 @@ self.getStats = () => {
             maxRenderTime: Math.round(metrics.maxRenderTime * 100) / 100,
             minRenderTime: metrics.minRenderTime === Infinity ? 0 : Math.round(metrics.minRenderTime * 100) / 100,
             lastRenderTime: Math.round(metrics.lastRenderTime * 100) / 100,
+            timingCompensationMs: Math.round(fallbackTimingCompensationSeconds * 100_000) / 100,
+            lastImageCount: metrics.lastImageCount,
+            lastImagePixels: metrics.lastImagePixels,
             pendingRenders: Math.max(0, metrics.pendingRenders),
             totalEvents: metrics.totalEvents,
+            usingWorker: true,
+            offscreenRender: !!offscreenRender,
+            rawAssImageGpu: !!rawAssWebGL2Renderer,
+            workerRenderer: rawAssWebGL2Renderer
+                ? 'webgl2-raw-ass'
+                : offscreenRender === 'hybrid'
+                    ? 'hybrid'
+                    : offscreenRender
+                        ? 'canvas2d'
+                        : 'main-thread',
+            onDemandRender: onDemandRenderMode,
             cacheHits: metrics.cacheHits,
             cacheMisses: metrics.cacheMisses
         }
@@ -1731,11 +2530,12 @@ self.getStyleCount = () => {
     const count = akariSubHandle ? requireApi().getStyleCount(akariSubHandle) : 0;
     postMessage({ target: 'getStyleCount', count });
 };
-// =============================================================================
-// Message Handler
-// =============================================================================
 const RENDER_SAFE_TARGETS = new Set([
     'demand',
+    'prepare',
+    'presentation',
+    'presentFrame',
+    'frameTimelineMode',
     'video',
     'getEvents',
     'getStyles',