@formatjs/intl-localematcher vs intl-messageformat vs intl-relativeformat
Internationalization (i18n) in JavaScript
@formatjs/intl-localematcherintl-messageformatintl-relativeformatSimilar Packages:

Internationalization (i18n) in JavaScript

Internationalization (i18n) in JavaScript refers to the process of designing and developing applications that can adapt to different languages, cultures, and regions. This involves formatting numbers, dates, and currencies according to local conventions, as well as providing translated text for different languages. JavaScript provides built-in i18n support through the Intl API, which includes features like locale-aware sorting, number formatting, and date/time formatting. However, for more advanced i18n needs, developers often rely on third-party libraries like @formatjs/intl-localematcher, intl-messageformat, and intl-relativeformat to handle complex scenarios such as pluralization, gendered language, and context-aware translations. These libraries help create a more inclusive and accessible user experience by ensuring that applications communicate effectively with users from diverse linguistic backgrounds.

Npm Package Weekly Downloads Trend

3 Years

Github Stars Ranking

Stat Detail

Package
Downloads
Stars
Size
Issues
Publish
License
@formatjs/intl-localematcher014,709202 kB10a day agoMIT
intl-messageformat014,709115 kB10a day agoBSD-3-Clause
intl-relativeformat014,70998.3 kB10-BSD-3-Clause

Feature Comparison: @formatjs/intl-localematcher vs intl-messageformat vs intl-relativeformat

Locale Matching

  • @formatjs/intl-localematcher:

    @formatjs/intl-localematcher provides a simple and efficient way to match a list of locales against a user's preferred locales. It uses the best-fit algorithm to select the most appropriate locale, making it easy to implement locale negotiation in your application.

  • intl-messageformat:

    intl-messageformat does not handle locale matching directly, as its primary focus is on formatting messages. However, it can be used in conjunction with locale matching libraries to format messages in the selected locale.

  • intl-relativeformat:

    intl-relativeformat also does not handle locale matching. It relies on the locale being provided to format relative time expressions correctly.

Message Formatting

  • @formatjs/intl-localematcher:

    @formatjs/intl-localematcher does not perform message formatting, as it is solely focused on locale matching.

  • intl-messageformat:

    intl-messageformat excels at formatting messages with placeholders, supporting complex features like pluralization, gender, and nested messages. It uses ICU (International Components for Unicode) syntax, allowing for highly customizable and locale-aware message formatting.

  • intl-relativeformat:

    intl-relativeformat specializes in formatting relative time expressions, providing a simple API to create context-aware relative time strings. It is designed for formatting time intervals relative to the current time, making it a great complement to other message formatting libraries.

Pluralization Support

  • @formatjs/intl-localematcher:

    @formatjs/intl-localematcher does not provide pluralization support, as it is not within its scope.

  • intl-messageformat:

    intl-messageformat provides robust pluralization support based on the rules defined in the CLDR (Common Locale Data Repository). It allows developers to define different message formats for singular, plural, and other quantity categories, making it highly flexible for languages with complex pluralization rules.

  • intl-relativeformat:

    intl-relativeformat does not handle pluralization directly, as its focus is on relative time formatting. However, it can be used alongside pluralization-aware libraries to create more complex time-related messages.

Relative Time Formatting

  • @formatjs/intl-localematcher:

    @formatjs/intl-localematcher does not provide relative time formatting capabilities.

  • intl-messageformat:

    intl-messageformat can handle relative time formatting if the messages are defined to include relative time expressions. However, it does not provide built-in support for formatting relative time.

  • intl-relativeformat:

    intl-relativeformat is specifically designed for formatting relative time expressions. It provides a simple and efficient way to create relative time strings based on the time difference between two dates, making it ideal for applications that need to display time intervals in a user-friendly manner.

Ease of Use: Code Examples

  • @formatjs/intl-localematcher:

    Locale matching example using @formatjs/intl-localematcher

    import { bestFitLocaleMatcher } from '@formatjs/intl-localematcher';
    
    const availableLocales = ['en-US', 'fr-FR', 'es-ES'];
    const userLocales = ['fr-CA', 'en-GB'];
    
    const matchedLocale = bestFitLocaleMatcher(userLocales, availableLocales);
    console.log(matchedLocale); // Output: 'fr-FR'
    
  • intl-messageformat:

    Message formatting example using intl-messageformat

    import { MessageFormat } from 'intl-messageformat';
    
    const message = new MessageFormat('Hello {name}, you have {count, plural, =0 {no messages} =1 {one message} other {# messages}}.', 'en');
    const formattedMessage = message.format({ name: 'Alice', count: 2 });
    console.log(formattedMessage); // Output: 'Hello Alice, you have 2 messages.'
    
  • intl-relativeformat:

    Relative time formatting example using intl-relativeformat

    import { RelativeTimeFormat } from 'intl-relativeformat';
    
    const rtf = new RelativeTimeFormat('en');
    const formattedTime = rtf.format(-3, 'day');
    console.log(formattedTime); // Output: '3 days ago'
    

How to Choose: @formatjs/intl-localematcher vs intl-messageformat vs intl-relativeformat

  • @formatjs/intl-localematcher:

    Choose @formatjs/intl-localematcher if you need a lightweight library for matching locales based on the Accept-Language header or a list of preferred locales. It is particularly useful for applications that require simple locale negotiation without the overhead of a full i18n framework.

  • intl-messageformat:

    Choose intl-messageformat if you need to handle complex message formatting with support for pluralization, gender, and other ICU message features. It is ideal for applications that require rich text formatting with dynamic content and localization support.

  • intl-relativeformat:

    Choose intl-relativeformat if you need to format relative time expressions (e.g., "3 days ago", "in 2 hours") in a locale-aware manner. It is especially useful for applications that want to provide users with contextually relevant time information.

README for @formatjs/intl-localematcher

Intl LocaleMatcher

We've migrated the docs to https://formatjs.github.io/docs/polyfills/intl-localematcher.

Performance

This package implements a highly optimized three-tier locale matching algorithm that provides excellent performance even with large locale sets (700+ locales).

Benchmark Results

Benchmarked with 725 CLDR locales on Node.js:

ScenarioLatencyThroughputRelative Performance
Tier 1: Exact Match (en)1.38ms730 ops/sBaseline
Tier 2: 1-level Fallback (en-USen)1.39ms725 ops/s1.01x slower
Tier 2: Maximized Match (zh-TWzh-Hant)1.40ms720 ops/s1.02x slower
Tier 3: CLDR Distance (sr-Latn-BAsr-Latn-BA)1.38ms730 ops/s1.00x slower
Tier 3: Fuzzy Match (en-XZen)1.50ms670 ops/s1.09x slower

Real-world Impact

The optimization in this package resolved issue #4936, where DurationFormat instantiation was taking 610ms on React Native/Hermes due to slow locale matching against 700+ auto-loaded locales.

After optimization:

  • Common case (en-US): 1.39ms per instantiation
  • Chinese locales (zh-TW): 1.40ms per instantiation
  • Serbo-Croatian locales: 1.38ms per instantiation

Performance improvement: 439x faster 🚀

Three-Tier Optimization

The algorithm uses three tiers for maximum performance:

  1. Tier 1 (Exact Match): O(1) Set lookup for exact locale matches
  2. Tier 2 (Maximization + Fallback): Progressive subtag removal with locale maximization
  3. Tier 3 (CLDR Distance): Full UTS #35 Enhanced Language Matching with memoization

This design ensures that common cases (exact matches and simple fallbacks) are extremely fast, while complex scenarios (script/region matching, language distances) still perform well.