Blazor Scheduler Example - Virtual Mask

This example illustrates how the virtual mask functionality works in virtual scrolling. All events in this example are loaded at the initial rendering of Scheduler, but only the events in the visible area are rendered. Here, the Scheduler dynamically loads 300 resources along with an events count of 3600 (300 resources × 12 events).

The Scheduler UI Mask virtualization allows it to render only the content area visible within the view-port without buffering the resource content. Here, the same set of DOM elements is re-used to improve performance. In this feature, a loading placeholder indicator is shown while loading new resources.

In this example, virtual scrolling and virtual mask options are enabled on the timeline month view to load a large number of resources and their associated events. To enable dynamic loading of events and resources in the timeline view of Scheduler, set the AllowVirtualScrolling and EnableVirtualMask properties to true within the view-specific settings.