tldraw/packages/editor/src
Mime Čuvalo 273ba62e0e
perf: calculate hypoteneuse manually instead of using hypot (#3468)
Something was bothering me a bit with the discussion around sqrt's being
slow. Looks like `Math.hypot` has a performance cost associated with it.

Looking at the Chromium source code:
https://chromium.googlesource.com/v8/v8/+/4.3.21/src/math.js?autodive=0%2F%2F#19
and

https://source.chromium.org/chromium/chromium/src/+/main:v8/src/builtins/math.tq;l=36?q=math&sq=&ss=chromium%2Fchromium%2Fsrc:v8%2Fsrc%2F

it looks like maybe we'd be avoiding the multiple arguments that can be
passed into Math.hypot which is maybe the source of the perf hit.

Also, interestingly in `math.tq` you can see it doing this funky sqrt
calculation: `Float64Sqrt((a / max) * (a / max) + (b / max) * (b / max))
* max` - I think that possibly is trying to avoid some overflow in some
cases with bigger numbers, but also possibly with a perf hit.

[edit]: OK, actually on Firefox, doing sqrt seems slower - but digging
more into this, it looks like doing `** 0.5` instead of `sqrt` is much
faster.

More related articles:
- https://stackoverflow.com/questions/71898044/why-is-math-hypot-so-slow
-
https://stackoverflow.com/questions/3764978/why-hypot-function-is-so-slow
-
https://www.reddit.com/r/javascript/comments/wk3e57/askjs_why_mathsqrt_is_so_slow_in_firefox/

[edit again!] looks like this is being fixed in the latest Chrome!
https://blog.seokho.dev/development/2024/03/18/V8-optimize-MathHypot.html

```
 ┌─────────┬───────┬─────────┬─────────┬─────────┬────────┐
    │ (index) │ Cold  │ Slowest │ Fastest │ Average │ Total  │
    ├─────────┼───────┼─────────┼─────────┼─────────┼────────┤
    │   old   │ 13.39 │  10.07  │  9.69   │  9.98   │ 998.57 │
    │  sqrt   │ 8.19  │  6.66   │  6.61   │  6.67   │ 667.6  │
    │ pow 0.5 │ 1.89  │  0.28   │  0.28   │   0.3   │ 29.79  │
    │   new   │ 1.64  │  0.28   │  0.28   │  0.29   │ 28.95  │
    └─────────┴───────┴─────────┴─────────┴─────────┴────────┘
```

### Change Type

<!--  Please select a 'Scope' label ️ -->

- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff

<!--  Please select a 'Type' label ️ -->

- [ ] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [x] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know
2024-04-15 18:45:30 +00:00
..
lib perf: calculate hypoteneuse manually instead of using hypot (#3468) 2024-04-15 18:45:30 +00:00
index.ts Stickies: release candidate (#3249) 2024-04-14 18:40:02 +00:00
version.ts Update CHANGELOG.md [skip ci] 2024-02-29 18:28:45 +00:00