Closed Bug 1688571 Opened 9 months ago Closed 8 months ago

[Translate] Clicking anywhere negatively affects performance

Categories

(Webtools Graveyard :: Pontoon, defect, P3)

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: julenx, Assigned: julenx)

References

Details

Attachments

(12 files)

44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review
44 bytes, text/x-github-pull-request
Details | Review

Every element making use of react-onclickoutsde via the handleClickOutside handler function forcedfully re-renders. While arguably some of the re-renders could be seen as not causing harm, the reality is everything adds up, and in some cases the re-renders also have other side-effects that delay things even more (e.g. updateFiltersFromURLParams in FiltersPanel takes ~3ms on every click in my machine).

The affected components could be made 'pure', i.e. make them shallow-compare props and state to determine if they should re-render. Another option is reworking the existing implementation of components relying on click-outside behavior so that the click-outside-specific behavior only activates when popover/modal/layered elements are rendered.

I'm more fond of this latter solution because it avoids the extra renders by design, and not by the virtue of implementing a framework escape hatch.

FWIW, I agree that the second approach seems better. :-)

Priority: -- → P3
Status: ASSIGNED → RESOLVED
Closed: 9 months ago
Resolution: --- → FIXED

Looks like we broke the ability to close the Resource menu when clicking outside of it:
https://github.com/mozilla/pontoon/pull/1840

Status: RESOLVED → REOPENED
Resolution: FIXED → ---

The main div didn't have the ref attached, I'll provide a fix in a PR.

Status: REOPENED → RESOLVED
Closed: 9 months ago8 months ago
Resolution: --- → FIXED
Product: Webtools → Webtools Graveyard
You need to log in before you can comment on or make changes to this bug.