Workshop › Candy Crush-style Match 3 › Step 28 of 29

Remember the best score

What we are doing

The best score is kept in localStorage, the browser's small notebook that survives closing the page. When the last move has settled and the score beats it, it is saved.

```js
let best = Number(localStorage.getItem('match3-best')) || 0

function afterMoves() {
  if (movesLeft === 0 && score > best) {
    best = score
    localStorage.setItem('match3-best', best)
  }
}

      afterMoves()

  ctx.fillText('Moves ' + movesLeft + '  Best ' + best, canvas.width - LEFT, 30)
```

What it means

• localStorage.getItem(name) reads a saved value as text, or null. Number(...) makes it a number and || 0 uses 0 when there is nothing.
• afterMoves saves a new record once the moves are used up; it runs when a move has completely settled.

Your turn

1. Under let hint write let best = ....
2. Above function update() { write afterMoves.
3. In update, under while (!hasMove()) newBoard(), call afterMoves().
4. In draw, add + ' Best ' + best to the Moves text.

Skills: Game states

← The end of a game Build it yourself: swipe to swap →

All steps

1. A place for the board
2. A checkered grid
3. The game loop
4. A board of random gems
5. Draw the gems
6. Start without matches
7. Click a gem
8. Show the selection
9. Swap two neighbours
10. Find every match
11. No match, no swap
12. A score and a fresh start
13. Clear the match
14. Let the gems fall
15. Two halves of a clear
16. Wait before clearing
17. Flash, and hands off
18. Cascades
19. Where a gem came from
20. Slide down
21. Out from under the top
22. Is there any move?
23. Never stuck
24. A hint after five seconds
25. Show the hint
26. Twenty moves
27. The end of a game
28. Remember the best score
29. Build it yourself: swipe to swap