Quali sono i pro e i contro dello Shadow DOM?
Ovviamente, queste sono opinioni:
Pro: Possibilità di creare componenti che possono essere incorporati in qualsiasi pagina web senza il timore che lo stile del componente (colore di sfondo: rosso) possa essere trasferito nella pagina web circostante o viceversa. Che il tuo componente, realizzato con cura, sembrerà strano sui siti di alcuni utenti perché il loro stile sta deformando l'aspetto del tuo lavoro.
Con: Il più grande che ho incontrato è che la creazione di una pagina web utilizzando i tradizionali framework CSS come Bootstrap, Foundation, Pure, Material Design, ecc. semplicemente non funzionerà se i tuoi componenti stanno usando Shadow DOM perché lo stile non penetrerà nei componenti.
Ho fatto diversi siti dove volevo costruire componenti usando lo stile di Bootstrap o di un altro framework e ho dovuto specificamente: a) evitare di usare Shadow DOM nei miei componenti in modo che ereditassero il framework CSS che volevo usassero, o b) importare gli stessi file CSS del framework in ogni componente. Nessuna delle due cose è fantastica, ma se sei come me e non riesci a progettare la tua via d'uscita da un sacchetto di carta, potresti dover evitare Shadow DOM in questo specifico scenario.