Google 번역이 React(및 다른 웹 앱)를 크래시시키는 이유: DOM 대결

Google Chrome에 내장된 Google 번역 확장 프로그램은 DOM을 조작하여 많은 최신 웹 앱, 특히 React를 사용하는 앱을 크래시시키는 경우가 있습니다. 이 기사에서는 Google 번역의 작동 메커니즘, TextNode를 FontElement로 바꿈으로써 React의 가상 DOM을 파괴하고 크래시나 데이터 불일치를 유발하는 방식을 자세히 설명합니다. `NotFoundError`나 `insertBefore` 실패 등 일반적인 오류와, 몽키 패치나 TextNode를 ``으로 감싸는 등의 해결 방법도 분석하지만, 이러한 해결책에는 한계가 있습니다. 결론적으로 이 기사에서는 앱의 안정성과 사용자 경험을 보장하기 위해 Google 번역을 비활성화하거나 자체 로컬라이제이션을 구현하는 것을 고려해야 한다고 제안합니다.