Skip to content

Incremental Pixi.js Quality Improvements for Structure Icon Rendering #3207

@Skigim

Description

@Skigim

Purpose

Apply incremental, low-risk quality fixes to the Pixi.js structure icon path to improve correctness, cleanup, and maintainability without changing gameplay behavior or architecture.


Objectives

  • Remove O(n) render lookups by replacing array state with a unit-id keyed map in StructureIconsLayer.ts.
  • Eliminate avoidable allocations (outline filters, dot graphics churn, temporary colorization canvas).
  • Fix known correctness/lifecycle issues:
    • async ghost-state race
    • texture cache GPU leak on invalidation
    • inconsistent child destruction
    • missing renderer/stage disposal path
  • Replace Pixi namespace import style with named imports in:
    • StructureIconsLayer.ts
    • StructureDrawingUtils.ts
  • Consolidate magic numbers into named constants.

Description

Scope is limited to StructureIconsLayer.ts and StructureDrawingUtils.ts, with independent incremental steps:

  1. Array → map for render records keyed by unit id.
  2. Reuse static red/green/white outline filters.
  3. Move or stage async ghost action lookup so render reads synchronous cached state.
  4. Destroy cached textures before map eviction during cache invalidation.
  5. Convert to named Pixi imports.
  6. Standardize container destruction with child cleanup.
  7. Extract zoom/query/filter/size magic numbers into constants.
  8. Ensure dot rendering assets are shared/reused consistently.
  9. Add explicit dispose lifecycle (renderer, stage, cache, canvas) and hook into teardown path if available.
  10. Reuse one offscreen canvas/context in image colorization helper.

Overlap / coordination:

Verification:

  • Run npm test.
  • Manual check: dot/icon/level transitions across zoom, ghost outline correctness.
  • DevTools sanity: lower lingering texture count after invalidation and fewer minor GC spikes.

skigim

Sub-issues

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

Status

Triage

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions