Internationalization in 2025: next-intl vs react-i18next vs Lingui

Going Global Requires i18n

Internationalization (i18n) is more than translation. It includes date formats, number formats, pluralization, and RTL support.

Quick Comparison

next-intl: Next.js Native

next-intl is designed specifically for Next.js App Router.

Key Features

• App Router - full RSC support
• Type-safe - TypeScript integration
• Routing - locale in URL
• Formatting - dates, numbers, lists
• Small bundle - minimal client JS

Example

```tsx // messages/en.json { "greeting": "Hello, {name}!" }

// Component import { useTranslations } from 'next-intl';

function Welcome() { const t = useTranslations(); return <h1>{t('greeting', { name: 'World' })}</h1>; } ```

Best For

• Next.js applications
• Server Components
• Type safety

react-i18next: The Standard

react-i18next is the most popular React i18n library.

Key Features

• Mature - battle-tested
• Plugins - extensive ecosystem
• Backends - load translations dynamically
• Namespaces - organize translations
• Interpolation - powerful formatting

Example

```tsx import { useTranslation } from 'react-i18next';

function Welcome() { const { t } = useTranslation(); return <h1>{t('greeting', { name: 'World' })}</h1>; } ```

Best For

• Any React application
• Complex requirements
• Existing i18next users

Lingui: Modern Alternative

Lingui offers excellent DX with macro-based extraction.

Key Features

• Macros - extract from code
• ICU format - standard message format
• Small runtime - minimal bundle
• CLI - powerful tooling

Example

```tsx import { Trans } from '@lingui/macro';

function Welcome({ name }) { return <Trans>Hello, {name}!</Trans>; } ```

Best For

• Developer experience
• Automatic extraction
• ICU message format

Best Practices

1. Structure Messages

```json { "common": { "save": "Save", "cancel": "Cancel" }, "auth": { "login": "Log in", "logout": "Log out" } } ```

2. Handle Plurals

```json { "items": "{count, plural, =0 {No items} one {# item} other {# items}}" } ```

3. Format Dates/Numbers

```tsx const formatted = new Intl.DateTimeFormat(locale, { dateStyle: 'long' }).format(date); ```

Our Recommendation

• Next.js: next-intl
• Any React: react-i18next
• Modern DX: Lingui
• Standards: FormatJS

Explore i18n tools in our Tools directory or compare options with our Compare tool.

Sources

• next-intl Documentation
• react-i18next Documentation
• Lingui Documentation