Run results for: style.setProperty vs style.removeProperty vs style.cssPropertyName

Run details:

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

Browser: Chrome 145

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 5 months ago

style.cssPropertyName

3.2M/s

style.removeProperty

2.0M/s

style.setProperty

1.8M/s

View exact numbers

Test name	Executions per second
✓ style.cssPropertyName	3,187,209 Ops/sec
style.removeProperty	2,035,540 Ops/sec
style.setProperty	1,841,524 Ops/sec

HTML Preparation code:

<div id="el">Hello world</div>

Script Preparation code:

el = document.getElementById("el")
el.style.setProperty('color', 'red')
el.style.setProperty('border', '1vmin solid red')
el.style.setProperty('padding', '0.5vmin')
el.style.setProperty('background-color', 'black')
el.style.setProperty('height', '1vh')
el.style.setProperty('width', '1vw')

Tests:

style.setProperty
el.style.setProperty('color', '') el.style.setProperty('border', '') el.style.setProperty('padding', '') el.style.setProperty('background-color', '') el.style.setProperty('height', '') el.style.setProperty('width', '')
style.removeProperty
el.style.removeProperty('color') el.style.removeProperty('border') el.style.removeProperty('padding') el.style.removeProperty('background-color') el.style.removeProperty('height') el.style.removeProperty('width')
style.cssPropertyName
el.style.color = '' el.style.border = '' el.style.padding = '' el.style.backgroundColor = '' el.style.height = '' el.style.width = ''