Internationalisation (i18n) React: patterns modernes

Industrialisez la traduction sans bloquer les performances ni la DX.

Architecture i18n

// i18n.ts (react-i18next)
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';

await i18n.use(initReactI18next).init({
  fallbackLng: 'fr',
  supportedLngs: ['fr','en','de'],
  ns: ['common','checkout'],
  defaultNS: 'common',
  load: 'languageOnly'
});

Chargement différé

• Import dynamique des namespaces par route

• Préchargement au survol des liens

Formats et pluriels

• Intl.DateTimeFormat, Intl.NumberFormat

• Règles de pluriel correctes (i18next‑plural‑postprocessor)

Traductions éditoriales

• Clés stables et descriptives

• Outil TMS (Locize, POEditor) + workflows

Tests

• Snapshot multi‑langues des écrans clés

• Lint anti‑clés manquantes