I've always felt that the Canvas API is one of the most underrated built-in tools in the JavaScript ecosystem, it is literally the unsung hero of GSAP and every worthwhile animation lib. Most modern web games reach for heavy engines like Phaser or PixiJs so I wanted to see how far I could push a project using just the native 2D context.
Therefore, I created this 3d/isometric game to sort of push the limits of what you can accomplish w/ raw Canvas API. If the folks at claude code can use React for monospace terminal results, I sure can for a silly browser tower defense game lol.
Why focus on something so "outdated" or old? imo, in an era of giga node_modules folders, I just find something incredibly satisfying about working directly with the browser’s drawing surface. Using the Canvas API allowed for ZERO dependencies; the rendering engine is entirely native, so you have no external library bloat, just requestAnimationFrame and ctx calls.
I was also able to granularly improve performance (in most aspects): the game loop and render pipeline are manually handled (this is where the react part of the equation comes in), so it’s easier to optimize sprite batches and particle effects without the overhead of a generic engine. however there are still interesting cases handling hundreds of projectiles and enemy entities simultaneously while maintaining a smooth 60fps. this can be more optimal!
I had total granular control of the creation process; literally every pixel, animation frame, and collision check is written from scratch. So are the towers, enemies, and heroes. I implemented my own coordinate systems and pathfinding logic rather than relying on a black box.
Admittedly, there is nothing insanely revolutionary or groundbreaking here. This is a passion project by a dev who does not typically make games, just frontends. Just a little food for thought for the idea that less, may be more.
Therefore, I created this 3d/isometric game to sort of push the limits of what you can accomplish w/ raw Canvas API. If the folks at claude code can use React for monospace terminal results, I sure can for a silly browser tower defense game lol.
Why focus on something so "outdated" or old? imo, in an era of giga node_modules folders, I just find something incredibly satisfying about working directly with the browser’s drawing surface. Using the Canvas API allowed for ZERO dependencies; the rendering engine is entirely native, so you have no external library bloat, just requestAnimationFrame and ctx calls.
I was also able to granularly improve performance (in most aspects): the game loop and render pipeline are manually handled (this is where the react part of the equation comes in), so it’s easier to optimize sprite batches and particle effects without the overhead of a generic engine. however there are still interesting cases handling hundreds of projectiles and enemy entities simultaneously while maintaining a smooth 60fps. this can be more optimal!
I had total granular control of the creation process; literally every pixel, animation frame, and collision check is written from scratch. So are the towers, enemies, and heroes. I implemented my own coordinate systems and pathfinding logic rather than relying on a black box.
Admittedly, there is nothing insanely revolutionary or groundbreaking here. This is a passion project by a dev who does not typically make games, just frontends. Just a little food for thought for the idea that less, may be more.