@@ -126,7 +126,7 @@ export class Animation extends Array<Frame> {
      */
     async encodeGIF(quality = 95, metadata: Metadata = {}): Promise<Uint8Array> {
         this.__validate__();
-        const frames = this.__optimized__({ replace: false, even: false, alpha: 'frame' }).map(f => ({
+        const frames = this.__optimized__({ replace: false, even: false, alpha: 'frame', palette: 256 }).map(f => ({
             x: f.x,
             y: f.y,
             width: f.width,
 
@@ -164,7 +164,8 @@ interface PixelFormat {
 export function alphaCost(images: Uint8Array[]): number {
     let grey = true;
     const colors = new Set<number>();
-    for (const rgba of images) {
+    // more than 256 colors and not grey: truecolor either way, nothing else can change
+    scan: for (const rgba of images) {
         const pixels = new Uint32Array(rgba.buffer, rgba.byteOffset, rgba.length >> 2);
         let previous = -1;
         for (let i = 0; i < pixels.length; i++) {
@@ -175,6 +176,7 @@ export function alphaCost(images: Uint8Array[]): number {
             if (rgba[o + 3] === 0) continue;
             if (rgba[o] !== rgba[o + 1] || rgba[o] !== rgba[o + 2]) grey = false;
             if (colors.size <= 256) colors.add(value);
+            else if (!grey) break scan;
         }
     }
     // bytes per pixel: palette 1/8 to 1 (by its bit depth), grey 1 (with alpha 2), truecolor 3 (with alpha 4)
 
@@ -48,6 +48,11 @@ export interface OptimizeOptions {
      * (the transparent pixels are the sparse frames' unchanged ones) than without the transparent pixels
      */
     alpha: 'frame' | ((frames: OptimizedFrame[]) => number);
+    /**
+     * The palette size if each frame has one (GIF: 256): a frame stays dense if its colors fit, but its sparse pixels
+     * (the transparent ones are a color more) don't, so they'd lose colors
+     */
+    palette?: number;
 }
 
 // what transparent pixels make an opaque frame cost: an alpha channel, 4 channels instead of 3 (or a palette entry
@@ -59,7 +64,7 @@ const ALPHA_COST = 4 / 3;
  * @param width The canvas width
  * @param height The canvas height
  */
-export function optimize(frames: InputFrame[], width: number, height: number, { replace, even, alpha }: OptimizeOptions): OptimizedFrame[] {
+export function optimize(frames: InputFrame[], width: number, height: number, { replace, even, alpha, palette }: OptimizeOptions): OptimizedFrame[] {
     const size = width * height * 4;
     // the input animation's canvas, and what the optimized animation shows after its last frame (and its disposal)
     const canvas = new Uint8Array(size), canvas32 = new Int32Array(canvas.buffer);
@@ -111,7 +116,9 @@ export function optimize(frames: InputFrame[], width: number, height: number, {
         if (!output.length && (w !== width || h !== height)) opaque = false;
         if (!area.denseOpaque) opaque = false;
         const sparseCost = alpha === 'frame' && area.denseOpaque ? area.sparseChanges * ALPHA_COST : area.sparseChanges;
-        const dense = !blend || area.denseChanges < sparseCost;
+        const dense = !blend || area.denseChanges < sparseCost
+            || (palette !== undefined && colors(new Int32Array(pixels.buffer), w, { x: 0, y: 0, width: w, height: h }, palette + 1) > palette
+                && colors(canvas32, width, changed, palette + 1) <= palette);
         denseTotal += area.denseChanges;
         chosenTotal += dense ? area.denseChanges : area.sparseChanges;
         if (dense) {
@@ -147,18 +154,38 @@ export function optimize(frames: InputFrame[], width: number, height: number, {
         shown.fill(0);
         for (const f of output) {
             const pixels32 = new Int32Array(f.pixels.buffer, f.pixels.byteOffset, f.width * f.height);
-            for (let row = 0, k = 0; row < f.height; row++)
-                for (let p = (f.y + row) * width + f.x, end = p + f.width; p < end; p++, k++) {
-                    if (f.blend && (pixels32[k] & ALPHA) === 0) pixels32[k] = shown32[p];
-                    else shown32[p] = pixels32[k];
-                }
+            for (let row = 0, k = 0; row < f.height; row++, k += f.width) {
+                const start = (f.y + row) * width + f.x;
+                if (!f.blend) shown32.set(pixels32.subarray(k, k + f.width), start);
+                else
+                    for (let i = k, p = start, end = k + f.width; i < end; i++, p++) {
+                        if ((pixels32[i] & ALPHA) === 0) pixels32[i] = shown32[p];
+                        else shown32[p] = pixels32[i];
+                    }
+            }
             f.blend = false;
         }
     }
 
     return output;
 }
 
+// how many colors an area of an image has, counted up to a limit
+function colors(image32: Int32Array, width: number, { x, y, width: w, height: h }: Rect, limit: number): number {
+    const seen = new Set<number>();
+    for (let row = y; row < y + h; row++) {
+        let previous: number | undefined;
+        for (let p = row * width + x, end = p + w; p < end; p++) {
+            const value = image32[p];
+            if (value === previous) continue;
+            previous = value;
+            seen.add(value);
+            if (seen.size >= limit) return seen.size;
+        }
+    }
+    return seen.size;
+}
+
 // a frame that doesn't change anything
 const empty = (duration: number): OptimizedFrame => ({ x: 0, y: 0, width: 1, height: 1, duration, dispose: false, blend: true, pixels: new Uint8Array(4) });
 
 
@@ -118,6 +118,24 @@ const disc = (size, color) => new Image(size, size).fill((x, y) => {
         if (animation.__optimized__({replace: true, even: false, alpha: () => 4 / 3}).some(f => f.blend)) panic('opaque animation: frames weren\'t filled in');
     }
 
+    // a GIF frame stays dense when its colors fill the palette and its sparse pixels wouldn't fit (they'd need one more
+    // color for the unchanged pixels): it stays lossless. The blocks around the center change color, the center doesn't
+    {
+        const color = index => Image.rgbaToColor(index, 255 - index, index * 37 & 255, 255);
+        // 24×24 blocks: the ring around the center has all 256 colors in turn, the center some of them
+        const ring = (i, j) => i < 4 || i > 19 || j < 4 || j > 19;
+        const grid = shift => {
+            const blocks = [];
+            for (let j = 0, k = 0; j < 24; j++) for (let i = 0; i < 24; i++) blocks.push(ring(i, j) ? (k++ + shift) & 255 : (i * 7 + j * 13) & 255);
+            return new Image(96, 96).fill((x, y) => color(blocks[(y >> 2) * 24 + (x >> 2)]));
+        };
+        const animation = new Animation([Frame.from(grid(0), 100), Frame.from(grid(1), 100)]);
+        const decoded = await Animation.decode(await animation.encodeGIF());
+        decoded.forEach((frame, i) => {
+            if (frame.bitmap.some((v, k) => v !== animation[i].bitmap[k])) panic(`palette: GIF frame ${i} lost colors`);
+        });
+    }
+
     // a mostly static animation (like a screen recording) only stores what changes
     {
         const background = new Image(160, 120).fill((x, y) => Image.rgbaToColor(x * 7 ^ y * 13, x * y, y * 5, 255));