Why this matters
Rock paper scissors is often dismissed as a children's game, but it serves as a practical demonstration of probability, randomness quality, and decision-making under uncertainty. The quality of the random number generator matters more than most people realize — a biased generator would make one choice more likely and give the computer an unfair edge, even if the bias is subtle.
This implementation uses `crypto.getRandomValues` to select the computer's move, which draws from the operating system's cryptographic entropy pool. This is the same randomness source used for generating encryption keys and secure tokens. Compared to `Math.random()`, which is seeded and theoretically predictable, `crypto.getRandomValues` provides true non-deterministic randomness that cannot be anticipated or exploited.
The tracking features — win rate, streak counter, and running win-loss-draw totals — turn a simple game into a tool for observing probability in action. Over hundreds of rounds, your win rate should converge toward 33.3 percent if the game is fair. Deviations from that baseline are normal in the short term but should shrink as the sample grows.
Game mechanics at a glance
| Feature | Detail |
|---|---|
| Randomness source | crypto.getRandomValues |
| Choices | Rock, Paper, Scissors |
| Win rate formula | Wins divided by (wins + losses + draws) |
| Streak tracking | Current consecutive win streak |
| Animation duration | ~700ms cycling before reveal |
| Score persistence | Session only (tab close resets) |
How to use it
Click the Rock, Paper, or Scissors button to make your move for the current round.
Watch the computer's choice cycle through all three options for about 700 milliseconds before landing on its actual pick.
The round result — win, loss, or draw — appears immediately along with updated totals and win rate.
Your current win streak is displayed and resets to zero whenever you lose or draw.
Click the Reset button at any time to clear all scores and start a fresh session.
Testing your result
Play 30 rounds as fast as you can, deliberately picking the same choice every time (for example, always Rock). Record your results and check whether the computer's responses are distributed roughly evenly — you should see roughly 10 wins, 10 losses, and 10 draws if the randomness is fair. Any severe imbalance over 30 rounds would indicate a problem with the generator.
Check the win rate calculation manually. After 10 rounds with 4 wins, 3 losses, and 3 draws, the win rate should be 4 divided by 10, which is 40 percent. Verify that the displayed percentage matches. Then test the streak counter by winning three rounds in a row and confirming the streak shows 3, then losing one round and seeing it reset to 0.
Common mistakes
Believing you can develop a winning strategy against true randomness — over a large sample, no pattern beats 33.3 percent.
Expecting the score to persist after closing the browser tab or refreshing the page.
Misinterpreting short-term streaks as evidence of bias — a run of 5 losses in a row is unlikely but perfectly possible with fair randomness.
Assuming the computer adapts to your play style; this implementation makes a fresh random choice every round with no memory of previous moves.
Edge cases and options
The animation that cycles through choices before revealing the computer's pick is purely cosmetic. The actual random selection happens after the animation completes, so watching the cycling pattern provides zero information about the final result. This design prevents players from trying to time their click based on the animation sequence.
The win rate denominator includes draws, which means a session with many draws will show a lower win percentage than one where every round is decided. This is a deliberate choice — it reflects your overall success rate across all rounds played. If draws were excluded from the denominator, the win rate would only measure decided rounds and could mislead you into thinking you were performing better than you are.
Real-world use cases
A teacher using the game as a classroom probability demonstration, having students record 100 rounds and compare the observed distribution to the theoretical 33.3 percent.
A team lead running a quick rock paper scissors round to settle a lighthearted dispute about who takes on an unpopular task.
A developer verifying that `crypto.getRandomValues` is available and functioning correctly in a new browser environment.
Frequently asked questions
Q: Is the computer's pick truly random?
A: Yes. Each round uses `crypto.getRandomValues` to pick one of three options with equal probability. The computer does not learn from or react to your previous moves, so no strategy can exploit it.
Q: Can the computer be beaten consistently?
A: Against true randomness, no strategy achieves better than 33 percent win rate over time. Humans are bad at being random, so patterns can be exploited against human opponents — but this computer plays fair.
Q: What is the win rate based on?
A: It is wins divided by total rounds (wins plus losses plus draws). Draws are included in the denominator so the percentage reflects your share across all rounds played.
Q: Why does the computer choice animate before revealing?
A: The cycling animation runs for about 700 milliseconds to build suspense. The final pick is decided only after the animation ends, so the visual sequence never reveals or biases the actual result.
Q: Is my score saved between sessions?
A: No. The score exists only in the current browser tab. Closing or refreshing resets everything to zero.
Q: Does the game work on mobile devices?
A: Yes. The buttons are sized for touch input and the layout collapses to a single column at narrow widths for comfortable mobile play.
Start using it now
Try the Rock Paper Scissors tool. See also Coin Flip, Dice Roller, and Wheel Spinner.
