Memory game vs tic-tac-toe: compare the source templates

These two templates both use HTML buttons and update after player input. Pixel Pairs adds hidden information and a short delayed action. Three in a Row adds alternating players and several possible end states. Pick the one whose state-management problem you want to learn.

Pixel Pairs and Three in a Row template features
FeaturePixel PairsThree in a Row
RenderingHTML buttonsHTML buttons
Update timingInput-driven, with an 800 ms mismatch delayOne update after each valid move
PlayersOne playerTwo players on one device
State to understandSixteen tiles, the first selection, a lock flag, moves, and matched countNine cells, current player, move count, and eight winning lines
Round endsMatch all eight pairs to complete the boardThree matching marks in a line wins; a full board without a line is a draw
First changeReplace the eight symbols, or change the mismatch delay while preserving the input lock.Add a round counter or highlight the winning line before considering a computer opponent.

Choose Pixel Pairs for asynchronous state

A mismatch remains visible for 800 milliseconds. During that time, the board must reject a third selection. Restart must cancel the pending delay so a callback from an old round cannot change the new board. This is a small, practical example of coordinating input with a timer.

Choose Three in a Row for turn logic

The tic-tac-toe board keeps nine cell values and a current player. Each valid move is checked against eight winning combinations, followed by the draw check. There is no hidden board or matching timer. Two people play locally; the starter does not include an AI opponent or network service.

How to extend either board

For Pixel Pairs, replace the symbols while keeping exactly two copies of each. For Three in a Row, highlight a winning line or add a round score. Both projects benefit from testing keyboard focus after a board redraw. If you add a reset button, make its behavior consistent during an active turn as well as after a win.

What both downloads include

Each ZIP contains index.html, a README, and the MIT license. Both run without package dependencies and store no online player score. Read the license before redistributing the source.

Read the related collection or guide · All template comparisons