Html5 — 01 — Gaming Overview
Hello! I am Samuel Asher Rivello, a professional game developer with over 20 years of game development experience. This series aims to share my learning journey with HTML5 gaming.
HTML5 Benefits
The games industry is incredibly large and rapidly growing, particularly with the advent of smartphones. Gaming has become one of the most popular leisure activities, especially for younger consumers. HTML5 gaming is a unique subgenre within game development, allowing games to be played directly through the browser using technologies like HTML5 for structure, CSS for styling, and JavaScript for logic. We’ll explore key technologies such as WebGL, WebGPU, and various subsystems like canvas, web audio, and local storage.
HTML5 gaming offers several advantages, including no installation requirements, which broadens the market reach. Players can access games directly through their browsers without needing to visit an app store. This reduces costs due to the availability of open-source tools and technologies.
Developers can also ship updates anytime without needing users to visit a store. HTML5 games benefit from accessibility, as they only require a modern browser. The technology allows integration with various other systems, enhancing the gaming experience.
JavaScript vs TypeScript
JavaScript has been the primary language for HTML5 gaming, supported by all web browsers. TypeScript, a newer superset of JavaScript introduced around 2012, offers static type definitions and improved object-oriented programming experiences. The maturity of TypeScript and advancements in WebGPU are enhancing the quality of HTML5 games. We’ll discuss the benefits of using TypeScript for game development and how it enhances the developer’s quality of life.
HTML5 game development involves various game engines and tools. PixiJS and Phaser are two of the most prominent engines, with PixiJS focusing on 2D rendering and Phaser providing a comprehensive game development framework. Other tools like Three.js for 3D graphics and Matter.js for 2D physics are also popular. We’ll compare these tools to Unity and Godot, which, although not HTML5-native, offer export options to the format. The series will explore how to choose the right tools for your HTML5 gaming stack.
HTML5 Gaming
The HTML5 gaming market is a minority compared to other gaming platforms, but it is growing rapidly. With advancements like TypeScript and WebGL, HTML5 gaming has seen significant improvements in recent years. HTML5 games can be played through mobile and desktop browsers, social media platforms, and game portals. Playable ads have become a significant driver of HTML5 technology, offering interactive gaming experiences within advertisements.
Developers often work with a combination of tools and engines to create HTML5 games, choosing the best options for their specific needs. This ecosystem approach differs from more integrated platforms like Unity, where most needs are met within a single tool. We’ll explore how HTML5 gaming fits into the broader gaming industry and its potential for growth.
Resources
🦜 Contact
- Samuel Asher Rivello has over 20 years of game dev XP. He is available for remote, contract hire as a game developer and game dev educator.
- Contact Sam today to say hi and discuss your projects!
📜 Articles
- Html5–01 — Gaming Overview
- Html5–02 — PixiJS For Gaming
- Html5–03 — PixiJS Project Template
- Html5–04 — Unit Testing For PixiJS Games
- Html5–05 — ExcaliburJS Overview
- Html5–06 — ExcaliburJS Critique
- Html5–07 — ExcaliburJS Project Template