Make a Browser Game With AI That Loads and Saves Well
A browser game is one anyone can play from a link with nothing to install, so your job is to keep it light and make it behave in a place that was not built for games. Keep the download small, start sound after the first click, and do not trust the browser to keep a save forever.
Why is a web page an odd home for a game?
Because the browser has its own ideas. Take a game for a lunch break, where you sort stamps from a conveyor belt into pigeonholes for ninety seconds. It is small and simple, and it can still trip over four things that have nothing to do with stamps.
Sound may be blocked. MDN's guide says browsers generally block audio that starts before someone has clicked, tapped or pressed a key. So a "Start" button is not decoration. It is what allows your game to make a noise.
Saves can disappear. MDN notes that stored data is usually deleted when a private window closes, that people can clear it in their settings, and that a device short of space may remove data from the sites used least recently. Local storage also has a limit of about 5 MiB. For a short game that hardly matters. For a game someone plays for weeks, add a way to copy the save as a line of text and paste it back in.
Keys belong to the page. Arrow keys and the space bar normally scroll. Without care, your stamp sorter will jump up and down the page while people play.
Windows come in every shape. A game built for your wide screen may be cut off on someone's laptop or phone.
In what order should it come together?
Begin with one page and the core action: stamps move, you sort them, the clock runs. Add the start button next, then make the game fit any window. Add saving, if you need it.
Then, much earlier than feels natural, put it online at a real address. Ask your AI for the simplest way to host a few plain files. A link you can send is the entire point of this genre, and hosting uncovers problems your own computer hides.
After that, open the link in a second browser and on a phone. Only then spend time on polish.
What ruins a browser game?
"It works on my computer." Opening a file from your own disk is not the same as loading it from the web. Some games only appear to work there, and others fail there while working fine online. If you only ever try it locally, your first real player finds the problem for you.
The other killer is weight. Someone clicks your link in a chat, sees a grey bar for half a minute and leaves. A link gets one chance. Ask your AI what the total download is, and treat that number like a budget. Huge music files and giant images are usually the reason.
Paste this to your AI
Build a short browser game as plain web files, with no install and no account. Ask me for my idea in one sentence.
First comes a state machine in a Mermaid diagram of the page's life: loading, waiting for the first click, playing, tab hidden, paused, game over, play again. Note where sound may start, when the game saves, and what a reload does in each state. Build from it.
Sound starts only after my first click or key press. Arrow keys and space must not scroll the page. It must fit any window. If it saves, let me copy the save as text and paste it back.
Tell me the total download size and how you measured it. Tell me which browsers you tried and what you saw. If you only tried one, say so, and say you do not know about the rest.
Or skip this and connect the MCP: your AI then finds all of this by itself.Connect the MCP
How to check it worked
- Open a private window. The game should start cleanly, and any lost save should come as no surprise.
- Press space and the arrows. The page should stay still.
- Listen after the first click. Sound should start then, and not fail silently.
- Hide the tab. The game should pause and wait for you.
- Reload in the middle. You should land somewhere that makes sense.
- Send the link to someone. Ask them to open it on a phone, and tell you how long it took.