Performance improvements (Node Instances)

[SerhiiTsybulskyi]

PR Checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)
• Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

[ ] Bugfix
[x] Feature
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Documentation content changes
[ ] Other... Please describe:

What is the current behavior?

Issue Number: N/A

What is the new behavior?

Does this PR introduce a breaking change?

[ ] Yes
[x] No

Other information

Added the ability to use Instances for Nodes. useInstances can be used to enable rendering nodes using instances.
It was added as a separate flag to have the ability to improve performance, smooth and step by step, without breaking the main functionality.

The next performance improvements were made.

• Used Instances for Sphere, Icon, Ring
• Optimised Node Text Rendering to hide text when it is so far from the camera or display text only for visible nodes (is within sight)
• Added the ability to override instances by using the renderInstances callback
• Updated the accuracy of the simulation to make it faster when nodes is more than 1000
• Instances support the next features
  • Selection
  • Selection via lasso
  • Dragging, (Single and Multiply)
  • Highlighting
  • Context Menu and Collapse/Expand feature
  • Animation

Performance comparison with 5000 nodes and 1000 edges:

By using instances approach

There are some thoughts about future steps for optimisation:

• Find a way to optimise rendering of edges
• Updates via the Zustand store aren't fast; need to think about alternative ways.
• Using LOD (Level of details for basic components [sphere, ring, icon])

[netlify]

✅ Deploy Preview for reagraph ready!

Name	Link
🔨 Latest commit	e7ed6ce
🔍 Latest deploy log	https://app.netlify.com/projects/reagraph/deploys/68a6eb262473f00008414fc6
😎 Deploy Preview	https://deploy-preview-356--reagraph.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[amcdnl]

I need to spend some time to review the viability of this. Please pause on additional efforts for now.