perf(web): share card texture via shader UV transform

Move the card sprite repeat/offset out of per-card texture clones and
into a uniform injected into the material shader. Cards now share the
deck sheet (one GPU upload), the shader, and the geometry, with only
per-card material uniforms differing, so navigating a deck no longer
re-uploads the sheet on every step.
This commit is contained in:
2026-08-14 10:46:09 +08:00
parent c665212209
commit 002bcb324b
5 changed files with 173 additions and 48 deletions
+4 -3
View File
@@ -81,9 +81,10 @@ view and the full-setup view.
`textureUrl + color + roughness`. drei already caches textures by URL
globally, so sharing the material on top avoids per-object material
allocation for tiles/tokens with the same image.
- **Cards are the exception:** each card clones its texture for sprite UVs, so
its face material cannot be shared — but its geometry still can (same card
size).
- **Cards:** the face/back textures are shared (drei caches them by URL) and
the sprite cell is selected via a per-material UV transform injected into the
shader (`cardMaterial.ts`), so cards share texture, shader, and geometry —
only the material uniforms differ. Materials are cached per card id + tint.
- Dispose shared resources on page unmount, or accept a module-level cache for
the session (see Open decisions).