)
}
}
)
(
}
{
)
)
(
)
(
(
{
}
)
(
)
}
)
)
{
(
(
)
)
}
)
(
}

### Fast Sine and Cosine Approximation

1. `let t = 0, cos, sin, x, y;`
2. ` `
3. `const PI = Math.PI;`
4. `const TWO_PI = PI * 2;`
5. `const HALF_PI = PI / 2;`
6. `const tA = 4 / PI;`
7. `const tB = 4 / PI ** 2;`
8. ` `
9. `const canvas = document.body.appendChild(document.createElement('canvas'));`
10. `const c = canvas.getContext('2d');`
11. `canvas.width = canvas.height = 300;`
12. ` `
13. `function loop() {`
14. `  // low precision sine/cosine`
15. `  // always wrap input angle to -PI..PI`
16. `  t += 0.1;`
17. `  if (t < -PI) {`
18. `    t += TWO_PI;`
19. `  } else if (t > PI) {`
20. `    t -= TWO_PI;`
21. `  }`
22. ` `
23. `  // compute sine`
24. `  if (t < 0) {`
25. `    sin = tA * t + tB * t * t;`
26. `  } else {`
27. `    sin = tA * t - tB * t * t;`
28. `  }`
29. ` `
30. `  // compute cosine: sin(t + PI/2) = cos(t)`
31. `  t += HALF_PI;`
32. `  if (t > PI) {`
33. `    t -= TWO_PI;`
34. `  }`
35. ` `
36. `  if (t < 0) {`
37. `    cos = tA * t + tB * t * t;`
38. `  } else {`
39. `    cos = tA * t - tB * t * t;`
40. `  }`
41. ` `
42. `  t -= HALF_PI; // move the shape`
43. ` `
44. `  x = 110 + 100 * cos;`
45. `  y = 110 + 100 * sin;`
46. ` `
47. `  c.fillStyle = 'rgba(100, 100, 20, .5)';`
48. `  c.fillRect(x, y, 10, 10);`
49. `  window.requestAnimationFrame(loop);`
50. `}`
51. `loop();`

This is an old trick for fast sine/cosine approximation. I learned about it from Michael Baczynski’s blog which now seems to be down. Here is a wayback link for the original article and another one to a more in-depth discussion about it:
original post