2D Arcade space shooter
Classic arcade style space shooter with Canvas 2D, ES6 and HTML 5.
A 'Proof of concept' and technical experiment about game architecture and maths. Over time the code got a bit messy and it's not intended to sustain ;)
- Browser with Canvas 2D API support
- Desktop PC with min. 700px screen width
- Decent computing/ graphics power (can be resource intense)
- Mouse, keyboard, audio output
Find the live version to play here:
- Fully playable game with win/lose conditions
- Automatically shoot at stuff (just avoid being hit)
- Bounce into enemy ships rewards with extra score
- Extra speed boost + Fx
-
Tested with Google Chrome, Desktop only
-
Requires keyboard + Mouse to play
-
Restart requires page reload
-
Playing for longer durations might slow down the game. Projectiles are currently not removed from the scene and will drain performance over time.
- Open the 'index.html' in a browser like Google Chrome on any Desktop browser.
- Read instructions how to play & enjoy!
Fix
- Collision: Vector maths sometimes creates extreme values
Optimize
- Debounce hit testing to prevent fast accumulating scores
- Remove 'dead objects from scene (projectiles) OR implement an 'object pool'
- OOP
- Decouple state, view, controls, score ...
- Decouple constructors from initialization?
Performance
- HUD + Score should be rendered in HTML, not Canvas
- Use faster sin/cos calculations; e.g. lookup tables or polynomial approximation curves
New features
- Player should bounce off the boundaries (or slow down) and not be able to leave the field
- Reacting to score, player could get different weapons or conditional states over time
- Implement 'scene' concept to manage all objects (e.g. pause, show, hide) and switch between multiple scenes