react-postprocessing icon indicating copy to clipboard operation
react-postprocessing copied to clipboard

Performance-bug with `<Select />`

Open donalffons opened this issue 10 months ago • 0 comments

Hi and thank you for your fantastic work on this project.

I've just encountered what I believe is a performance bug with the <Select /> component. In this trivial example, I get a CPU usage of 100%:

<Canvas>
  <Selection>
    <Select enabled>
      <Box name="box" />
    </Select>
  </Selection>
</Canvas>

The react profiler says that the culprit is in the Selection / Select component: image

I see two issues with this component:

  1. this condition is always true, which is why a call to select is triggered every time this hook runs. In my case, this condition is always true for the <group /> inside the <Select /> component. But more generally, I think it would be true for every non-Mesh in the tree.
  2. here, the value of api is the "old" value, i.e. the value before api.select() was executed. Importantly, in my case, api.selected is always an empty array. Therefore, I believe the update of the selected objects shouldn't happen in a useEffect cleanup handler.

donalffons avatar Aug 12 '23 10:08 donalffons