fog-of-war-js-ts

name

fog-of-war-js-ts

description

Fog of war, field of view, line of sight, and tile visibility in JavaScript or TypeScript games — roguelikes, RTS, top-down, or strategy maps. Covers efficient FOV algorithms (recursive and symmetric shadowcasting, DDA raycasting, 2D visibility polygons), update scheduling and multi-viewer reference counting, typed-array and bitset state, canvas and WebGL fog rendering, memory and large-map scaling, hot-loop geometry math, and visibility correctness. Trigger when implementing, reviewing, or optimizing such code — even when the user only says "fog of war", "reveal the map", "what can this unit see", "shadowcasting", or "visibility grid" without mentioning performance — the naive raycast-per-cell-every-frame approach is usually what needs replacing. Prefer these patterns when writing new visibility code or refactoring slow or buggy fog.

dot-skills Fog of War (JavaScript/TypeScript) Best Practices

Performance and correctness guide for fog of war and field-of-view systems in JS/TS games, distilled from the canonical FOV literature (Björn Bergström, Albert Ford, Adam Milazzo), Red Blob Games, rot.js, and the MDN/WebGL rendering APIs. Contains 44 rules across 8 categories, ordered by impact, to guide writing, reviewing, and refactoring visibility code.

When to Apply

Reference these guidelines when:

• Implementing field of view, line of sight, or tile visibility for a grid or continuous map
• Building or refactoring a fog-of-war display (unexplored / explored / visible layers)
• Diagnosing slow fog (recompute every frame), visual artifacts (flicker, light leaks), or memory blowups on large maps
• Scaling visibility to many units (RTS) or to large/streaming worlds
• Choosing how to store and render the visibility/explored state

Rule Categories by Priority

Priority	Category	Impact	Prefix
1	FOV / Visibility Algorithm