Google翻訳がReact（およびその他のウェブアプリ）をクラッシュさせる：DOMの対決

Google Chromeに組み込まれているGoogle翻訳拡張機能は、DOMを操作することで、多くの最新のウェブアプリ、特にReactを使用しているアプリをクラッシュさせることがあります。この記事では、Google翻訳の動作メカニズム、TextNodeをFontElementに置き換えることでReactの仮想DOMを破壊し、クラッシュやデータの不整合を引き起こす仕組みを詳しく解説しています。`NotFoundError`や`insertBefore`の失敗など、一般的なエラーや、モンキーパッチやTextNodeを``で囲むなどの回避策についても分析していますが、これらの解決策には限界があります。最終的に、この記事では、アプリの安定性とユーザーエクスペリエンスを確保するために、Google翻訳を無効にするか、独自のローカライゼーションを実装することを検討すべきだと提案しています。