Hi to all!
This was the easiest step, I've installed webpack and created a webpack.config file to compile ts files into js and to copy static files under the build/ folder.
I've tried to replace the emoji with a background-image property for enemies and player.
Really bad! My FPS drops down to 1/5 maximum FPS instead of 55/60 FPS!
So I've moved to html canvas!
This step was one of the harders, I've recreated the entire sprite and game management using Transforms and generic classes, to handle my sprites position and scaling by an easy way.
So I've created a GameObject generic class, and it's factory to handle sprite creations and rendering.
Not bad at all, but still glitchy because I was using the 2d canvas rendering context, which is less performant than the WebGL content.
The final solution was to use WebGL, and to use it easily I've included ThreeJS into my project. Just a few reworks and the game works really good!
Amazing! The game is running at 60 FPS!
Here there is the result video!
I've created a simple HTML Game Engine! Using the Unity C# lifecycle methods and other Game Development behaviours, and I want to improve it in my free time.
If anyone wants to collaborate the repo is free to use here.
I'll publish a playable demo when I've done the game ^^