primefaces / primefaces/primereact

All UITreeNode re-rendered when expanding/collapsing nodes

Open
#8,542 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Status: Needs Triage
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
  1. Run Lazy Tree demo https://primereact.org/tree/#lazy
  2. 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

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.