Test our demo games here in the interactive demo.
Add a script to Hydra.js from self-hosting or a CDN:
NPM - Stable builds
npm i @klashdevelopment/hydra
CDN - For browser. Pulls from NPM
https://unpkg.com/@klashdevelopment/hydra
https://cdn.jsdelivr.net/npm/@klashdevelopment/hydra
https://cdn.jsdelivr.net/npm/@klashdevelopment/hydra/src/hydra.js
Github CDN - More automatic builds
https://raw.githack.com/klashdevelopment/Hydra/main/hydra.js
https://rawcdn.githack.com/klashdevelopment/Hydra/main/hydra.js
<script src="hydra.js"></script>
After this, create an instance of hydra, supplying a HTML id to a canvas:
// Uses the element <canvas id="game">
const lib = new HydraCanvasLib('game');
// If you need a different window size:
const lib = new HydraCanvasLib('game', { // All are optional, these are the defaults
canvasWidth: 800,
canvasHeight: 600,
enableExperimentalDPR: true // Higher quality rendering
});
Setup all sprites and prerequisites, then start the game loop with FPS:
// Uses 60fps
lib.loop(60);