perf: replace recharts with visx

[VIKTORVAV99]

Issue

Recharts is incredibly bloated and can't be tree-shaked.

Description

Replaces Recharts with visx which means the bundle size are reduced from 346 Kb to 40 Kb (which is then inlined instead), we have to sacrifice the animations for this, at least in this first version.

visx does support react animation libraries but considering there is a lag in our current animations I decided to skip it and wait for feedback before doing any work on it. Some of our users don't like the animations either so we might not need them at all, related to: #5996

Double check

• I have run pnpx prettier@2 --write . and poetry run format in the top level directory to format my changes.

[madsnedergaard]

I personally don't think this is the right solution to go. Let's remember that visiting the app loads 5.9 MB, so I don't think it's worth losing the animations to save 300kb.

For the "I don't like animations" part, I'd much rather support the "reduced motion" setting for those people and then generally try to make a more engaging and visually interesting experience for everyone else :)

[madsnedergaard]

With that said Visx might be the way to go for all of our charts in the future, but I think we should make that move more consciously and consider all options (and potential downsides).

[VIKTORVAV99]

I personally don't think this is the right solution to go. Let's remember that visiting the app loads 5.9 MB, so I don't think it's worth losing the animations to save 300kb.

For the "I don't like animations" part, I'd much rather support the "reduced motion" setting for those people and then generally try to make a more engaging and visually interesting experience for everyone else :)

Currently the app size sits at 4300 kb (excluding images but including all translations) and removing 300kb of a "index bundle" (which is what it is even if we split it out with manual chinking for parallel downloads) is pretty major considering vite warns as soon as they go over 500kb.

As for the animations I can directly add them here but honestly I don't like that this is the only part that is animated more or less. And would like to apply it to all charts if we want to include animation.

I also think the tooltip looks better without animations and currently they make the app seem laggy, but I realise this is a personal preference.

[VIKTORVAV99]

@madsnedergaard visx has a package for using react-spring (which we already include in the bundle so should be no size increases) so I'm going to update the PR to use that which brings back the animations.