Memory in Svelte
Trova le coppie di linguaggi e framework. Scritto in Svelte 5 con le rune: il compilatore trasforma il componente in poco JavaScript, senza virtual DOM.
Mosse 0
Coppie 0/8
Record —
Come funziona
- Lo stato è fatto di rune: $state per carte, mosse e coppie aperte, $derived per le coppie trovate e la vittoria.
- Ogni partita estrae 8 coppie a caso da un mazzo di 12, quindi le partite cambiano anche nei soggetti, non solo nell’ordine.
- Le carte coperte non hanno il simbolo nel DOM: il mescolamento può avvenire sul server e nel browser senza differenze all’idratazione, e l’ispettore non aiuta a barare.
- Ogni carta è un pulsante con un’etichetta che dice cosa mostra; una regione live annuncia coppie trovate e vittoria.
- L’animazione di rotazione è CSS 3D e si spegne con prefers-reduced-motion.
- Le icone sono di Devicon (licenza MIT), Node.js di Simple Icons (CC0): nel progetto ci sono solo i 12 tracciati SVG, non il pacchetto intero, colorati nella tinta della coppia.
- Il record (meno mosse) resta nel browser con localStorage.
Codice sorgente: src/pages/lab/memory