1761510 - Minimize number of rendered elements in the react app

Status: RESOLVED FIXED

(DevTools :: Console, task)

Description

[Nicolas Chevobbe [:nchevobbe]]

Looking at the generated html, it looks like we could skip rendering some items.
Hopefully this will help a bit with reflow/styling/overall react perf when we have virtualization and the user scrolls

Comment 1

[Nicolas Chevobbe [:nchevobbe]]

Attachment: Bug 1761510 - [devtools] Remove frame-link-source-inner element in Frame component. r=bomsy.

This simplifies the markup a bit, and hopefully could contribute to improve
layout and styling performance in the console.

Comment 2

[Nicolas Chevobbe [:nchevobbe]]

Attachment: Bug 1761510 - [devtools] Remove extra element for console message location. r=bomsy.

we directly use what's returned from the Frame component. We allow to pass
an extra className prop to it so we can still add the message-location class
that is used in the console.

Depends on D142096

Comment 3

[Nicolas Chevobbe [:nchevobbe]]

Attachment: Bug 1761510 - [devtools] Don't render indent element when it's not needed. r=bomsy.

We move the data-indent attribute to the message element so tests can still
query it.

Depends on D142097

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/ed4ffad462db
[devtools] Remove frame-link-source-inner element in Frame component. r=bomsy.
https://hg.mozilla.org/integration/autoland/rev/6091dcc3f6dd
[devtools] Remove extra element for console message location. r=bomsy.
https://hg.mozilla.org/integration/autoland/rev/b03663297f1f
[devtools] Don't render indent element when it's not needed. r=bomsy.

Comment 5

[Natalia Csoregi [:nataliaCs]]

https://hg.mozilla.org/mozilla-central/rev/ed4ffad462db
https://hg.mozilla.org/mozilla-central/rev/6091dcc3f6dd
https://hg.mozilla.org/mozilla-central/rev/b03663297f1f