Benchmark: new Intl.NumberFormat vs cached instances

Script Preparation code:

window.cache = new WeakMap();

window.format = (locale, currency, value) => new Intl.NumberFormat(locale, { style: 'currency', currency }).format(value);

window.memoizedFormat = (locale, currency, value) => {
  const key = [locale, currency];
  let formatter = window.cache.get(key);
  
  if (!formatter) {
    formatter = new Intl.NumberFormat(locale, { style: 'currency', currency });
    window.cache.set(key, formatter);
  }
  
  return formatter.format(value);
};

Tests:

new Intl.NumberFormat
window.format('pt-BR', 'BRL', 100_346_999.21);
memoized instance
window.memoizedFormat('pt-BR', 'BRL', 100_346_999.21);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
new Intl.NumberFormat
memoized instance

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Browser/OS: Chrome 130 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
new Intl.NumberFormat	59928.3 Ops/sec
memoized instance	58598.6 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

**Benchmark Explanation**

The provided benchmark compares the performance of two approaches to create an instance of `Intl.NumberFormat` in JavaScript:

1. **New Instance**: The `new Intl.NumberFormat()` constructor is used to create a new instance with default settings (style: 'currency', currency).
2. **Memoized Instance**: A cache-based approach using a WeakMap (`window.cache`) to store memoized instances of `Intl.NumberFormat`. When creating a new instance, the benchmark first checks if an instance with the same locale and currency is already cached. If not, it creates a new instance and stores it in the cache.

**Options Comparison**

* **New Instance**: Pros:
	+ Simple to implement
	+ No overhead of caching instances
* Cons:
	+ Creates a new instance every time it's called, leading to slower performance due to object creation and initialization.
* **Memoized Instance**: Pros:
	+ Caches instances for faster subsequent calls with the same locale and currency.
	+ Can reduce memory usage by avoiding unnecessary object creation.
* Cons:
	+ Requires additional code to implement caching.
	+ May lead to cache invalidation issues if not properly managed.

**Library: Intl.NumberFormat**

`Intl.NumberFormat` is a built-in JavaScript API for formatting numbers according to the rules of a specific locale. It provides a way to format numbers as currency, including support for different currencies and locales.

The `Memoized instance` approach uses this library by creating an instance with the desired locale and currency settings (`style: 'currency', currency`). The cached instance is then reused for subsequent calls with the same locale and currency.

**Special JavaScript Feature/Syntax**

None mentioned in this benchmark. However, it's worth noting that the `WeakMap` data structure used for caching instances ensures that cache entries are garbage collected when they're no longer referenced, which helps prevent memory leaks.

**Other Alternatives**

While not explicitly listed as alternatives in the benchmark, other approaches to improve performance or reduce overhead include:

* **Using a single instance of Intl.NumberFormat with multiple locale and currency settings**: Instead of creating a new instance for each call, you can create a single instance with all desired settings and reuse it.
* **Using a caching library**: If you need more advanced caching functionality than what's provided by `WeakMap`, you can consider using a dedicated caching library like LRU Cache or a JavaScript implementation of a Least Recently Used cache.
* **Optimizing Intl.NumberFormat usage**: You may be able to optimize the usage of `Intl.NumberFormat` by reducing the number of calls with different settings, using more efficient formatting options (e.g., `formatToLocaleString` instead of `format`), or leveraging browser-specific optimizations.

Related benchmarks:

new Intl.NumberFormat vs cached instances (version: 0)

Comparing performance of: new Intl.NumberFormat vs memoized instance

Created: 2 years ago by: Guest

Jump to the latest result

new Intl.NumberFormat

memoized instance

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):