@intlayer/docs 9.4.2 → 9.4.3

package/blog/fr/is_i18next_outdated.md

@@ -0,0 +1,315 @@
+---
+createdAt: 2026-09-02
+updatedAt: 2026-09-02
+title: i18next est-il obsolète en 2026 ?
+description: i18next propulse des millions de sites web, mais son architecture runtime de 2011 accuse son âge. Analyse du surpoids des bundles, des limites de tree-shaking et du manque d'innovations.
+keywords:
+  - i18next
+  - react-i18next
+  - next-i18next
+  - Intlayer
+  - Internationalisation
+  - i18n
+  - Taille de bundle
+  - Blog
+slugs:
+  - blog
+  - is-i18next-outdated
+author: aymericzip
+---
+
+# i18next est-il obsolète en 2026 ?
+
+Lancé en 2011, bien avant l'avènement des composants React, du bundling Webpack ou de TypeScript, `i18next` s'est imposé grâce à sa flexibilité et son omniprésence. Il bénéficie d'une réponse sur StackOverflow pour presque chaque question et d'adaptateurs pour tous les frameworks.
+
+Le projet n'est pas abandonné, des correctifs sont publiés de temps en temps. Cependant, maintenir un moteur ancien en état de marche diffère fondamentalement d'une évolution adaptée aux architectures frontend actuelles.
+
+Ces dernières années, le frontend s'est orienté vers la compilation au build, les React Server Components (RSC), le tree-shaking agressif et les outils pilotés par l'IA. De son côté, le cœur d'i18next reste inchangé : un singleton runtime qui résout des clés textuelles côté client.
+
+<TOC/>
+
+## Points clés
+
+**Mode maintenance :**
+
+Au cours de l'année écoulée, `next-i18next` a enregistré environ 63 commits (près d'un par semaine) et `react-i18next` environ 157, principalement pour des montées de versions et des correctifs mineurs.
+
+**Poids runtime élevé :**
+
+`react-i18next` et `next-i18next` injectent environ 17 à 18 Ko gzippés (~60 Ko minifiés) avant même d'afficher le premier mot traduit, soit presque 4 fois plus que `next-intlayer` (~4.7 Ko).
+
+**Fuite importante de traductions :**
+
+Avec la configuration statique par défaut, jusqu'à **89.8%** des données de traduction envoyées sur une page appartiennent en réalité à d'autres pages ou à des langues inutilisées.
+
+**Tree-shaking impossible :**
+
+Les clés dynamiques comme `t("home.hero.title")` ne peuvent pas être analysées par les bundlers, forçant l'inclusion intégrale des fichiers JSON dans le bundle client.
+
+**Alignement commercial :**
+
+Les mainteneurs exploitent Locize. Intégrer un pipeline de traduction par IA local et sans surcoût au sein de la CLI entrerait en concurrence directe avec leur service commercial payant.
+
+## Maintenance ou évolution active
+
+Le nombre d'étoiles GitHub reflète une adoption historique plutôt qu'une dynamique technique moderne.
+
+| Répertoire              | Étoiles                                                                                                                                                    | Commits totaux                                                                                                                                                          | Commits / an                                                                                                                                                           | Dernier commit                                                                                                                                   |
+| ----------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
+| `i18next/i18next`       | [![stars](https://img.shields.io/github/stars/i18next/i18next?style=for-the-badge&label=stars)](https://github.com/i18next/i18next/stargazers)             | [![commits](https://img.shields.io/github/commit-activity/t/i18next/i18next?style=for-the-badge&label=commits)](https://github.com/i18next/i18next/commits)             | [![yearly](https://img.shields.io/github/commit-activity/y/i18next/i18next?style=for-the-badge&label=%2Fyear)](https://github.com/i18next/i18next/commits)             | [![last](https://img.shields.io/github/last-commit/i18next/i18next?style=for-the-badge)](https://github.com/i18next/i18next/commits)             |
+| `i18next/react-i18next` | [![stars](https://img.shields.io/github/stars/i18next/react-i18next?style=for-the-badge&label=stars)](https://github.com/i18next/react-i18next/stargazers) | [![commits](https://img.shields.io/github/commit-activity/t/i18next/react-i18next?style=for-the-badge&label=commits)](https://github.com/i18next/react-i18next/commits) | [![yearly](https://img.shields.io/github/commit-activity/y/i18next/react-i18next?style=for-the-badge&label=%2Fyear)](https://github.com/i18next/react-i18next/commits) | [![last](https://img.shields.io/github/last-commit/i18next/react-i18next?style=for-the-badge)](https://github.com/i18next/react-i18next/commits) |
+| `i18next/next-i18next`  | [![stars](https://img.shields.io/github/stars/i18next/next-i18next?style=for-the-badge&label=stars)](https://github.com/i18next/next-i18next/stargazers)   | [![commits](https://img.shields.io/github/commit-activity/t/i18next/next-i18next?style=for-the-badge&label=commits)](https://github.com/i18next/next-i18next/commits)   | [![yearly](https://img.shields.io/github/commit-activity/y/i18next/next-i18next?style=for-the-badge&label=%2Fyear)](https://github.com/i18next/next-i18next/commits)   | [![last](https://img.shields.io/github/last-commit/i18next/next-i18next?style=for-the-badge)](https://github.com/i18next/next-i18next/commits)   |
+| `aymericzip/intlayer`   | [![stars](https://img.shields.io/github/stars/aymericzip/intlayer?style=for-the-badge&label=stars)](https://github.com/aymericzip/intlayer/stargazers)     | [![commits](https://img.shields.io/github/commit-activity/t/aymericzip/intlayer?style=for-the-badge&label=commits)](https://github.com/aymericzip/intlayer/commits)     | [![yearly](https://img.shields.io/github/commit-activity/y/aymericzip/intlayer?style=for-the-badge&label=%2Fyear)](https://github.com/aymericzip/intlayer/commits)     | [![last](https://img.shields.io/github/last-commit/aymericzip/intlayer?style=for-the-badge)](https://github.com/aymericzip/intlayer/commits)     |
+
+Activité sur les douze derniers mois :
+
+| Projet          | Commits totaux | 12 derniers mois | Priorités                               |
+| --------------- | -------------- | ---------------- | --------------------------------------- |
+| `next-i18next`  | 1 311          | **63**           | Mises à jour Next.js et correctifs      |
+| `react-i18next` | 1 988          | **157**          | Types et maintenance                    |
+| `i18next` core  | 2 626          | **259**          | Correctifs mineurs                      |
+| Intlayer        | 7 156          | **4 343**        | Compilateur, tooling IDE et moteur d'IA |
+
+[![Star History Chart](https://api.star-history.com/chart?repos=i18next%2Fi18next%2Ci18next%2Freact-i18next%2Ci18next%2Fnext-i18next%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#i18next/i18next&i18next/react-i18next&i18next/next-i18next&aymericzip/intlayer)
+
+Une bibliothèque concise peut être mature et stable. Mais les outils d'i18n évoluent vite : les bundlers modernes éliminent le contenu inutile au build, les LLMs traduisent automatiquement en CI, et les éditeurs reposent sur des serveurs de langage (LSP) et des agents IA. L'architecture runtime d'i18next limite sa capacité à adopter ces nouveautés.
+
+## Évaluation de l'impact sur le bundle
+
+<I18nBenchmark framework="tanstack" vertical/>
+
+<ClickToOpenIframe
+src="https://intlayer.org/markdown?url=https%3A%2F%2Fraw.githubusercontent.com%2Fintlayer-org%2Fbenchmark-i18n%2Fmain%2Freport%2Fscripts%2Fsummarize-tanstack.md"
+width="100%"
+height="600px"
+style="border:none;"
+/>
+
+> Mesures effectuées sur un build de production avec 10 routes et 10 locales, compression gzip activée. Détails dans le [rapport de benchmark i18n](https://intlayer.org/fr/doc/benchmark).
+
+### Poids initial des bibliothèques
+
+Poids de base avant l'ajout du moindre contenu traduit :
+
+| Bibliothèque           | Gzippé     | Minifié     |
+| ---------------------- | ---------- | ----------- |
+| `next-i18next@16.0.5`  | 17.8 Ko    | 61.2 Ko     |
+| `react-i18next@17.0.2` | 17.3 Ko    | 59.8 Ko     |
+| `intlayer@8.7.12`      | **4.7 Ko** | **12.8 Ko** |
+
+### Poids des pages et fuite de contenu
+
+Testé sous React / TanStack Start (stratégie statique) :
+
+| Bibliothèque          | JS moyen / page (gz) | Fuite de langues | Fuite autres pages | Composant moyen (gz) | Hydratation |
+| --------------------- | -------------------- | ---------------- | ------------------ | -------------------- | ----------- |
+| `react-i18next`       | 180.3 Ko             | **50.0%**        | **89.8%**          | 24.3 Ko              | 85.1 ms     |
+| Intlayer              | **127.8 Ko**         | 50.0%            | **0.8%**           | **7.1 Ko**           | **24.1 ms** |
+| Intlayer (scoped dyn) | **118.1 Ko**         | **0.0%**         | **0.8%**           | **4.6 Ko**           | 23.7 ms     |
+
+Sur Next.js :
+
+| Bibliothèque     | JS moyen / page (gz) | Fuite autres pages | Composant moyen (gz) |
+| ---------------- | -------------------- | ------------------ | -------------------- |
+| Base (sans i18n) | 150.8 Ko             | 0.0%               | 0.7 Ko               |
+| `next-i18next`   | **227.5 Ko**         | **89.8%**          | 24.5 Ko              |
+| `next-intlayer`  | **152.1 Ko**         | **0.0%**           | **7.2 Ko**           |
+
+### Constats majeurs
+
+**Poids des pages :**
+
+Sur Next.js, `next-i18next` ajoute **76.7 Ko gzippés** par rapport au projet de base (+50%). `next-intlayer` n'ajoute que 1.3 Ko.
+
+**Fuites de contenu :**
+
+Par défaut, près de **90% des traductions envoyées** sur une page concernent d'autres sections du site. La séparation manuelle par namespaces est fastidieuse et source d'erreurs.
+
+**Temps d'hydratation :**
+
+L'hydratation des composants prend **85 ms** avec `react-i18next` contre **24 ms** avec Intlayer. Transmettre de volumineux arbres JSON aux composants ralentit la réactivité.
+
+## Pourquoi i18next est-il lourd ?
+
+### Accumulation de fonctionnalités au runtime
+
+Fonctionner intégralement dans le navigateur oblige à charger l'ensemble des modules dès le départ : interpolation, règles de pluriels, gestion de contextes, formats et bus d'événements. Même une simple chaîne de texte embarque tout le moteur.
+
+### Les clés dynamiques bloquent le tree-shaking
+
+Puisque la clé `"hero.title"` est résolue au runtime, les bundlers ne peuvent pas vérifier quelles chaînes sont réellement utilisées. Les textes inutilisés restent donc inclus dans les bundles clients.
+
+<Tabs defaultTab="intlayer" group="techno">
+  <Tab label="i18next" value="i18next">
+
+```tsx fileName="Component.tsx"
+const { t } = useTranslation("home");
+
+return <h1>{t("hero.title")}</h1>;
+```
+
+  </Tab>
+  <Tab label="Intlayer" value="intlayer">
+
+```tsx fileName="Hero.tsx"
+const { title } = useIntlayer("hero");
+
+return <h1>{title}</h1>;
+```
+
+  </Tab>
+</Tabs>
+
+Le [compilateur Intlayer](https://intlayer.org/fr/doc/compiler) identifie ce que `Hero.tsx` utilise réellement et élimine les champs non référencés avant de produire les bundles clients. Consultez [l'optimisation de bundle](https://intlayer.org/fr/doc/concept/bundle-optimization) pour en savoir plus.
+
+## Expérience développeur
+
+### Fichiers JSON distants ou co-localisation
+
+Avec i18next, les traductions sont dispersées dans des dossiers JSON séparés du code. Intlayer regroupe les déclarations de contenu directement à côté des composants.
+
+<Tabs defaultTab="intlayer" group="techno">
+  <Tab label="i18next" value="i18next">
+
+```json fileName="locales/en/hero.json"
+{
+  "title": "Ship in every language"
+}
+```
+
+```json fileName="locales/fr/hero.json"
+{
+  "title": "Livrez dans toutes les langues"
+}
+```
+
+```tsx fileName="Hero.tsx"
+import { useTranslation } from "react-i18next";
+
+export const Hero = () => {
+  const { t } = useTranslation("hero");
+  return <h1>{t("title")}</h1>;
+};
+```
+
+  </Tab>
+  <Tab label="Intlayer" value="intlayer">
+
+```ts fileName="hero.content.ts"
+import { t, type Dictionary } from "intlayer";
+
+export default {
+  key: "hero",
+  content: {
+    title: t({
+      en: "Ship in every language",
+      fr: "Livrez dans toutes les langues",
+    }),
+  },
+} satisfies Dictionary;
+```
+
+```tsx fileName="Hero.tsx"
+import { useIntlayer } from "react-intlayer";
+
+export const Hero = () => {
+  const { title } = useIntlayer("hero");
+  return <h1>{title}</h1>;
+};
+```
+
+  </Tab>
+</Tabs>
+
+Lorsque vous déplacez ou supprimez `Hero.tsx`, ses traductions suivent automatiquement.
+
+### Autocomplétion ou sécurité de typage stricte
+
+L'extension de `CustomTypeOptions` offre l'autocomplétion des clés, mais ne garantit pas la présence effective des textes. La suppression d'une clé dans `fr/home.json` ne bloque pas votre build, elle entraîne simplement un fallback au runtime.
+
+Intlayer déduit les types à partir des déclarations de contenu, et le [`strictMode`](https://intlayer.org/fr/doc/concept/configuration) convertit les traductions manquantes en erreurs strictes au build.
+
+### Comparatif d'outillage
+
+| Fonctionnalité                  | Écosystème i18next   | Intlayer                                                                     |
+| ------------------------------- | -------------------- | ---------------------------------------------------------------------------- |
+| **Extension VS Code**           | Tierce uniquement    | ✅ [Extension officielle](https://intlayer.org/fr/doc/vs-code-extension)     |
+| **Serveur de langage (LSP)**    | ❌ Aucun             | ✅ [LSP dédié](https://intlayer.org/fr/doc/lsp)                              |
+| **Serveur MCP (pour IA)**       | ❌ Aucun             | ✅ [Serveur MCP intégré](https://intlayer.org/fr/doc/mcp-server)             |
+| **Compétences agents (Skills)** | ❌ Aucune            | ✅ [Compétences prêtes à l'emploi](https://intlayer.org/fr/doc/agent_skills) |
+| **CMS visuel en contexte**      | Locize (SaaS payant) | ✅ [Gratuit et open source](https://intlayer.org/fr/doc/concept/editor)      |
+
+## Traduction et modèle économique de Locize
+
+Locize est la plateforme commerciale officielle créée par les auteurs d'i18next. Bien que le financement de l'open source soit essentiel, ce modèle engendre un arbitrage : un projet monétisé via un SaaS de traduction a peu d'intérêt à fournir gratuitement un outil de traduction IA local et autonome dans sa CLI.
+
+Intlayer privilégie un modèle ouvert :
+
+- [`intlayer fill`](https://intlayer.org/fr/doc/concept/auto-fill) complète les traductions manquantes en local ou en CI avec vos propres clés API (OpenAI, Anthropic, Mistral, Gemini).
+- Le [CMS Intlayer](https://intlayer.org/fr/doc/concept/cms) est open source et auto-hébergeable via Docker Compose.
+- Le compilateur, la CLI, l'éditeur et le CMS sont tous sous licence Apache 2.0.
+
+## Dans quels cas i18next reste-t-il pertinent ?
+
+<AccordionGroup>
+<Accordion header="Bases de code existantes et stables">
+
+Si votre application fonctionne sans difficulté et que la taille du bundle n'est pas critique, une réécriture n'est pas nécessaire.
+
+</Accordion>
+<Accordion header="Plateformes spécifiques">
+
+Le catalogue d'extensions d'i18next couvre des configurations particulières (Electron, anciennes applications jQuery, bridges natifs sur mesure) que les compilateurs récents ne ciblent pas forcément.
+
+</Accordion>
+<Accordion header="Base de connaissances communautaire">
+
+L'historique accumulé sur StackOverflow et GitHub facilite la résolution de cas rares.
+
+</Accordion>
+</AccordionGroup>
+
+## Comment améliorer ma configuration i18next existante ?
+
+Intlayer propose des packages de compatibilité prêts à l'emploi qui reprennent à l'identique les signatures de fonctions des bibliothèques i18next (`i18next`, `react-i18next` et `next-i18next`). Vous n'avez pas besoin de réécrire vos composants pour bénéficier d'une architecture optimisée par compilateur.
+
+L'installation s'effectue en une seule commande :
+
+```bash packageManager="npm"
+npx intlayer init --interactive
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer init --interactive
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer init --interactive
+```
+
+```bash packageManager="bun"
+bunx intlayer init --interactive
+```
+
+Cette CLI interactive :
+
+1. Installe le package de compatibilité `@intlayer/i18next`.
+2. Configure les alias du bundler afin que vos imports habituels (`useTranslation`, `Trans`, `t`) pointent directement vers Intlayer, permettant de retirer l'ancienne bibliothèque de votre `package.json`.
+3. Active immédiatement le support du serveur de langage (LSP) dans l'IDE, l'optimisation du bundle (tree-shaking complet) et les flux de traduction IA locale.
+
+Pour aller plus loin, consultez nos guides détaillés :
+
+- **Couches de compatibilité :** Conservez votre code existant avec les adaptateurs pour [i18next](https://intlayer.org/fr/doc/compatibility/i18next), [react-i18next](https://intlayer.org/fr/doc/compatibility/react-i18next) et [next-i18next](https://intlayer.org/fr/doc/compatibility/next-i18next).
+- **Migration des dictionnaires :** Convertissez vos catalogues JSON en structures typées : [depuis i18next](https://intlayer.org/fr/doc/migration/i18next), [depuis react-i18next](https://intlayer.org/fr/doc/migration/react-i18next) ou [depuis next-i18next](https://intlayer.org/fr/doc/migration/next-i18next).
+- **Approche hybride :** Gardez votre runtime i18next tout en [associant Intlayer à i18next](https://intlayer.org/fr/blog/intlayer-with-i18next) pour générer, typer et traduire automatiquement vos dictionnaires.
+
+Analysez votre site en production avec le [scanner SEO i18n gratuit](https://intlayer.org/i18n-seo-scanner) :
+
+<ClickToOpenIframe src="https://intlayer.org/i18n-seo-scanner" width="100%" height="600px" style="border:none;"/>
+
+## Lectures recommandées
+
+- [Benchmark i18n Next.js : analyse complète des performances](https://intlayer.org/fr/doc/benchmark/nextjs)
+- [react-i18next vs react-intl vs Intlayer](https://intlayer.org/fr/blog/react-i18next-vs-react-intl-vs-intlayer)
+- [next-intl est-il obsolète en 2026 ?](https://intlayer.org/fr/blog/is-next-intl-outdated)
+- [Architecture de compilation vs i18n déclarative](https://intlayer.org/fr/blog/compiler-vs-declarative-i18n)