Benchmark: className const/cached/new regex, classList contains, className split includes, className indexOf scan

Script Preparation code:

var el = document.createElement('div');
el.className = 'foo bar baz hello world';
var xs = 'hello';
var xre = new RegExp('\\b' + xs + '\\b');
var cache = new Map();

Tests:

className const regex
return xre.test(el.className);
className cached regex
let s = xs; // ensure local var instead of closure var let re = cache.get(s); if (!re) { re = new RegExp('\\b' + s + '\\b'); cache.set(s, re); } return re.test(el.className);
className new regex
return new RegExp('\\b' + xs + '\\b').test(el.className);
classList contains
return el.classList.contains(xs);
className split includes
return el.className.split(' ').includes(xs);
className indexOf scan
let s = xs; // ensure local var instead of closure var let c = el.className; let sl = s.length; let cl = c.length; let i = c.indexOf(s); //console.debug(i); if (i === 0) { let j = i + sl; if (j === cl || c[j] === ' ') return true; } while (i !== -1) { let j = i + sl; if (c[i - 1] === ' ' && (j === cl || c[j] === ' ')) return true; i = c.indexOf(s, j + 1); //console.debug(i); } return false;

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
className const regex
className cached regex
className new regex
classList contains
className split includes
className indexOf scan

Fastest: N/A

Slowest: N/A

ⓘ Get performance results from real users on your website with Request Metrics.

Website Performance Monitoring by Request Metrics

Latest run results:

Run details: (Test run date: 2 years ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:100.0) Gecko/20100101 Firefox/100.0

Browser/OS: Firefox 100 on Windows

View result in a separate tab

Test name	Executions per second
className const regex	19175170.0 Ops/sec
className cached regex	15735780.0 Ops/sec
className new regex	7319667.0 Ops/sec
classList contains	24467290.0 Ops/sec
className split includes	7550324.0 Ops/sec
className indexOf scan	17836270.0 Ops/sec

className const/cached/new regex, classList contains, className split includes, className indexOf scan (version: 0)

Comparing performance of: className const regex vs className cached regex vs className new regex vs classList contains vs className split includes vs className indexOf scan

Created: 2 years ago by: Guest

Jump to the latest result

className const regex

className cached regex

className new regex

classList contains

className split includes

className indexOf scan

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A