<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Mahesh</title>
    <description>The latest articles on DEV Community by Mahesh (@mahesh_b6e3c28712732016c1).</description>
    <link>https://dev.to/mahesh_b6e3c28712732016c1</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3979422%2F7a2f5743-56ed-483f-a4c3-842159700d66.png</url>
      <title>DEV Community: Mahesh</title>
      <link>https://dev.to/mahesh_b6e3c28712732016c1</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/mahesh_b6e3c28712732016c1"/>
    <language>en</language>
    <item>
      <title>I Built 40+ Free Browser Games in Vanilla JS — Here's What I Learned</title>
      <dc:creator>Mahesh</dc:creator>
      <pubDate>Thu, 11 Jun 2026 11:26:07 +0000</pubDate>
      <link>https://dev.to/mahesh_b6e3c28712732016c1/i-built-40-free-browser-games-in-vanilla-js-heres-what-i-learned-4bek</link>
      <guid>https://dev.to/mahesh_b6e3c28712732016c1/i-built-40-free-browser-games-in-vanilla-js-heres-what-i-learned-4bek</guid>
      <description>&lt;h1&gt;
  
  
  I Built 40+ Browser Games in Vanilla JavaScript — Here's What I Learned
&lt;/h1&gt;

&lt;p&gt;Over the past few months, I built &lt;strong&gt;GamelyByte&lt;/strong&gt; — a collection of 40+ original browser games, all hand-coded in vanilla JavaScript with no game engine.&lt;/p&gt;

&lt;p&gt;You can play them here: &lt;strong&gt;&lt;a href="https://gamelybyte.com" rel="noopener noreferrer"&gt;GamelyByte.com&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The collection includes:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Chess with a real AI opponent&lt;/li&gt;
&lt;li&gt;8-Ball Pool with realistic physics&lt;/li&gt;
&lt;li&gt;A PUBG-style Battle Royale&lt;/li&gt;
&lt;li&gt;A Vampire Survivors-inspired roguelite&lt;/li&gt;
&lt;li&gt;A 3D driving game&lt;/li&gt;
&lt;li&gt;Puzzle, strategy, arcade, and action games&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Every game runs directly in the browser on both mobile and desktop. No downloads, no installs, and no account required.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why I Chose Vanilla JavaScript Instead of Unity
&lt;/h2&gt;

&lt;p&gt;Most people building browser games reach for Unity, Godot, or another engine. I decided to build everything from scratch for three reasons:&lt;/p&gt;

&lt;h3&gt;
  
  
  1. Faster Load Times
&lt;/h3&gt;

&lt;p&gt;A typical Unity WebGL build can be anywhere from 5–20 MB or more.&lt;/p&gt;

&lt;p&gt;My largest game is under 50 KB.&lt;/p&gt;

&lt;p&gt;On slower mobile connections and budget Android devices, that difference is massive. Players can start instantly instead of waiting through a loading screen.&lt;/p&gt;

&lt;h3&gt;
  
  
  2. Instant Gameplay
&lt;/h3&gt;

&lt;p&gt;I wanted games to feel like opening a webpage, not launching an application.&lt;/p&gt;

&lt;p&gt;Click. Play.&lt;/p&gt;

&lt;p&gt;No installation. No account creation. No waiting.&lt;/p&gt;

&lt;h3&gt;
  
  
  3. Complete Control
&lt;/h3&gt;

&lt;p&gt;Writing your own systems forces you to understand every detail.&lt;/p&gt;

&lt;p&gt;When something behaves incorrectly, there's no engine black box to debug. You know exactly how the physics, collision detection, rendering, and input systems work because you built them yourself.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Hardest Game to Build: 8-Ball Pool
&lt;/h2&gt;

&lt;p&gt;Pool physics turned out to be much harder than expected.&lt;/p&gt;

&lt;p&gt;The biggest issue was &lt;strong&gt;tunneling&lt;/strong&gt;. Fast-moving balls would occasionally pass through each other because collisions were only being checked once per frame.&lt;/p&gt;

&lt;p&gt;The solution was &lt;strong&gt;sub-stepped collision detection&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Instead of running physics once per frame, I split each frame into multiple smaller physics updates.&lt;/p&gt;

&lt;p&gt;That simple change completely eliminated tunneling and ended up improving several other games as well, including my bowling game and physics-based merge game.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Mobile Input Bug That Took Me Three Games to Figure Out
&lt;/h2&gt;

&lt;p&gt;One frustrating issue kept appearing on mobile devices.&lt;/p&gt;

&lt;p&gt;Players would drag the virtual joystick left, but the character would continue moving in the previous direction.&lt;/p&gt;

&lt;p&gt;The problem wasn't the joystick logic—it was where the events were attached.&lt;/p&gt;

&lt;p&gt;I originally listened for movement events only on the joystick element itself. As soon as a player's finger slid outside the element, movement updates stopped.&lt;/p&gt;

&lt;p&gt;The fix was attaching move and release events to the document instead.&lt;/p&gt;

&lt;p&gt;After making that change, controls became dramatically more reliable across every mobile game on the site.&lt;/p&gt;

&lt;h2&gt;
  
  
  Keeping Physics Stable on Mobile Devices
&lt;/h2&gt;

&lt;p&gt;Mobile browsers drop frames far more often than desktop browsers.&lt;/p&gt;

&lt;p&gt;If physics calculations are tied directly to rendering frames, frame drops can cause objects to clip through walls, floors, or other objects.&lt;/p&gt;

&lt;p&gt;To solve this, I switched to a &lt;strong&gt;fixed-timestep physics loop&lt;/strong&gt; using an accumulator.&lt;/p&gt;

&lt;p&gt;This keeps simulation updates running at a consistent rate regardless of rendering performance and prevents major physics glitches when frame rates fluctuate.&lt;/p&gt;

&lt;p&gt;I also clamp large frame gaps to avoid the infamous "spiral of death" that can occur when a browser tab is backgrounded and then reopened.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Biggest Lesson
&lt;/h2&gt;

&lt;p&gt;The biggest lesson wasn't technical.&lt;/p&gt;

&lt;p&gt;It was that small details matter more than big features.&lt;/p&gt;

&lt;p&gt;Players rarely notice a sophisticated collision system.&lt;/p&gt;

&lt;p&gt;They absolutely notice laggy controls, long loading screens, or physics that feel inconsistent.&lt;/p&gt;

&lt;p&gt;A polished 30-second gameplay experience is often more important than adding another feature.&lt;/p&gt;

&lt;h2&gt;
  
  
  What's Next
&lt;/h2&gt;

&lt;p&gt;I'm continuing to add new games every week and experimenting with more advanced AI, multiplayer concepts, and larger browser-based experiences.&lt;/p&gt;

&lt;p&gt;Everything remains completely free to play.&lt;/p&gt;

&lt;p&gt;If you're curious about browser game development, JavaScript game physics, performance optimization, or building games without an engine, I'd be happy to answer questions.&lt;/p&gt;

&lt;p&gt;🎮 Play all 40+ games at &lt;strong&gt;&lt;a href="https://gamelybyte.com" rel="noopener noreferrer"&gt;GamelyByte.com&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>gamedev</category>
      <category>javascript</category>
      <category>webdev</category>
      <category>games</category>
    </item>
  </channel>
</rss>
