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; rv:148.0) Gecko/20100101 Firefox/148.0

Browser: Firefox 148

Operating system: Mac OS X 10.15

Device Platform: Desktop

Date tested: 5 months ago

style.cssPropertyName

1.6M/s

style.setProperty

1.2M/s

style.removeProperty

1.1M/s

View exact numbers

Test name	Executions per second
✓ style.cssPropertyName	1,607,145 Ops/sec
style.setProperty	1,195,559 Ops/sec
style.removeProperty	1,067,275 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 = ''