How I built an Aim Trainer & Reaction Time Tester in Vanilla JS

javascript dev.to

As a developer who also plays competitive FPS games like Valorant and CS2, I wanted a lightweight way to warm up and test my mechanical skills. I couldn't find a clean, ad-free solution, so I built my own Aim Trainer & Reaction Time Tester.

The Approach

I built this entirely in Vanilla JS to ensure absolute minimum latency and maximum performance. No bulky frameworks, just raw DOM manipulation and precise timing.

Here is a quick look at how the core reaction time logic calculates the exact delay:

let startTime, endTime;

function spawnTarget() {
    // Random delay between 1-3 seconds
    const delay = Math.random() * 2000 + 1000;

    setTimeout(() => {
        renderTargetOnScreen();
        startTime = performance.now();
    }, delay);
}

function handleTargetClick() {
    endTime = performance.now();
    const reactionTime = Math.round(endTime - startTime);
    updateStats(reactionTime);
}
Enter fullscreen mode Exit fullscreen mode

Try it out

You can use the live tool for free here: Aim Trainer & Reaction Time Tester

Let me know what your best reaction time is in the comments!

Source: dev.to

arrow_back Back to Tutorials