Le Web Components sono un ottimo modo per definire blocchi di codice che possono essere inseriti nelle Web Application così come sono e riutilizzati ovunque. Framework come React, Vue e Angular seguono l’approccio delle Web Components e questo è probabilmente il motivo del loro successo internazionale.
Oramai le Web Components sono supportate nativamente in tutti i browser moderni e siti come Youtube ne fanno un largo uso. Comunque è possibile, attraverso tecnologie di Polyfill, seguire il Progressive Enhancement della User Experience, vale a dire offrire al proprio utente funzionalità in base a quelle che possono essere utilizzate dal suo browser.
Scopriamo ora 8 framework e tools che possono essere d’aiuto nello sviluppo ed utilizzo di Web Component.
- LitElement: fornisce metodi e class ( helper) per creare web components senza alcun setup, sta crescendo in popolarità grazie alla stabilità del codice
- Stencil: un tool di compilazione creato dal team di Ionic. Analizza ogni componente, la ottimizza nel miglior modo possibile e rende disponibile una versione che può essere utilizzata in maniera cross-platform. Inoltre include JSX e data binding per es. per progetti React.
- Vue Web Component Wrapper: Vue può lavorare con le Web Component senza alcun problema ma se vogliamo utilizzare le component Vue in un altro progetto potrebbe essere difficoltoso. Attraverso questa libreria è possibile ottenere la portabilità della component Vue.
- Angular Elements: Simile alla precedente libreria, Angular Elements permette di creare Web Component grazie ad Angular attraverso la funzione createCustomElements che fa il binding tra le API usate con la sintassi Angular.
- Skate: sono una serie di pacchetti che permettono di creare web components come astrazioni di altre librerie come React, Preact e LitHTML
- Svelte: compila le components in classico codice Javascript senza alcuna runtime come gli altri framework. Possono essere definiti tag e Svelte applicherà le funzionalità per te.
- X-Tag: rende disponibile le web components soprattuto per vecchie versioni di browser o in caso di multi framework application
- Slim: permette di creare web components con soli 3.4Kb di libreria
Glue Labs e le Web Components
Ti forniamo sviluppo di Web Application e Progressive Web App(PWA), assistenza e supporto per qualsiasi progetto ed inoltre realizziamo corsi custom per la tua impresa grazie al servizio di formazione avanzata. Contattaci subito e senza impegno per un preventivo gratuito.