Repository navigation
Conversation
Signed-off-by: Guillaume LADORME <gladorme@gmail.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Split out of #319 to ease review (independent from the other split PRs, based on
main).Make hovering charts cheaper.
useChartTooltipDatahook: reads the ECharts instance only for the active cursor, throttles React updates to one per animation frame, and skips the update when nearby series are unchanged.TimeChartTooltipuses it instead of auseLayoutEffect+setStateon every mouse move.nearby-series: the sorted timestamp list (used for bar bandwidth) is only computed when bar series are present.PanelFocusProvider: split into an actions context and a focused-panel-key context so components that only set/clear focus no longer re-render when the focused panel changes on hover.useChartTooltipData,TooltipContentandPanelFocusProvider.Validation on this branch:
npm run lint,npm run format:check,npm run type-checkandnpm run testall pass.Performance, base vs. PR
I ran the same benchmark against the base version and the PR version of the changed files. The tooltip runs used the real
TimeChartTooltipandgetNearbySeriesDatawith a fake ECharts chart, 20 series × 720 points, and 300 mouse moves over one panel.getNearbySeriesDatacallsgetNearbySeriesDataalone, line-only data (3 runs)The number of ECharts highlight actions per computed frame is the same, so highlighting still happens for every frame that's computed. Timings come from jsdom, so treat them as rough. The commit and call counts are exact.
TimeSeriesChartBasein the plugin starts withshowTooltip=true, so every time-series panel mounts a tooltip. On base, each of them re-rendered on every mouse move anywhere on the page; now they do nothing.TooltipContent,SeriesInfo) is skipped when the nearby series haven't changed.GridItemContent) re-rendered each time the hovered panel changed.Screenshots
No visual change.
Checklist
[<catalog_entry>] <commit message>naming convention using one of thefollowing
catalog_entryvalues:FEATURE,ENHANCEMENT,BUGFIX,BREAKINGCHANGE,DOC,IGNORE.UI Changes
See e2e docs for more details. Common issues include: