ChessJS - Chess & JavaScript
Chess has been around for nearly 1,400 years, and during that time the game has changed very little. While joked about on some online forums, chess does need a revamp.
ChessJS is a chess website that enables the modification of the rules of chess using JavaScript. Through a simple API, anyone can create so-called 'variants' of chess. Also through the site, anyone can set up a game of chess using any variant.
About the project
While the concept of ChessJS isn't that complicated, the implementation is. In our original design, we planned for up to 8 players to play simultaneously in the same game. This is mirrored in the design of the backend, where a technically unlimited number of players can be associated with a single game instance. However, due to practical reasons, ChessJS limits it to 8.
The task of supporting more than 2 players in a single game is no small feat. Many simplistic ideas that may come to mind when you think of implementing chess are simply not usable. A fantastic example of this is differentiating between players. The typical colour-based system (white and black) is simply impractical when extended. Instead, it makes far more sense to use an array of players, and then refer to them as indexes.
Another defining feature of the ChessJS implementation is the support for any board size and configuration. This is particularly complex in two ways: it is impossible to adapt any front-end chessboard library to support such boards, and the boards need to be represented easily in the backend.
The first problem isn't complex in itself. It's fairly uncomplicated to render a chessboard using CSS and modern web techniques (even with gaps). The real issues, and the reason why you would use a chessboard library, is nice-to-haves, like mobile support and valid move highlighting. The latter is easy to implement, and the former, in my experience, impossible.
The second problem also isn't complex in itself, just like the previous one. Also like the last one, it has unintended and tricky side effects. A major problem was mapping typical chess notation (from a chess library) to the board. For some reason, I couldn't figure out how they translated. Therefore, I hope you don't mind the kings being on the wrong square.
Obviously, there were other problems encountered during the development of ChessJS, but none are so interesting and most, if not all, are results of specific quirks in the codebase.
Future of ChessJS
ChessJS remains in a semi-active state. While it is being actively hosted and maintained, it is not under heavy development as of the time of writing. However, we do have a loose roadmap for the project.
Stage 1
Stage 1 involves the refinement of the current site, by cleaning UI and moving the project to a more sustainable tech stack. For the more technical users, this means moving the front end to Nuxt 3 and reimplementing much of the backend.
Stage 2
Stage 2 involves a vast array of features, including upgrades to the mobile version and more developer-centric tools.
Stage 3
Stage 3 is the businessification stage of the roadmap. With paid tiers and proper infrastructure, ChessJS turns into a proper website instead of a startup.