13 kilobyte: quanto deve pesare davvero un tema WordPress

Davanti alle promesse sui tempi di caricamento conviene chiedersi che cosa sia stato misurato esattamente. «Meno di un secondo» dipende dal server e dal luogo della misurazione. Un punteggio Lighthouse dipende dal contenuto della pagina di test. Quello che invece appartiene stabilmente al tema e non si può mettere in discussione è la quantità di CSS e JavaScript che mette su ogni pagina. Ed è proprio questa che abbiamo misurato.

I numeri

Misurato il 6 settembre 2026 nel pacchetto pubblicato di Hafen 1.0.0, cioè nella versione presente nella directory ufficiale dei temi dal 4 al 22 settembre. Al browser servono esattamente due file per la visualizzazione, entrambi dal tuo server:

In rete passano quindi 9.533 byte in due richieste. gzip è qui il numero prudente, perché lo offre qualsiasi hosting; il valore Brotli accanto è misurato al livello di compressione massimo, e i server che comprimono al volo nella pratica restano un po’ sopra. Perché tu arrivi agli stessi numeri: misurato sul pacchetto hafen-1.0.0.zip con node:zlib, gzip al livello standard 6, Brotli al livello 11. Altri strumenti si discostano di qualche byte; sullo stesso file abbiamo misurato da 9.522 a 9.555 byte a seconda del programma. Sulla sostanza non cambia nulla, su un confronto di numeri sì, ed è per questo che qui lo strumento è indicato. Un terzo file volutamente non compare in tabella: da theme.json WordPress genera gli stili globali e li scrive nell’intestazione della pagina. Finiscono così nel peso trasferito del documento HTML e non costano una richiesta a sé.

Che cosa si è aggiunto dalla 0.8.1

Fino alla 1.0.0 poco più di due kilobyte in più in rete, con la 1.1.0 quasi altri tre e mezzo: chi ha in mente il vecchio numero può chiedersi per che cosa. La stessa misurazione lungo la serie di versioni, sempre style.css e hafen.js insieme, dai pacchetti pubblicati:

Fino alla 1.0.0 il salto più grande c’è stato tra la 0.8.0 e la 0.9.1, e lì non c’è un nuovo pacchetto di funzioni, ma il ritorno di una vera migrazione: una griglia da magazine per l’elenco del blog, un ripiego curato per gli articoli senza immagine, aree comode da toccare nella paginazione. Il passaggio da cinque a 37 look è costato invece solo 1.218 byte di CSS, perché un look è un file JSON e non una riga di foglio di stile in più.

E un numero per molto tempo non si è mosso affatto: hafen.js è rimasto invariato a 1.948 byte dalla 0.8.0 alla 1.0.0, in tutti i look e in tutte le release. Non è un caso, ma il limite che ci siamo dati. Quello che sa fare il CSS non riceve JavaScript. Con la 1.1.0 il file è cresciuto per la prima volta, a 3.344 byte: l’intestazione ora segue lo scorrimento, e lo script ne misura l’altezza perché un salto a un titolo non finisca nascosto sotto di essa. Questo il CSS da solo non lo sa fare.

Il font è l’eccezione, non la regola

Il look predefinito, cioè l’impostazione di theme.json, porta con sé Inter come un unico file di font variabile, 48.256 byte per tutti i pesi da 100 a 900. Con Hafen 1.1.0 la quota complessiva del tema su una pagina arriva in questo solo caso a 61.243 byte. È l’importo completo, dall’esterno non si aggiunge nulla: niente Google Fonts, niente font di icone, niente CDN.

Appena scegli uno dei 38 look nell’editor del sito sotto Stili, il file del font sparisce. Ognuna delle 38 varianti sostituisce Inter predefinito con uno stack di font di sistema, senza un fontFace proprio, e il tema se ne accorge da solo: in quel caso l’indicazione di precaricamento nell’intestazione della pagina si disattiva, invece di richiedere 48 kilobyte per un font che non viene usato da nessuna parte. Con Hafen 1.1.0 restano i 12.987 byte di CSS e JavaScript. Quali sono questi 38 look e come si distinguono per colore, tipografia, forma e densità lo trovi in Hafen 1.0: un tema, 38 look, zero file di font.

Se vuoi tenere i colori predefiniti e liberarti solo del font, prendi la variante Launch. Non cambia nulla se non la tipografia: Segoe UI su Windows, San Francisco sui dispositivi Apple, Roboto su Android. Gli altri 37 look portano in più una propria tavolozza di colori e propri raggi degli angoli, ma nemmeno loro caricano un file di font.

Da dove arriva di solito il peso

Per confronto conviene guardare che cosa si porta dietro un tema qualunque senza che nessuno abbia sbagliato nulla. Un tema da page builder carica il proprio framework, più un set di icone, spesso jQuery e una libreria per slider, di solito su ogni pagina, che la pagina contenga uno slider o no. La parte costosa non è nemmeno la dimensione, ma il tempo che il browser passa a eseguire tutto questo.

Un numero misurato su questo lo abbiamo, anche se non di un page builder ma di Neve, un tema considerato a ragione uno dei classici più veloci. Nel trasloco su Hafen di un sito in produzione cresciuto negli anni, stesso giorno, stesso metodo, plugin invariati, il JavaScript della home page da mobile è sceso da 621 a 382 kilobyte e il First Contentful Paint da 3,9 a 1,3 secondi. La differenza di 239 kilobyte viene dal solo livello del tema, i plugin non sono stati toccati. La serie completa di misurazioni su quattro tipi di pagina è nel nostro caso studio sul cambio di tema. Per un tema da page builder non abbiamo una serie di misurazioni nostra, per questo qui non c’è nemmeno un numero.

Hafen arriva da un’altra direzione. Layout, colori, spaziature e tipografia stanno interamente in theme.json, e WordPress ne genera da sé il CSS necessario. Non c’è un framework, perché non ne esiste uno che l’editor a blocchi non porti già con sé. E non c’è JavaScript per cose che sa fare il CSS; i 3.344 byte nel pacchetto di Hafen 1.1.0 gestiscono l’intestazione fissa, compresa la misura della sua altezza per i link ad ancora, e la dissolvenza morbida durante lo scorrimento, niente di più. In più, due filtri del tema fanno sì che WordPress carichi solo il CSS dei blocchi che compaiono davvero nella pagina, invece dell’intera libreria dei blocchi.

Tutto ciò che non è presentazione sta volutamente fuori dal tema, nel plugin di accompagnamento Hafen Core: dati strutturati, llms.txt, blocchi di risposta. Non è un capriccio, ma una regola della directory, perché le funzioni devono sopravvivere a un cambio di tema. Tutto sul tema, sui suoi look e sul plugin di accompagnamento è nella pagina di Hafen.

E ora la parte onesta

Un tema leggero non rende veloce un sito lento. Elimina solo una tra diverse cause, e di solito non la più grande.

Nella pratica dominano altre tre voci. Le immagini, quando vengono caricate alla piena risoluzione della fotocamera e rimpicciolite via CSS; una sola immagine così pesa più dell’intero tema. I plugin che caricano i loro script su ogni pagina invece che solo dove servono. E l’hosting, perché nessuna ottimizzazione nel frontend aiuta contro una risposta del server che si fa attendere un secondo.

Chi vuole rendere più veloce un sito esistente, quindi, non comincia dal tema; queste tre voci contano qualunque tema sia installato. Questo articolo risponde all’altra domanda: che cosa apporta un tema quando si parte da zero o lo si cambia.

Domande frequenti