clientHeight vs offsetHeight vs getBoundingClientRect (version: 0)

Comparing performance of: clientWidth / clientHeight vs offsetWidth / offsetHeight vs getBoundingClientRect

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

Historical Performance Data aggregated from 40 community runs

Desktop Results:
Chrome 33 runs
getBoundingClientRect
1.2M/s
offsetWidth / offsetHeight
886K/s
clientWidth / clientHeight
855K/s

Fastest: getBoundingClientRect (1.4x faster)

View exact numbers
  • ✓ getBoundingClientRect: 1,183,218 ops/sec
  • • offsetWidth / offsetHeight: 885,658 ops/sec
  • • clientWidth / clientHeight: 854,855 ops/sec
Firefox 7 runs
clientWidth / clientHeight
11.1M/s
offsetWidth / offsetHeight
8.5M/s
getBoundingClientRect
4.1M/s

Fastest: clientWidth / clientHeight (2.7x faster)

View exact numbers
  • ✓ clientWidth / clientHeight: 11,051,065 ops/sec
  • • offsetWidth / offsetHeight: 8,499,202 ops/sec
  • • getBoundingClientRect: 4,148,978 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
    clientWidth / clientHeight
    offsetWidth / offsetHeight
    getBoundingClientRect

    Fastest: N/A

    Slowest: N/A

Latest run results:
Run details: (Test run date: 11 months ago)
Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:142.0) Gecko/20100101 Firefox/142.0
Firefox 142 on Mac OS X 10.15
View result in a separate tab
clientWidth / clientHeight
24.1M/s
offsetWidth / offsetHeight
15.4M/s
getBoundingClientRect
9.3M/s
View exact numbers
Test name Executions per second
✓ clientWidth / clientHeight 24,148,986 Ops/sec
offsetWidth / offsetHeight 15,425,046 Ops/sec
getBoundingClientRect 9,283,536 Ops/sec

Related benchmarks