关于useContext和使用i18n的useTranslation翻译的问题

Question

老师，使用useContext 翻译和 useTranslation翻译 哪个性能更好，没想明白，使用useContext 做翻译，切换语言，需要触发重新渲染，那替换为i18n的 useTransition 也需要重新渲染，感觉二者一样呢。

Answer 1

阿莱克斯刘 6天前

性能差异几乎可以忽略，真正的区别不在“会不会重新渲染”，而在“谁被迫一起渲染”。

不管你用 useContext 做翻译，还是用 react-i18next 的 useTranslation，切换语言一定会触发重新渲染，这是没法也不该避免的，文本都变了，不渲染才奇怪。

关键差别在于：

• useContext 翻译
  语言状态一变，所有消费这个 Context 的组件都会重新渲染，哪怕某些组件只用了其中一个字段，或者其实并不依赖语言内容。

• useTranslation（i18n）
  它内部做了订阅和优化，只会让真正使用翻译的组件更新，不会把整个 Context 树一锅端；本质上是“更细粒度的更新”。

useContext 是“广播式更新”，useTranslation 是“按需更新”，大项目里后者更稳。

• 提问者 qq_ToutAn諾尘_0 #1

  感谢老师， 了解了。