This content originally appeared on DEV Community and was authored by airobus
Hey DEV community!
I’ve always been a huge fan of logic puzzles. Recently, I got hooked on the Queens puzzle game but felt the classic rules were a bit too simple. This sparked an idea: what if I could create a more modern, more challenging version?
Today, I’m excited to share the result of that idea: Enhanced Queens Game, a free-to-play web game I built from scratch.
You can play it here: queens game
This post is a quick breakdown of the journey, the tech stack, and one interesting technical challenge I solved.
The Core Idea: Adding a “Third Dimension”
The biggest change from the classic puzzle is the addition of colored regions. On top of having only one queen per row and column, you must also have only one per colored block. This simple twist turns a 2D puzzle into a much deeper 3D spatial reasoning challenge.
![Insert a GIF of the gameplay, showing the colored regions and a queen turning red]
The Tech Stack
I chose a modern stack to build this, focusing on performance and developer experience:
Framework: Next.js (for great SEO and fast performance)
Language: TypeScript (a must for managing complex game logic)
Styling: Tailwind CSS (for building the clean UI quickly)
The Coolest Technical Challenge: Real-time Validation without Lag
A key feature is that a queen turns red instantly if it breaks a rule. On larger 7×7 boards, checking all conflicts (row, column, region, and adjacency) on every single move could potentially lag the main UI thread.
The solution? A Web Worker.
I offloaded the most intensive validation logic to a separate background thread using a Web Worker (solveQueensWorker.ts in the repo). The main thread sends the current board state to the worker, the worker runs the heavy computations, and then sends the results (any conflicts) back.
This ensures the UI remains buttery smooth and responsive, even while complex calculations are happening in the background. It was a perfect use case for a worker and a fun problem to solve.
Feedback Welcome!
This has been an incredibly rewarding personal project. I’d be honored if you’d take a look. I’m open to any and all feedback—whether it’s on the game’s difficulty, the UI/UX, or the code itself.
Thanks for reading!
This content originally appeared on DEV Community and was authored by airobus