No React 19, o manuseio de etiquetas inesperadas durante a hidratação foi significativamente melhorado, particularmente na maneira como interage com scripts de terceiros e extensões de navegador. Aqui estão exemplos específicos de como o React 19 pula sobre tags inesperadas:
pulando tags inesperadas
1. Os elementos da cabeça e do corpo: quando o React encontra tags inesperadas nas seções `
` e `` do documento durante a hidratação, ele pula de forma inteligente essas tags em vez de desencadear um erro de incompatibilidade de hidratação. Isso significa que, se um script de terceiros inserir elementos que não correspondem ao HTML renderizado ao servidor, o React não tentará conciliar essas diferenças, evitando assim erros e interrupções potenciais no processo de renderização do aplicativo [1] [2] [4].2. Preservar as folhas de estilo: se o React precisar renderizar todo o documento devido a uma incompatibilidade de hidratação que não está relacionada a modificações de terceiros, ele deixará em lugares quaisquer folhas de estilo que foram inseridas por esses scripts. Isso garante que a integridade visual do aplicativo permaneça intacta mesmo quando as discrepâncias são detectadas [2] [4].
3. Manipulação de modificações de terceiros: anteriormente, quaisquer modificações feitas por scripts de terceiros poderiam levar a erros de hidratação, pois o React tentaria reconciliar o HTML renderizado do servidor com o HTML do lado do cliente modificado. No React 19, essas modificações são ignoradas durante a hidratação, permitindo que a aplicação continue funcionando sem problemas, sem ser afetada por alterações externas [1] [4].
cenário de exemplo
Considere um cenário em que um script de terceiros adiciona uma tag `