virtualization Premium

Whether to only render the rows and columns currently visible in the scroll viewport.

Enabling virtualization dramatically improves performance when a calendar has a large number of resources. Instead of rendering every row and column up front, only those within (or near) the visible scroll area are rendered. As the user scrolls, rows and columns that leave the viewport are removed from the DOM and newly visible ones are rendered.

const calendar = new Calendar(calendarEl, {
  initialView: 'resourceTimelineDay',
  virtualization: true,
  resources: [
    // your large resource list
  ]
});

This setting currently only applies to Timeline view when it displays resources, with support for other views planned. Read more about virtual rendering, including which views support it and how it interacts with scrolling and printing.