API Intl du Navigateur vs Systèmes de Gestion de Traduction : Pourquoi Vous Avez Besoin des Deux en 2026

L'idée reçue sur "Intl"

Beaucoup de développeurs découvrent l'objet global Intl en JavaScript et pensent : "Génial, j'ai l'internationalisation intégrée, je n'ai pas besoin de bibliothèque externe !"

C'est à moitié vrai.

L'API Intl est incroyablement puissante pour le formatage (ce qui est difficile), mais elle ne fait rien pour la traduction (ce qui est encore plus difficile).

En 2026, la bonne stratégie est la combinaison : Utiliser la Plateforme pour le formatage, Utiliser un TMS pour le contenu.

Ce que l'API Intl fait Brillamment (Gratuitement)

Ne jamais, jamais importer une bibliothèque comme moment.js ou faire des calculs mathématiques pour formater de l'argent ou des dates en 2026. Le navigateur le fait mieux, plus vite et avec 0kb de bundle.

1. Formatage de Date & Heure (Intl.DateTimeFormat)

JavaScriptCopy
1const date = new Date();
2const locale = 'fr-FR';
3
4// Basique
5new Intl.DateTimeFormat(locale).format(date);
6// "08/01/2026"
7
8// Avancé
9new Intl.DateTimeFormat(locale, {
10  dateStyle: 'full',
11  timeStyle: 'short'
12}).format(date);
13// "jeudi 8 janvier 2026 à 14:30"

2. Dates Relatives (Intl.RelativeTimeFormat)

Plus besoin de bibliothèques "timeago".

JavaScriptCopy
1const rtf = new Intl.RelativeTimeFormat('es', { numeric: 'auto' });
2
3rtf.format(-1, 'day'); // "ayer" (automatique !)
4rtf.format(2, 'day');  // "pasado mañana"
5rtf.format(5, 'minute'); // "dentro de 5 minutos"

3. Nombres & Devises (Intl.NumberFormat)

Gère les séparateurs de milliers, les virgules/points, et les symboles de devise.

JavaScriptCopy
1const price = 123456.78;
2
3// US
4new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(price);
5// "$123,456.78"
6
7// Allemagne
8new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(price);
9// "123.456,78 €"

4. Formatage de Liste (Intl.ListFormat)

Celui-ci est souvent oublié. Comment joindre une liste ? En anglais c'est "A, B, and C".

JavaScriptCopy
1const fruits = ['Pommes', 'Bananes', 'Poires'];
2
3const formatter = new Intl.ListFormat('fr', { style: 'long', type: 'conjunction' });
4formatter.format(fruits);
5// "Pommes, Bananes et Poires"

Ce que l'API Intl NE FAIT PAS

L'API Intl ne contient aucun dictionnaire. Elle ne sait pas comment dire "Hello" en espagnol. Elle sait seulement comment écrire la date d'aujourd'hui en espagnol.

C'est là que le TMS (Translation Management System) entre en jeu.

Le Fossé

Vous avez ce code :

JavaScriptCopy
const message = `You have ${count} items in your cart.`;

Intl ne peut pas vous aider ici. Vous avez besoin de :

1. Stocker la chaîne "You have {count} items in your cart."
2. La traduire en "Vous avez {count} articles dans votre panier."
3. Gérer le pluriel (1 item vs 2 items).

L'Architecture Hybride Parfaite 2026

Voici comment les meilleures applications (Airbnb, Spotify, etc.) font en 2026 :

1. Stockage & Traduction (Le TMS)

Utilisez un système comme IntlPull pour gérer vos chaînes.

JSONCopy
1// fr.json
2{
3  "cart_summary": "Vous avez acheté pour {amount} le {date}"
4}

2. Chargement & Interpolation (La Lib i18n)

Utilisez une petite bibliothèque (comme react-intl ou i18next) pour charger le JSON et insérer les variables.

3. Formatage de Variable (L'API Intl)

Passez les variables brutes à la fonction de traduction, et laissez-la utiliser Intl sous le capot.

JavaScriptCopy
1// Votre Code
2const total = 123.45;
3const today = new Date();
4
5t('cart_summary', {
6  amount: new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'EUR' }).format(total),
7  date: new Intl.DateTimeFormat('fr-FR').format(today)
8});
9
10// Résultat : "Vous avez acheté pour 123,45 € le 08/01/2026"

Conclusion

Ne réinventez pas la roue du formatage. Les navigateurs sont incroyablement intelligents en 2026. Utilisez Intl pour tout ce qui est nombres, dates, listes et pluralisation relative. Utilisez un TMS pour les Mots.

Combinez les deux, et votre application sera légère, rapide et globalement correcte.