1838620 - Simplify properties used by breakpoint React Components

Status: RESOLVED FIXED

(DevTools :: Debugger, task)

Description

[Alexandre Poirot [:ochameau]]

The properties passed from redux mapStateToProps are updated too frequently.
We could simplify them to reduce the number of times we are trying to re-render these components.

Comment 1

[Alexandre Poirot [:ochameau]]

Attachment: Bug 1838620 - [devtools] Reduce the number of updates for the Breakpoint React component. r=#devtools-reviewers

Move these props to each individual breakpoint component which happens to be connected component.
So that's easy for them to query selectors.
While doing this, stop exposing an arrow function as property as it forces to re-render on any state change.

Also, avoid doing computation on top of selector's output within the React component,
this will prevent a few unecessary re-renders thanks to redux.

Comment 2

[Alexandre Poirot [:ochameau]]

Attachment: Bug 1838620 - [devtools] Avoid some useless React component updates. r=#devtools-reviewers

• Avoid useless update to top level App component when changing the selected location.
• Stop passing delay from WhyPaused parent as it is a connected component and can query the selectors itself.
• Also avoid various useless updates to SecondaryPanes/index which is also a top level component:
  when changing the selected source and frame for ex.

Comment 3

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/6df0435bdd1b
[devtools] Reduce the number of updates for the Breakpoint React component. r=devtools-reviewers,bomsy
https://hg.mozilla.org/integration/autoland/rev/7e4a15bf9219
[devtools] Avoid some useless React component updates. r=devtools-reviewers,bomsy

Comment 4

[amarc]

https://hg.mozilla.org/mozilla-central/rev/6df0435bdd1b
https://hg.mozilla.org/mozilla-central/rev/7e4a15bf9219