BALKAN OrgChart JS - JavaScript Org Chart Library | Docs

When You Don't Need Load on Demand ​

Why You Should Avoid Loading Data on Demand with OrgChart JS

When working with OrgChart JS, one of the tempting strategies is to load data on demand — meaning you only fetch and display parts of the chart as the user expands nodes. At first glance, this seems efficient: less data upfront, faster initial rendering, and the ability to scale to large datasets. But for small to medium-sized org charts (which covers most real-world organizations), it often creates more problems than it solves.

Let's go through why you should avoid loading OrgChart JS data on demand for typical use cases, and what you should do instead.

For Most Organizations, Load All Data Upfront ​

Most organizations have org charts with hundreds to a few thousand nodes. OrgChart JS is optimized to handle this range efficiently without any on-demand loading complexity. If your org chart fits this profile, you should simply load all data at once.

1. Loss of Built-in Features ​

OrgChart JS is designed with powerful features that require the full dataset in memory:

  • Search across all nodes
  • Export to PDF, PNG, SVG
  • Layout and auto-balance of the hierarchy
  • Drag-and-drop editing

Here's the key point: some of these out-of-the-box features simply won't work the same way when you load data on demand compared to when the entire chart is loaded. If you only load a fraction of the data on demand, these features either break or behave inconsistently.

2. Performance Is Already Optimized ​

One of the main reasons people consider on-demand loading is performance. But OrgChart JS is already optimized to handle thousands of nodes efficiently:

  • Virtual scrolling ensures smooth navigation — only visible nodes are in the DOM
  • Rendering is smart, only painting what's visible
  • Data structures are memory-friendly compared to DOM-heavy approaches

In other words: the chart doesn't actually render all nodes at once, even with all data loaded. You can safely load your entire dataset upfront without worrying about performance issues.

For small and medium-sized org charts — which is the vast majority of real-world use cases — loading data on demand creates unnecessary complexity without meaningful benefit.

Load all data upfront and let OrgChart JS do what it was built to do: efficiently handle org charts with full functionality intact.

Your users will thank you for a chart that works seamlessly — no missing pieces, no waiting for nodes to load, just the complete organizational picture at their fingertips.