Fra le varie tecniche utili a velocizzare il caricamento delle pagine web, una delle più efficaci è certamente l'uso di CSS Sprites.
Il problema di questo metodo è la difficoltà dell'implementazione: è laborioso creare correttamente gli sprite, è necessario dedicare del tempo per capire quali immagini possono essere incluse e bisogna agire con precisione nell'impostare valori corretti per le proprietà background-position.
Un processo che può essere automatizzato? Sì, con SpriteMe: un semplice bookmarklet realizzato da Steve Souders (Google) che permettere di realizzare sprites su misura per ogni sito in pochi secondi potendo vedere immediatamente il risultato finale e il guadagno in termini di peso e di numero richieste HTTP.
Un paio di click ed ecco il risultato raggiunto applicando SpriteMe a due siti nostrani:
- HTML.it: 38 richieste in meno con questo sprite generato automaticamente.
- Repubblica.it: 21 richieste in meno con questo sprite generato automaticamente.
Risultati notevoli!
Lo strumento è open source; il progetto è disponibile su Google Code.
Per chi fosse interessato ai dettagli è disponibile il video di presentazione creato dall'autore che spiega anche le attuali limitazioni e le prossime funzionalità .
/https://www.html.it/app/uploads/2024/04/css.png)
/https://www.html.it/app/uploads/2024/01/cssday.png)
/https://www.html.it/app/uploads/2023/10/cssday2024.png)
