I componenti sono gli elementi di base delle moderne applicazioni web. Quali best practice dovresti seguire per realizzare i tuoi componenti in modo che possano superare la prova del tempo?
I componenti sono gli elementi di base delle moderne applicazioni web. Quali best practice dovresti seguire per creare i tuoi componenti in modo che possano superare la prova del tempo?
Elementi personalizzati
Gli elementi personalizzati offrono agli sviluppatori la possibilità di estendere il codice HTML e di creare i propri tag. Poiché gli elementi personalizzati sono basati su standard, traggono vantaggio dal modello di componenti integrato del Web. Il risultato è un codice più modulare che può essere riutilizzato in molti contesti diversi.
Scopri di più
DOM shadow
Shadow DOM è uno standard web che offre l'incapsulamento del markup e dello stile dei componenti. Si tratta di un aspetto fondamentale della storia dei componenti web, in quanto garantisce il funzionamento di un componente in qualsiasi ambiente, anche se nella pagina sono in gioco altri CSS o JavaScript.
Scopri di più
Best practice
Poiché gli elementi personalizzati e lo shadow DOM sono primitive di basso livello, non è sempre chiaro il modo migliore per combinarli per creare un componente solido che funzioni bene in molti ambienti diversi. Con queste API è possibile fare praticamente qualsiasi cosa, ma di seguito sono riportate alcune best practice per garantire che i componenti funzionino bene ovunque.
Scopri di più
Esempi
I componenti HowTo sono un insieme di elementi che dimostrano le best practice per gli elementi personalizzati e per il DOM Shadow. Questi elementi non sono pensati per essere utilizzati in produzione, ma sono presentati come ausilio didattico per mappare i suggerimenti delle best practice alle implementazioni effettive.
Scopri di più
[[["Facile da capire","easyToUnderstand","thumb-up"],["Il problema è stato risolto","solvedMyProblem","thumb-up"],["Altra","otherUp","thumb-up"]],[["Mancano le informazioni di cui ho bisogno","missingTheInformationINeed","thumb-down"],["Troppo complicato/troppi passaggi","tooComplicatedTooManySteps","thumb-down"],["Obsoleti","outOfDate","thumb-down"],["Problema di traduzione","translationIssue","thumb-down"],["Problema relativo a esempi/codice","samplesCodeIssue","thumb-down"],["Altra","otherDown","thumb-down"]],["Ultimo aggiornamento 2017-08-14 UTC."],[],[]]