- Spegnimento
- 19 agosto 2026 alle ore 20:58 UTC
- Autore
- Kamo
- Impegno
- 6d01ff1
Passo C. Né GSAP né Framer Motion è sulla homepage più, e `home` namespace messaggio non è più inviato al browser affatto. JS 241,999 -> 214,135 gzip (15 pezzi -> 13) documento 53.877 -> 51.797 gzip GSAP era tornato, e vale la pena nominare proprio perché nulla di esso era visibile: 70.712 byte, tirato in quattro wrapper decorativi nidificato all'interno delle sezioni Step B aveva appena fatto componenti del server. Due di loro non avevano bisogno di una biblioteca tutti — HoverTransform scala tweened/rotate/y/boxShadow su mouseenter, che è un `: regola dell'hover, e la chiamata GSAP di GradientBorder era un *no-op*: animata `backgroundPosition` sull'elemento piatto `#0a0a0a` che maschera il centro della confine, mentre il gradiente chiunque può vedere siede su un div diverso e non è mai stato toccata. La sua linea di capelli di viaggio è implementata qui per la prima volta. Le altre due coordinate del puntatore di lettura, in modo che non possano realmente diventare CSS — ma anche non possono fare nulla senza un puntatore, e un telefono stava scaricando 27 KB per eseguire un'inclinazione nessun touchscreen può attivare. Entrambi ora controllano `(hover: hover) e (pointer: fine)` e `import()` GSAP all'interno dell'effetto, quindi è un pezzo pigro su un desktop e assente ovunque altro. L'effetto desktop è invariato. L'Eroe. 657 linee in cui nove pezzi di stato, quattro effetti e tre ref seduto nello stesso componente delle parole, così React ha idratato la titolo, la lede, la regola delle statistiche e le chiamate all'azione insieme al lettore video. The stato spostato ai due posti che la possiedono — HeroBackdrop per la fotografia e la sua rotazione, HeroStage per la bobina e il suo gating download — e l'eroe è un componente server. Entrambe le isole ancora server-render loro markup, quindi l'elemento LCP è nel HTML esattamente come prima e ancora vernici da HTML e CSS da solo. Non è cambiato nulla sulla prima vernice; ciò che è cambiato è ciò che deve essere idratato dopo. L'immagine di sfondo ha anche perso il suo tradotto "Background N" alt a favore di "alt=" aria-hidden`. È uno sfondo decorativo — che la stringa ha descritto markup piuttosto che qualsiasi cosa che un lettore ha bisogno, ed è stata l'ultima cosa che rende elemento una preoccupazione di traduzione. La NAMESPACE. `home` è 341 chiavi e 22 KB, ed è stato serializzato in documento per ogni visitatore perché una manciata di componenti del cliente lo legga. FAQ e SignupSection sono componenti del server ora con le loro parti interattive divise out — un elemento di fisarmonica e un singolo campo di e-mail, nessuno dei quali ha bisogno di una parola di copia — e ShippedStrip, HeroStage e HeroOfferBanner prendere le loro poche etichette come puntelli. Con nulla lasciato sul cliente leggerlo, il fornitore è andato da il percorso interamente e le stringhe vengono risolte una volta, nel render che produce l'HTML. Salva meno di quanto suggerisce la figura grezza (~2 KB gzip): le stesse stringhe sono in l'HTML accanto a esso, così la copia compressa bene. È ancora la forma giusta — nulla dovrebbe essere l'invio dell'intero dizionario di una pagina a un browser che ha già stato inviato la pagina. Ogni evento di analisi spara ancora: sette nomi, tutti verificati nel markup costruito, con l'eroe due ora `data-track` accanto al resto.