Engineering notes
How the Trillionaire Spending Simulator Works
One balance, many small decisions
The spending simulator looks simple: press Buy, watch the balance fall, and press Sell to undo a purchase. The implementation has to keep several values synchronized on every click. The quantity on the product card, the remaining balance, the total spent figure, the sticky summary, the progress percentage, and the printed receipt must all describe the same cart.
I treat the cart as the source of truth. Each entry stores an item identifier and a whole-number quantity. The total is recalculated from item price multiplied by quantity, rather than independently changing several totals and hoping they remain aligned. This makes selling, resetting, restoring a saved game, and generating the receipt easier to verify.
Why the game uses whole dollars
Every game price is stored as an integer number of US dollars. That choice avoids decimal rounding problems and matches the way values are displayed. A five-dollar coffee is stored as 5, while a one-billion-dollar project is stored as 1000000000. Formatting happens only when the value is shown to the player.
Before a purchase is accepted, the game calculates the amount already spent and compares the item's price with the available balance. If the price is higher than the remaining amount, the purchase is rejected and the balance is unchanged. Sell is disabled when the quantity is zero, so a cart can never contain a negative quantity.
Saving progress without an account
The game does not require registration. The cart is saved in the browser's local storage after it changes and is restored on a later visit from the same browser. The stored value contains game quantities, not a name, email address, payment card, or real transaction.
Stored data is validated before it is used. Unknown item identifiers and invalid quantities are ignored instead of being allowed to corrupt the balance. Reset Game clears the saved cart and returns every game counter to its initial state.
Making a huge number feel responsive
A balance close to one trillion dollars is visually difficult to read, so the interface repeats the two most useful values: remaining money and total spent. The sticky summary keeps those values visible while the player moves through the product list. A timer begins with the first purchase and gives each run a simple challenge without changing the financial calculations.
The visible balance animates toward the new amount with requestAnimationFrame. Purchase and sale feedback is deliberately separate from the underlying cart calculation: the animation can be interrupted by rapid clicks, but the actual total still comes from the cart. This separation prevents visual effects from becoming accounting logic.
What I test after changing the cart
The most important checks are behavioral rather than cosmetic. I test buying the cheapest and most expensive available items, selling back to zero, attempting a purchase with insufficient funds, restoring a saved cart, resetting the game, and comparing the receipt total with the sticky balance.
- The remaining balance plus total spent must always equal the starting fortune.
- A disabled Buy or Sell button must not change the cart.
- Rapid clicks must create the correct quantity even when animations overlap.
- Refreshing the page must restore the same quantities on the same browser.
- The receipt line totals must equal price multiplied by quantity.