Dev.to WebDev 🛠 Dev 👁 0 📖 2 min read

Measuring reaction time in the browser: six things that went wrong

I built a small site with twelve reflex mini-tests (Aging Curve Test, in Korean). Timing a click sounds like one subtraction. These are the things that made the numbers wrong before they were right. 1. event.timeStamp a

I built a small site with twelve reflex mini-tests (Aging Curve Test, in Korean). Timing a click sounds like one subtraction. These are the things that made the numbers wrong before they were right.

1. event.timeStamp and performance.now() are not always the same clock.
The obvious code records performance.now() when the signal is shown and subtracts it from event.timeStamp when the player clicks. In one Chromium-based browser I tested in, the two values were on different time bases, so every reaction came out negative and was rejected as "too early". The fix was a small function that checks whether an event timestamp is plausibly close to performance.now() and falls back to performance.now() when it is not.

2. The signal is not on screen when you set the state.
Changing a colour in React does not put it on the glass. I record the show time immediately, then correct it inside requestAnimationFrame, which is closer to the frame the player actually sees. Without that, everyone is one frame faster than they deserve.

3. One trial is mostly luck.
The reaction test takes five trials and reports the median. A single lucky anticipation or one blink no longer moves the result.

4. People anticipate.
Anything faster than 100 ms after the signal is treated as a guess and the trial is repeated. So is a press before the signal. The wait before the signal is random so it cannot be counted.

5. Holding a key is not clicking.
For the clicks-per-second test, keydown events with repeat: true are ignored. Otherwise holding the space bar gives 30 clicks a second.

6. Mistakes need a price.
In the choice-reaction, aim, Stroop and go/no-go tests, speed alone rewards mashing. Each error adds a fixed number of milliseconds to the average (25, 15, 35 and 50 ms). The numbers are published on each test's page so nobody has to guess how the score was made.

Scoring. Each test maps a raw value to 0–100 between two published anchors. For simple reaction time, 190 ms is 100 points and 480 ms is 0. For comparison, Human Benchmark reports a median of 273 ms over 81 million clicks. The six ability scores are averaged and turned into an age with one line: 18 + (100 - total) * 0.6. It is a game, not a measurement of anything medical, and the site says so.

Why 24? The curve drawn on the site peaks at 24 because of Thompson, Blair and Henrey (2014), a PLOS ONE study of 3,305 StarCraft 2 players aged 16 to 44 that found in-game reaction times begin to slow at about that age (doi:10.1371/journal.pone.0094215).

Everything runs in the browser: there is no account, and results stay in localStorage. The scoring rules are written out at agingcurve.org/guide.

Disclosure: I run the site. This post was drafted with AI assistance from my own notes and code.

📰 Read the original article on Dev.to WebDev

Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.