Skip to content

[BUG] Slow unmount with many usages / larger component tree #339

@hejtmii

Description

@hejtmii

Describe the bug
When HotKeys component gets unmounted, it internally calls this line of code

this.logger.verbose(this.logger.nonKeyEventPrefix(componentId), 'De-registered component. Remaining component Registry:\n', "".concat(printComponent(this.componentTree.toJSON())));

Even that .verbose is noop, the serialization of the component tree is non-trivial with larger component tree and many instances of HotKeys are consuming a lot of browser resources.

Here is a screenshot from the profiler spammed with printComponent calls

image

How are you using react hotkeys components? (HotKeys, GlobalHotKeys, IgnoreKeys etc)
We use HotKeys and GlobalHotkeys on multiple components, some of them are very large (e.g. rich text editor)

Expected behavior
I would expect more lazy logging, not calling such costly operations when the logging is disabled

Platform (please complete the following information):

  • react-hotkeys 2.0.3 (but same code is in 2.0.4)
  • Chrome
  • Windows

Are you willing and able to create a PR request to fix this issue?
I could, but I would first like to discuss some best practice how to do that

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions