📊 Floating Point Precision Visualizer

Understand floating point arithmetic and precision issues.

Number 1

Number 2

Result

0.30000000000000004

Actual Result

0.3

Expected Result

⚠️ Precision loss detected!

Famous Floating Point Examples

0.1 + 0.2

= 0.30000000000000004

The classic JavaScript floating point issue

0.1 + 0.2 === 0.3

false

Binary can't represent 0.1 exactly

0.1 * 10

= 1

Some operations work correctly

9007199254740992 + 1

= 9007199254740992

Beyond MAX_SAFE_INTEGER

Why This Happens

🔢 Binary Representation

Computers store numbers in binary (base 2), but not all decimal numbers can be represented exactly in binary.

Just like 1/3 = 0.333... in decimal, 0.1 = 0.0001100110011... in binary (repeating).

📏 IEEE-754 Standard

JavaScript uses 64-bit double-precision floating point (IEEE-754):

1 bit: Sign
11 bits: Exponent
52 bits: Mantissa (precision)

💡 Solutions

Use integers for money (cents, not dollars)
Round results: +(0.1 + 0.2).toFixed(2)
Use epsilon comparison: Math.abs(a - b) < Number.EPSILON
Use libraries like decimal.js or big.js

Using Number.EPSILON

function areClose(a, b) {
  return Math.abs(a - b) < Number.EPSILON;
}

areClose(0.1 + 0.2, 0.3); // true ✓

Number.EPSILON = 2.220446049250313e-16 (smallest difference between 1 and the next representable number)