@swf2es/render 0.0.0-stage → 0.1.1

package/src/webgl/kernels.ts

@@ -0,0 +1,205 @@
+import { type GlState, linkProgram, ShaderError } from "@swf2es/context3d/device";
+import type { Filters } from "../filters.js";
+import type { KernelImage } from "../kernel-shaders.js";
+import { CLAMP } from "../scene.js";
+
+/**
+ * A Pixel Bender kernel's program: where it takes its uniforms, asked
+ * once each, and the values of up to four floats it was last told for
+ * each, by name (the filter runner's `set`).
+ */
+export interface KernelProgram {
+  program: WebGLProgram;
+  uniforms: Map<string, WebGLUniformLocation | null>;
+  told: Map<string, Float32Array>;
+  at(name: string): WebGLUniformLocation | null;
+}
+
+/** Where kernels' programs find the textures their images are and the samplers they read them by. */
+export interface KernelHost {
+  texture(id: number): WebGLTexture | null;
+  sampler(bits: number): WebGLSampler;
+}
+
+/**
+ * The first unit a kernel's own images are bound to, as many as
+ * kernel-shaders.ts's KERNEL_IMAGES: past every unit the other programs
+ * use (programs.ts's, and the filter passes' 4 to 6), as WebGL 2 has 32
+ * for a draw's programs together.
+ */
+export const KERNEL_UNIT = 16;
+
+/** The most kernels' programs kept, the one used longest ago deleted for another. */
+const KERNEL_PROGRAMS = 32;
+
+/**
+ * The programs of Pixel Bender kernels, a ShaderFilter's, a blend
+ * shader's or a shader fill's, by their fragment shaders, each a use's
+ * own and so with one vertex shader:
+ * linked as first used, the one used longest ago deleted past
+ * KERNEL_PROGRAMS; null for one the GPU would not link, which its user
+ * draws otherwise. One for the backend, which its users share.
+ */
+export class KernelPrograms {
+  private readonly programs = new Map<string, KernelProgram | null>();
+  private readonly ints = new Int32Array(4);
+
+  constructor(
+    private readonly gl: WebGL2RenderingContext,
+    private readonly state: GlState,
+  ) {}
+
+  /**
+   * The program of `vertex` and `fragment`, in use; null where it would
+   * not link. `prepare` is told it as it is linked, to set its samplers.
+   */
+  use(
+    vertex: string,
+    fragment: string,
+    prepare: (program: WebGLProgram) => void,
+  ): KernelProgram | null {
+    const gl = this.gl;
+    // By the fragment shader alone, a use's own, which a frame gives again as the same string.
+    const key = fragment;
+    let kernel = this.programs.get(key);
+    if (kernel !== undefined) {
+      // Used last now.
+      this.programs.delete(key);
+    } else {
+      if (this.programs.size >= KERNEL_PROGRAMS) {
+        const [oldest, old] = this.programs.entries().next().value as [
+          string,
+          KernelProgram | null,
+        ];
+        if (old) {
+          gl.deleteProgram(old.program);
+        }
+
+        this.programs.delete(oldest);
+      }
+
+      kernel = null;
+      try {
+        const program = linkProgram(gl, vertex, fragment);
+        const uniforms = new Map<string, WebGLUniformLocation | null>();
+        kernel = {
+          program,
+          uniforms,
+          told: new Map(),
+          at(name) {
+            let location = uniforms.get(name);
+            if (location === undefined) {
+              location = gl.getUniformLocation(program, name);
+              uniforms.set(name, location);
+            }
+
+            return location;
+          },
+        };
+        this.state.useProgram(program);
+        prepare(program);
+      } catch (e) {
+        if (!(e instanceof ShaderError)) {
+          throw e;
+        }
+      }
+    }
+
+    this.programs.set(key, kernel);
+    if (kernel) {
+      this.state.useProgram(kernel.program);
+    }
+
+    return kernel;
+  }
+
+  /** Texture `id` bound to a kernel's own image unit `k`, which its sampler at `location` names. */
+  bindImage(location: WebGLUniformLocation | null, k: number, id: number, host: KernelHost): void {
+    this.state.bindTexture(KERNEL_UNIT + k, host.texture(id));
+    // Nearest: a float texture with a linear sampler is incomplete, and texelFetch reads either.
+    this.state.bindSampler(KERNEL_UNIT + k, host.sampler(CLAMP));
+    this.gl.uniform1i(location, KERNEL_UNIT + k);
+  }
+
+  /** `count` ints of `source` from `at` set as the ivec4 array at `location`, its program in use. */
+  setInts(location: WebGLUniformLocation | null, source: Int32Array, at: number, count: number) {
+    let values = this.ints;
+    if (count > values.length) {
+      values = new Int32Array(count);
+    }
+
+    values.set(source.subarray(at, at + count));
+    this.gl.uniform4iv(location, values, 0, count);
+  }
+
+  /** What readImages reads into, its records kept from call to call. */
+  private readonly images: KernelImage[] = [];
+
+  /**
+   * The images of the kernel at entry `i` of `filters`, a blend shader's
+   * or a shader fill's, its values laid out as a ShaderFilter's
+   * (filters.ts, SHADER): -1 for what is below, -2 for the layer blended.
+   * Null where a texture of its own is gone, as such a kernel is left out.
+   */
+  readImages(filters: Filters, i: number, host: KernelHost): KernelImage[] | null {
+    const v = filters.values;
+    const at = filters.start[i];
+    const count = v[at + 7];
+    const images = this.images;
+    for (let k = 0; k < count; k++) {
+      const id = v[at + 9 + k * 3];
+      if (id >= 0 && !host.texture(id)) {
+        return null;
+      }
+
+      if (!images[k]) {
+        images[k] = { texture: 0, layer: false, float: false, back: false };
+      }
+
+      const image = images[k];
+      image.texture = v[at + 8 + k * 3];
+      image.layer = id < 0;
+      image.back = id === -1;
+      image.float = v[at + 10 + k * 3] > 0;
+    }
+
+    images.length = count;
+    return images;
+  }
+
+  /** The parameters and own images of the kernel at entry `i` of `filters` set on `kernel`, in use. */
+  setUniforms(kernel: KernelProgram, filters: Filters, i: number, host: KernelHost): void {
+    const v = filters.values;
+    const at = filters.start[i];
+    const count = v[at + 7];
+    let unit = 0;
+    for (let k = 0; k < count; k++) {
+      const id = v[at + 9 + k * 3];
+      if (id >= 0) {
+        this.bindImage(kernel.at(`pbImage${v[at + 8 + k * 3]}`), unit++, id, host);
+      }
+    }
+
+    const floats = at + 8 + count * 3;
+    if (v[floats] > 0) {
+      this.gl.uniform4fv(kernel.at("pbFloats"), v, floats + 1, v[floats]);
+    }
+
+    const ints = filters.intStart[i];
+    const n = filters.intStart[i + 1] - ints;
+    if (n > 0) {
+      this.setInts(kernel.at("pbInts"), filters.ints, ints, n);
+    }
+  }
+
+  /** Every program deleted, as the backend goes; none kept, as a lost context comes back. */
+  clear(): void {
+    for (const kernel of this.programs.values()) {
+      if (kernel) {
+        this.gl.deleteProgram(kernel.program);
+      }
+    }
+
+    this.programs.clear();
+  }
+}

package/src/webgl/pool.ts

@@ -0,0 +1,245 @@
+/**
+ * What a pool holds: its size, and the frame it was last freed in; where
+ * it may be used as smaller than it is, its own size, which it is pooled by.
+ */
+export interface Pooled {
+  width: number;
+  height: number;
+  textureWidth?: number;
+  textureHeight?: number;
+  usedAt: number;
+}
+
+/** What a size, and samples where they count, are keyed by. */
+const SIZE_KEY = 65536;
+const SAMPLES_KEY = 32;
+
+/**
+ * Free targets kept by their size (and samples) for the next to take them:
+ * an exact one found at once, a larger one among the sizes there are, each
+ * size's list in the order they were freed. A frame's end lets go of those
+ * idle too long, then of the least lately freed past a budget, oldest first
+ * from the lists' heads, as the frame's own working set may pass it for a
+ * while without what it gives back being made again.
+ */
+export class SizedPool<T extends Pooled> {
+  private readonly lists = new Map<number, T[]>();
+  private readonly bytesOf: (item: T) => number;
+  /** The bytes all held take together. */
+  bytes = 0;
+
+  constructor(bytesOf: (item: T) => number) {
+    this.bytesOf = bytesOf;
+  }
+
+  /** One of just `width` by `height` (and `samples`), the latest freed; none for none. */
+  take(width: number, height: number, samples = 0): T | null {
+    return this.takeAt((width * SIZE_KEY + height) * SAMPLES_KEY + samples);
+  }
+
+  /** The smallest target that fits, at these samples and within `maxArea`; none for none. */
+  takeFitting(
+    width: number,
+    height: number,
+    samples = 0,
+    maxArea = Number.POSITIVE_INFINITY,
+  ): T | null {
+    let best = -1;
+    let least = Number.POSITIVE_INFINITY;
+    for (const key of this.lists.keys()) {
+      const size = Math.floor(key / SAMPLES_KEY);
+      const w = Math.floor(size / SIZE_KEY);
+      const h = size % SIZE_KEY;
+      if (
+        key % SAMPLES_KEY === samples &&
+        w >= width &&
+        h >= height &&
+        w * h <= maxArea &&
+        w * h < least
+      ) {
+        least = w * h;
+        best = key;
+      }
+    }
+
+    return best < 0 ? null : this.takeAt(best);
+  }
+
+  private takeAt(key: number): T | null {
+    const list = this.lists.get(key);
+    const item = list?.pop() ?? null;
+    if (!item) {
+      return null;
+    }
+
+    // An emptied size goes, so that finding a larger one looks at those held alone.
+    if ((list as T[]).length === 0) {
+      this.lists.delete(key);
+    }
+
+    this.bytes -= this.bytesOf(item);
+    return item;
+  }
+
+  /** `item` free again, freed in frame `frame`, of `samples` where they count. */
+  give(item: T, frame: number, samples = 0): void {
+    item.usedAt = frame;
+    const key =
+      ((item.textureWidth ?? item.width) * SIZE_KEY + (item.textureHeight ?? item.height)) *
+        SAMPLES_KEY +
+      samples;
+    let list = this.lists.get(key);
+    if (!list) {
+      list = [];
+      this.lists.set(key, list);
+    }
+
+    list.push(item);
+    this.bytes += this.bytesOf(item);
+  }
+
+  /**
+   * Those freed more than `idle` frames before `frame` let go of, then the
+   * least lately freed till they take `budget` bytes at most, each `drop`ped.
+   */
+  trim(frame: number, idle: number, budget: number, drop: (item: T) => void): void {
+    this.trimIdle(frame, idle, drop);
+    trimTogether([{ pool: this, drop }], budget);
+  }
+
+  /** Those freed more than `idle` frames before `frame` let go of, each `drop`ped. */
+  trimIdle(frame: number, idle: number, drop: (item: T) => void): void {
+    for (const [key, list] of this.lists) {
+      let gone = 0;
+      while (gone < list.length && frame - list[gone].usedAt > idle) {
+        this.bytes -= this.bytesOf(list[gone]);
+        drop(list[gone]);
+        gone++;
+      }
+
+      if (gone === list.length) {
+        this.lists.delete(key);
+      } else if (gone > 0) {
+        list.splice(0, gone);
+      }
+    }
+  }
+
+  /**
+   * The key of the list whose head goes first past a budget: the least
+   * lately freed, and of those freed in one frame the largest, so that as
+   * few go as may; -1 for none.
+   */
+  firstOut(): number {
+    let best = -1;
+    let bestAt = 0;
+    let bestBytes = 0;
+    for (const [key, list] of this.lists) {
+      const head = list[0];
+      const bytes = this.bytesOf(head);
+      if (best < 0 || head.usedAt < bestAt || (head.usedAt === bestAt && bytes > bestBytes)) {
+        best = key;
+        bestAt = head.usedAt;
+        bestBytes = bytes;
+      }
+    }
+
+    return best;
+  }
+
+  /** The head of list `key` (firstOut), as `firstOut` found it. */
+  headOf(key: number): T {
+    return (this.lists.get(key) as T[])[0];
+  }
+
+  /** The head of list `key` (firstOut) let go of, `drop`ped. */
+  dropHead(key: number, drop: (item: T) => void): void {
+    const list = this.lists.get(key) as T[];
+    const item = list.shift() as T;
+    this.bytes -= this.bytesOf(item);
+    drop(item);
+    if (list.length === 0) {
+      this.lists.delete(key);
+    }
+  }
+
+  /** The bytes those freed in frame `frame` take, which that frame drew with. */
+  bytesFreedIn(frame: number): number {
+    let bytes = 0;
+    for (const list of this.lists.values()) {
+      for (let i = list.length - 1; i >= 0 && list[i].usedAt === frame; i--) {
+        bytes += this.bytesOf(list[i]);
+      }
+    }
+
+    return bytes;
+  }
+
+  /** The bytes `item` takes, as this pool counts them. */
+  bytesFor(item: T): number {
+    return this.bytesOf(item);
+  }
+
+  /** Every one held let go of, as the context goes. */
+  clear(drop: (item: T) => void): void {
+    for (const list of this.lists.values()) {
+      for (const item of list) {
+        drop(item);
+      }
+    }
+
+    this.lists.clear();
+    this.bytes = 0;
+  }
+}
+
+/** A pool and how what it lets go of is deleted. */
+interface Trimmed {
+  // biome-ignore lint/suspicious/noExplicitAny: pools of any kind share one budget.
+  pool: SizedPool<any>;
+  // biome-ignore lint/suspicious/noExplicitAny: as the pool's.
+  drop: (item: any) => void;
+}
+
+/**
+ * `pools` let go of till together they take `budget` bytes at most: the
+ * least lately freed of all first, of those freed in one frame the
+ * largest. One budget for all, as trimming one pool against what another
+ * holds dropped a frame's own small layers while large multisampled
+ * buffers idle for many frames stayed, each frame making them again.
+ */
+export function trimTogether(pools: readonly Trimmed[], budget: number): void {
+  let bytes = 0;
+  for (const { pool } of pools) {
+    bytes += pool.bytes;
+  }
+
+  while (bytes > budget) {
+    let from: Trimmed | null = null;
+    let key = -1;
+    let at = 0;
+    let size = 0;
+    for (const trimmed of pools) {
+      const k = trimmed.pool.firstOut();
+      if (k < 0) {
+        continue;
+      }
+
+      const head = trimmed.pool.headOf(k);
+      const headBytes = trimmed.pool.bytesFor(head);
+      if (!from || head.usedAt < at || (head.usedAt === at && headBytes > size)) {
+        from = trimmed;
+        key = k;
+        at = head.usedAt;
+        size = headBytes;
+      }
+    }
+
+    if (!from) {
+      break;
+    }
+
+    bytes -= size;
+    from.pool.dropHead(key, from.drop);
+  }
+}