CSSX agisce in sostanza come una sorta di transcompiler per la compilazione da sorgente a sorgente, l'interfaccia lato client si occuperà quindi di elaborare il codice scritto in un linguaggio con lo scopo di restituire in output dei costrutti sintatticamente validi in un altro linguaggio. Il suo funzionamento è per molti versi simile ad altre soluzioni basate sull'incapsulamento come JSX, l'estensione JavaScript nata in seno al progetto React e concepita per il rendering dei tag HTML.

La libreria cerca di venire incontro alle esigenze di chi concentra la maggior parte del proprio lavoro sul browser Web considerato il basso livello di scalabilità dell'inline styling; nel caso in cui si fosse scelta una strada basata sulla presenza di CSS in JavaScript, vi sarebbero stati dei limiti per quanto riguarda la possibilità di controllare le regole di stile (nuovi inserimenti, aggiornamenti, rimozioni..) riproponendo di fatto la necessità di un foglio di stile esterno.

Ecco perché invece di basarsi su una soluzione che agisce sulla proprietà style del DOM si è preferito implementare delle injection a runtime attraverso un libreria client side che consentisse di stilizzare tramite JavaScript qualsiasi elemento fosse stato generato da quest'ultimo. Questo approccio aiuterebbe a risolvere anche un altro problema, quello relativo al FOUT (Flash of unstyled text) che è l'effetto che si verifica nell'inline styling quando gli stili devono essere ancora caricati.

Il FOUT ha in genere una durata breve, comunque variabile a seconda del peso dei fattori che influenzano la velocità di navigazione, risolvendosi in un peggioramento più o meno sensibile dell'esperienza utente dovuto alla mancata stilizzazione degli elementi di pagina; con la transcompilazione l'applicazione istantanea degli stili riuscirebbe a superare anche questo limite.

Via CSSX

1 CommentoDi' la tua

Il tuo indirizzo email non sarà mostrato pubblicamente. I campi obbligatori sono contrassegnati da *

Non nascondo che si tratta di una soluzione molto interessante, ma è un'ulteriore forzatura per un problema che andrebbe risolto con nuovi standard legati al CSS.

Francesco
Francesco