DEV Community

Cover image for WordHoop: A Lightweight Word Game Built with SolidJS
arminbro
arminbro

Posted on

WordHoop: A Lightweight Word Game Built with SolidJS

As developers, we’re always looking for ways to optimize our code, reduce bloat, and deliver the best experience possible for users. That’s exactly what I set out to do when I created WordHoop, a daily word game packed with fun yet incredibly lightweight.

The Frontend Stack

  • SolidJS: A reactive framework offering fine-grained reactivity with a smaller bundle size than React, making it ideal for performance-focused web apps.
  • Solid Transition Group: To help apply animations when children elements enter or leave the DOM throughout the game.
  • Tailwind CSS: A utility-first CSS framework that allowed me to efficiently build a clean and responsive UI without adding unnecessary weight, keeping the styles both minimal and scalable.

Keeping it Small and Fast

One of the things I’m most proud of is that WordHoop is under 100KB on the initial page load! This helps achieve perfect 100% PageSpeed scores across the board.

PageSpeed Screenshot

Try it Out!

WordHoop is simple to play but offers a daily word unscrambling challenge that keeps players returning. It’s a great way to take a quick break while exercising your brain.

I’d love to hear your thoughts on the game or any tips you might have for further optimization. You can play it here: https://www.wordhoop.com.

Follow me:

Top comments (1)

Collapse
 
arminbro profile image
arminbro

WordHoop #292
filter -> savor
Solved in 1 minute and 15 seconds with ♥♥ remaining!