Quais são os prós e contras do DOM Sombra?
Obviamente, estas são opiniões:
Pro: Capacidade de criar componentes que podem ser incorporados em qualquer página web sem medo de que o estilo no componente (cor de fundo: vermelho) possa sangrar para dentro da página web circundante ou vice-versa. Que o seu componente cuidadosamente criado fique estranho nos sites de alguns usuários porque o estilo deles está distorcendo a aparência do seu trabalho.
Con: O maior que eu já encontrei é que criar uma página web usando frameworks CSS tradicionais como Bootstrap, Foundation, Pure, Material Design, etc. simplesmente não vai funcionar se seus componentes estiverem usando Shadow DOM porque o estilo não vai penetrar nos componentes.
Fiz vários sites onde eu queria construir componentes usando o styling do Bootstrap ou outro framework e eu tinha que especificamente: a) evitar usar o Shadow DOM nos meus componentes para que eles herdassem o framework CSS que eu queria que eles usassem, ou b) importar os mesmos arquivos CSS do framework para cada componente. Também não é ótimo, mas se você é como eu e não consegue desenhar sua saída de um saco de papel, você pode ter que evitar o Shadow DOM neste cenário específico.