front: d3 performances

[anisometropie]

Improving d3 general performance during interactions with the main charts and map.

timePosition and positionValues are now removed from the store and now handled in a separate class ChartSynchronizer. These two values are now completely seperate from redux and react life cycle, which alleviates quite some unnecessary workload and re-renders.

Second source of improvement: memoization of the function interpolateOnTime, which is called on every mouse move on the charts.

closes #6105

[codecov]

Codecov Report

Attention: 248 lines in your changes are missing coverage. Please review.

Comparison is base (935ab88) 26.69% compared to head (c0ab994) 26.74%.

Files	Patch %	Lines
...esult/components/ChartHelpers/ChartSynchronizer.ts	52.38%	45 Missing and 5 partials ⚠️
...mulationResult/components/SimulationResultsMap.tsx	0.00%	22 Missing ⚠️
...dules/simulationResult/components/TrainDetails.tsx	0.00%	20 Missing and 1 partial ⚠️
...ult/components/SpeedSpaceChart/SpeedSpaceChart.tsx	0.00%	20 Missing ⚠️
...t/src/common/Map/WarpedMap/SimulationWarpedMap.tsx	0.00%	19 Missing ⚠️
...tionResult/components/ChartHelpers/ChartHelpers.ts	78.31%	2 Missing and 16 partials ⚠️
.../simulationResult/components/TimeLine/TimeLine.tsx	0.00%	18 Missing ⚠️
...esult/components/SpaceTimeChart/SpaceTimeChart.tsx	0.00%	17 Missing ⚠️
...odules/simulationResult/components/TimeButtons.tsx	0.00%	17 Missing ⚠️
.../simulationResult/components/SpaceCurvesSlopes.tsx	0.00%	13 Missing ⚠️
... and 15 more

Additional details and impacted files

@@             Coverage Diff              @@
##                dev    #6108      +/-   ##
============================================
+ Coverage     26.69%   26.74%   +0.04%     
  Complexity     2139     2139              
============================================
  Files           931      932       +1     
  Lines        123484   123547      +63     
  Branches       2682     2690       +8     
============================================
+ Hits          32968    33044      +76     
+ Misses        88918    88897      -21     
- Partials       1598     1606       +8     

Flag	Coverage Δ
core	78.87% <ø> (ø)
editoast	74.99% <ø> (-0.01%)	⬇️
front	9.47% <37.21%> (+0.07%)	⬆️
gateway	2.55% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[sim51]

It's really more fluid than before, well done !

From what I see, it's not related to D3 itself, but to redux. You replaced the redux stack with a manual observable, which works good .

But like you said in your comment, it's outside the react lifecycle, and it's the first time that such a pattern (singleton + custom observable) is used in the stack, so a front leader must take a look at it.

In react style, I would have created a context shared by all the component, with a custom hook.

[clarani]

Left some comments, awesome job :)

[clarani]

LGTM, tested ✅

[Math-R]

LGTM nice job <3

[nicolaswurtz]

@sim51 you're right, we've discussed about it and we decide that the gain worth it now. In a few weeks, as we say together, we'll rewrite all the component and the time synchronization between graphs, this "code style exception" will be lost.
For now, it's a very good and useful work! Thx again @anisometropie