Benchmark: Intl.NumberFormat vs toLocalString vs string split & replace & join

Script Preparation code:

function pricize (n) {
  const parts = n.toString().split('.')

  parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',')

  return parts.join('.')
}

var target = 123456789.123456789
var options = { maximumFractionDigits: 20 }

Tests:

toLocaleString
var a = target.toLocaleString('en-US', options);
Intl.NumberFormat
var a = new Intl.NumberFormat('en-US', options).format(target)
string split & reduce
var a = pricize(target)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
toLocaleString
Intl.NumberFormat
string split & reduce

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 27 days ago):

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark measures the performance of three different approaches to format a large number:

1. `toLocaleString`
2. `Intl.NumberFormat`
3. A custom implementation using string splitting, replacing, and joining (`string split & reduce`)

**Options Comparison**

Each approach has its own set of options that can be adjusted to change its behavior.

* **`toLocaleString`**: This method uses the browser's locale settings to format the number. The `options` object can be used to customize the formatting, such as specifying the maximum number of fraction digits.
* **`Intl.NumberFormat`**: This method is a more explicit way of formatting numbers using the Internationalization API. The options object allows for fine-grained control over formatting, including the maximum number of fraction digits, thousands separator, and decimal separator.
* **Custom Implementation (`string split & reduce`)**: In this approach, the number is first converted to a string, then split into parts (before and after the decimal point), and finally joined back together with the desired formatting applied.

**Pros and Cons**

Here's a brief summary of each approach:

* **`toLocaleString`**:
	+ Pros: Simple, easy to use, and often provides the best default formatting for most users.
	+ Cons: May not always produce consistent results across different locales or browsers.
* **`Intl.NumberFormat`**:
	+ Pros: Highly customizable, allows for precise control over formatting, and is less prone to locale-specific issues.
	+ Cons: Can be more complex to use, especially for advanced formatting requirements.
* **Custom Implementation (`string split & reduce`)**:
	+ Pros: Allows for fine-grained control over formatting, can be optimized for performance.
	+ Cons: Requires manual handling of locale settings, decimal point, and thousands separator, which can introduce complexity.

**Library Usage**

The benchmark uses the `Intl` library, which is a part of the ECMAScript Standard, to implement the `NumberFormat` method. The `Intl` library provides a way to work with internationalization features in JavaScript, including formatting numbers.

No special JavaScript features or syntax are required for this benchmark. However, if you're interested in exploring more advanced features like template literals or async/await, those might be relevant.

**Alternative Approaches**

If you were to implement a different approach, some alternatives could include:

* Using a third-party library like `numfmt` or `decimal.js` to handle number formatting.
* Implementing your own custom formatting logic using regex and string manipulation.
* Utilizing browser-specific features like `Intl.NumberFormat`'s `formatToLocaleString` method.

Keep in mind that each approach has its trade-offs, and the best solution will depend on the specific requirements of your use case.

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/118.0.0.0 Safari/537.36

Browser/OS: Chrome 118 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
toLocaleString	65762.7 Ops/sec
Intl.NumberFormat	59503.5 Ops/sec
string split & reduce	2357601.2 Ops/sec

Related benchmarks:

Intl.NumberFormat vs toLocalString vs string split & replace & join (version: 0)

Comparing performance of: toLocaleString vs Intl.NumberFormat vs string split & reduce

Created: one year ago by: Guest

Jump to the latest result

toLocaleString

Intl.NumberFormat

string split & reduce

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 27 days ago):