primefaces / primefaces/primereact
All UITreeNode re-rendered when expanding/collapsing nodes
Nobody has claimed this yet.
- Dominant language
- CSS
- Stars
- 8.3k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Describe the bug
When expanding or collapsing nodes (also selecting etc.) nodes in the basic tree demo (https://primereact.org/tree/#basic) new UITreeNode will be created even for nodes which are not expanded/collapsed.
This is no problem for small trees, but adds significant rendering time in case of larger trees (e.g. 1000 root nodes).
Reproducer
https://stackblitz.com/edit/z6evqupr?file=src%2FApp.jsx
System Information
System:
OS: Windows 11 10.0.26100
CPU: (16) x64 12th Gen Intel(R) Core(TM) i7-1270P
Memory: 9.90 GB / 31.70 GB
Binaries:
Node: 24.14.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.21 - C:\Users\lgr9fe\AppData\Roaming\npm\yarn.CMD
npm: 11.6.3 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome: 148.0.7778.179
Edge: Chromium (144.0.3719.92)
Firefox: 140.11.0 - C:\Program Files\Mozilla Firefox\firefox.exe
Internet Explorer: 11.0.26100.8115
npmPackages:
primereact: latest => 10.9.8
react: 18.3.1 => 18.3.1
Steps to reproduce the behavior
- Run Lazy Tree demo https://primereact.org/tree/#lazy
- Observe new UITreeNode will be created for Node 0 when expanding Node 1
Expected behavior
UITreeNode should be only re-created / re-rendered if necessary (children expanded/collapsed, label changed, ...).
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by running the Lazy Tree demo and the linked StackBlitz reproducer, then inspect the tree component and UITreeNode rendering behavior. The fix is complete when expanding Node 1 does not recreate or rerender unaffected nodes such as Node 0, while necessary updates still occur for expanded, collapsed, or changed nodes.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 55/100