Benchmark: commaizeNumber (Intl.NumberFormat vs Regex)

commaizeNumber (Intl.NumberFormat vs Regex) (version: 1)

Comparing performance of: `1. Intl 일반적인 케이스 (8개 숫자 한번에 처리) vs 2. Regex 일반적인 케이스 (8개 숫자 한번에 처리) vs 3. Intl Virtual scroll 케이스 (30개 한번에 처리) vs 4. Regex Virtual scroll 케이스 (30개 한번에 처리) vs 5. Intl 전체 리스트 케이스 (100개 한번에 처리) vs 6. Regex 전체 리스트 케이스 (100개 한번에 처리)`

Created: one year ago by: Guest

Go to the latest result

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

// Intl.NumberFormat 기반 구현 
function commaizeNumberIntl(value) {
    const num = typeof value === 'string' ? parseFloat(value.replace(/,/g, '')) : value;

    if (isNaN(num)) {
        return String(value);
    }

    return getNumberFormatter('ko-KR').format(num);
}

/**
 * locale 문자열을 key 로 쓰는 캐시.
 */
const numberFormatterCache = new Map();

function getNumberFormatter(locale) {
    const key = locale;

    let formatter = numberFormatterCache.get(key);
    if (!formatter) {
        formatter = new Intl.NumberFormat(locale);
        numberFormatterCache.set(key, formatter);
    }
    return formatter;
}


// 정규식 기반 구현 
function commaizeNumberRegex(value) {
    const numStr = String(value);
    const decimalPointIndex = numStr.indexOf('.');
    const commaizeRegExp = /(\d)(?=(\d\d\d)+(?!\d))/g;

    return decimalPointIndex > -1 ?
        numStr.slice(0, decimalPointIndex).replace(commaizeRegExp, '$1,') + numStr.slice(decimalPointIndex) :
        numStr.replace(commaizeRegExp, '$1,');
}

// Test Case A: 일반 페이지 (8개 숫자 한번에 처리)
const normalPageNumbers = [1234, 56789, 123456, 9876, 543210, 87654, 321098, 765432];

// Test Case B: Virtual scroll (30개 한번에 처리)  
const virtualScrollNumbers = Array.from({length: 30}, (_, i) => Math.floor(Math.random() * 10000000));

// Test Case C: 주식 서비스 업데이트 (100개 한번에 처리)
const stockNumbers = Array.from({length: 100}, (_, i) => Math.floor(Math.random() * 1000000000));

Tests:

1. Intl 일반적인 케이스 (8개 숫자 한번에 처리)
for (const num of normalPageNumbers) { commaizeNumberIntl(num); }
2. Regex 일반적인 케이스 (8개 숫자 한번에 처리)
for (const num of normalPageNumbers) { commaizeNumberRegex(num); }
3. Intl Virtual scroll 케이스 (30개 한번에 처리)
for (const num of virtualScrollNumbers) { commaizeNumberIntl(num); }
4. Regex Virtual scroll 케이스 (30개 한번에 처리)
for (const num of virtualScrollNumbers) { commaizeNumberRegex(num); }
5. Intl 전체 리스트 케이스 (100개 한번에 처리)
for (const num of stockNumbers) { commaizeNumberIntl(num); }
6. Regex 전체 리스트 케이스 (100개 한번에 처리)
for (const num of stockNumbers) { commaizeNumberRegex(num); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
1. Intl 일반적인 케이스 (8개 숫자 한번에 처리)
2. Regex 일반적인 케이스 (8개 숫자 한번에 처리)
3. Intl Virtual scroll 케이스 (30개 한번에 처리)
4. Regex Virtual scroll 케이스 (30개 한번에 처리)
5. Intl 전체 리스트 케이스 (100개 한번에 처리)
6. Regex 전체 리스트 케이스 (100개 한번에 처리)

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

Browser/OS: Chrome 137 on Mac OS X 10.15.7

View result in a separate tab

2. Regex 일반적인 케이스 (8개 숫자 한번에 처리)

492K/s

1. Intl 일반적인 케이스 (8개 숫자 한번에 처리)

321K/s

4. Regex Virtual scroll 케이스 (30개 한번에 처리)

113K/s

3. Intl Virtual scroll 케이스 (30개 한번에 처리)

74K/s

6. Regex 전체 리스트 케이스 (100개 한번에 처리)

27K/s

5. Intl 전체 리스트 케이스 (100개 한번에 처리)

24K/s

View exact numbers

Test name	Executions per second
✓ 2. Regex 일반적인 케이스 (8개 숫자 한번에 처리)	491,861 Ops/sec
1. Intl 일반적인 케이스 (8개 숫자 한번에 처리)	320,645 Ops/sec
4. Regex Virtual scroll 케이스 (30개 한번에 처리)	113,219 Ops/sec
3. Intl Virtual scroll 케이스 (30개 한번에 처리)	73,782 Ops/sec
6. Regex 전체 리스트 케이스 (100개 한번에 처리)	27,193 Ops/sec
5. Intl 전체 리스트 케이스 (100개 한번에 처리)	23,785 Ops/sec