Closed Bug 1761510 Opened 2 years ago Closed 2 years ago

Minimize number of rendered elements in the react app

Categories

(DevTools :: Console, task)

task

Tracking

(firefox100 fixed)

RESOLVED FIXED
100 Branch
Tracking Status
firefox100 --- fixed

People

(Reporter: nchevobbe, Assigned: nchevobbe)

References

Details

(Whiteboard: dt-console-perf-2022)

Attachments

(3 files)

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

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

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

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

Depends on D142097

Pushed by nchevobbe@mozilla.com:
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.
Status: ASSIGNED → RESOLVED
Closed: 2 years ago
Resolution: --- → FIXED
Target Milestone: --- → 100 Branch
Regressions: 1804384
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: