Google 翻译与 React 应用的冲突：一场 DOM 之战
2025-02-14
Google Chrome 内置的 Google 翻译扩展程序会修改网页的 DOM 结构，导致许多现代 Web 应用，尤其是使用 React 的应用出现问题。文章深入探讨了 Google 翻译的工作机制，以及它如何通过替换 TextNode 为 FontElement 来破坏 React 的虚拟 DOM，从而导致应用崩溃或数据无法更新等问题。文章还分析了几个常见的错误，例如 `NotFoundError` 和 `insertBefore` 失败，并提出了几种解决方法，包括猴子补丁和用 `` 包裹 TextNode，但这些方法都存在局限性。最终，文章建议开发者权衡利弊，可能需要禁用 Google 翻译或自行实现本地化功能，以确保应用的稳定性和用户体验。