clientWidth / clientHeight vs. getBoundingClientRect()awe (version: 0)

Comparing performance of: offsetWidth / offsetHeight (destructured and renamed) vs offsetWidth / offsetHeight (destructured) vs offsetWidth / offsetHeight (simple property access) vs getBoundingClientRect() (destructured) vs getBoundingClientRect() (simple property access)

Created: 4 years ago by: Guest
Go to the latest result
HTML Preparation code:
Script Preparation code:
Tests:

Historical Performance Data aggregated from 5 community runs

Desktop Results:
Chrome 5 runs
getBoundingClientRect() (simple property access)
1.3M/s
getBoundingClientRect() (destructured)
1.3M/s
offsetWidth / offsetHeight (simple property access)
1.2M/s
offsetWidth / offsetHeight (destructured)
1.1M/s
offsetWidth / offsetHeight (destructured and renamed)
1.1M/s

Fastest: getBoundingClientRect() (simple property access) (1.2x faster)

View exact numbers
  • ✓ getBoundingClientRect() (simple property access): 1,255,500 ops/sec
  • • getBoundingClientRect() (destructured): 1,251,890 ops/sec
  • • offsetWidth / offsetHeight (simple property access): 1,209,668 ops/sec
  • • offsetWidth / offsetHeight (destructured): 1,070,559 ops/sec
  • • offsetWidth / offsetHeight (destructured and renamed): 1,052,012 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results
  • Test case name Result
    offsetWidth / offsetHeight (destructured and renamed)
    offsetWidth / offsetHeight (destructured)
    offsetWidth / offsetHeight (simple property access)
    getBoundingClientRect() (destructured)
    getBoundingClientRect() (simple property access)

    Fastest: N/A

    Slowest: N/A

Latest run results:
Run details: (Test run date: one year ago)
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36 Edg/134.0.0.0
Chrome 134 on Mac OS X 10.15.7
View result in a separate tab
getBoundingClientRect() (simple property access)
2.6M/s
getBoundingClientRect() (destructured)
2.3M/s
offsetWidth / offsetHeight (destructured and renamed)
1.6M/s
offsetWidth / offsetHeight (destructured)
1.4M/s
offsetWidth / offsetHeight (simple property access)
1.4M/s
View exact numbers
Test name Executions per second
✓ getBoundingClientRect() (simple property access) 2,582,263 Ops/sec
getBoundingClientRect() (destructured) 2,273,136 Ops/sec
offsetWidth / offsetHeight (destructured and renamed) 1,579,084 Ops/sec
offsetWidth / offsetHeight (destructured) 1,416,023 Ops/sec
offsetWidth / offsetHeight (simple property access) 1,387,377 Ops/sec

Related benchmarks