Perf: panel rerenders

[ahrefabhi]

📄 Summary

Fixes performance issues causing unnecessary re-renders of dashboard panels on user interactions. Stabilizes click handlers and optimizes component memoization to eliminate rendering lag across dashboards, metrics views, and graph components.

---

✅ Changes

Core Performance Fixes:

• Wrapped PanelWrapper with React.memo using deep equality comparison (isEqual) to prevent re-renders when props have identical content
• Memoized chartData in UplotPanelWrapper to avoid recalculation on every render
• Used useRef in useResolveQuery to stabilize mutateAsync callback dependencies

Dashboard Widgets (WidgetGraphComponent):

• Memoized initial graphVisibility state and derived flags
• Wrapped handlers in useCallback: onDelete, onClone, onView, modal toggles, graphClickHandler
• Unified click handler logic with stable clickHandler reference

Graph Components:

• Celery Task Graph: Memoized onGraphClick and created dedicated handlers per state (onAllStateClick, onFailedStateClick, onRetryStateClick, onSuccessStateClick)
• Metrics External Tab: Extracted and memoized 4 graph-specific click handlers (error %, duration, RPS, duration by address)
• Messaging Queues: Memoized onClickHandler with stable callback

---

Note

Optimizes dashboard and metrics graphs by memoizing components/data and stabilizing click handlers to prevent unnecessary re-renders and improve responsiveness.

• Performance:
  • Wrap PanelWrapper with React.memo using custom arePropsEqual (deep-compare widget and queryResponse.data.payload).
  • Memoize chartData in UplotPanelWrapper and related options dependencies.
  • Stabilize mutateAsync usage in useResolveQuery via useRef to trim useCallback deps.
• Dashboard Widgets (WidgetGraphComponent):
  • Memoize isGraphClickButtonEnabled; unify clickHandler with stable useCallback.
  • Convert handlers to useCallback: delete/clone/view, modal toggles, toggle model, graph click.
• Graph Components:
  • Celery Task Bar: memoized onGraphClick; add dedicated onAllStateClick/onFailedStateClick/onRetryStateClick/onSuccessStateClick.
  • Metrics External tab: extract and memoize click handlers for error %, duration, RPS by address, and duration by address.
  • Messaging Queues graph: memoize onClickHandler.

^{Written by Cursor Bugbot for commit 346be7b. This will update automatically on new commits. Configure here.}

[cursor]

This is the final PR Bugbot will review for you during this billing cycle

Your free Bugbot reviews will reset on December 3

Details

Your team is on the Bugbot Free tier. On this plan, Bugbot will review limited PRs each billing cycle for each member of your team.

To receive Bugbot reviews on all of your PRs, visit the Cursor dashboard to activate Pro and start your 14-day free trial.

[srikanthccv]

Checking...

[srikanthccv]

it seems to behaving differently on test data vs real-world data, we are testing more about it.

[srikanthccv]

Disregard my last comment. Took a latest pull and reviewing again.

[srikanthccv]

We will get this merged. I have noted some questions about the hooks and their current functionality and implications on perf but we will come back to them later.