Live Chat Icon For mobile
Live Chat Icon
Popular Categories.NET  (150).NET Core  (25)Angular  (46)ASP.NET  (48)ASP.NET Core  (61)ASP.NET MVC  (84)Azure  (28)Blazor  (84)DocIO  (19)Essential JS 2  (68)Essential Studio  (162)Flutter  (97)JavaScript  (146)Microsoft  (101)PDF  (57)React  (32)Succinctly series  (120)Syncfusion  (464)TypeScript  (30)Uno Platform  (2)UWP  (4)Vue  (26)Webinar  (21)Windows Forms  (54)WPF  (113)Xamarin  (124)XlsIO  (24)Other CategoriesBarcode  (4)BI  (29)Bold BI  (3)Build conference  (6)Business intelligence  (53)Button  (4)C#  (105)Chart  (48)Cloud  (9)Company  (445)Dashboard  (6)Data Science  (3)Data Validation  (3)DataGrid  (41)Development  (248)Doc  (7)DockingManager  (1)eBook  (91)Enterprise  (22)Entity Framework  (5)Essential Tools  (14)Excel  (19)Extensions  (12)File Manager  (4)Gantt  (8)Gauge  (6)Git  (4)Grid  (26)HTML  (9)Installer  (2)Knockout  (2)LINQPad  (1)Linux  (1)M-Commerce  (1)Metro Studio  (11)Mobile  (205)Mobile MVC  (9)OLAP server  (1)Open source  (1)Orubase  (12)Partners  (21)PDF viewer  (21)Performance  (5)PHP  (1)PivotGrid  (4)Predictive Analytics  (6)Report Server  (3)Reporting  (10)Reporting / Back Office  (11)Rich Text Editor  (5)Road Map  (9)Scheduler  (23)SfDataGrid  (8)Silverlight  (21)Sneak Peek  (16)Solution Services  (2)Spreadsheet  (7)SQL  (7)Stock Chart  (1)Surface  (4)Tablets  (5)Theme  (9)Tips and Tricks  (54)UI  (113)Uncategorized  (68)Unix  (2)User interface  (68)Visual State Manager  (1)Visual Studio  (18)Visual Studio Code  (10)Web  (189)What's new  (120)Windows 8  (19)Windows App  (1)Windows Phone  (15)Windows Phone 7  (9)WinRT  (26)
Share on twitter
Share on facebook
Share on linkedin
What’s New in 2021 Volume 2: Blazor Scheduler

What’s New in 2021 Volume 2: Blazor Scheduler

The Blazor Scheduler is a versatile event calendar component that helps users manage their time efficiently. It facilitates easy resource scheduling and the rescheduling of events or appointments through editor pop-ups, drag and drop, and resizing actions. In this blog post, I’ll quickly introduce the new features included in the Blazor Scheduler component for the 2021 Volume 2 release.

Performance improvement

We have improved the initial rendering performance of our Scheduler by 25% in the Blazor Server and WebAssembly app in this 2021 Volume 2 release. However, we suggest you define the required ScheduleView to get better performance.

Refer to the following code example.

<SfSchedule TValue=AppointmentData @bind-CurrentView="@CurrentView">
    <ScheduleViews>
        <ScheduleView Option="View.Day"></ScheduleView>
        <ScheduleView Option="View.Week"></ScheduleView>
        <ScheduleView Option="View.Month"></ScheduleView>
    </ScheduleViews>
</SfSchedule>
@code {
    View CurrentView = View.Day;
    public class AppointmentData
    {
        public int Id { get; set; }
        public string Subject { get; set; }
        public string Location { get; set; }
        public DateTime StartTime { get; set; }
        public DateTime EndTime { get; set; }
        public string Description { get; set; }
        public bool IsAllDay { get; set; }
        public string RecurrenceRule { get; set; }
        public string RecurrenceException { get; set; }
        public Nullable<int> RecurrenceID { get; set; }
    }
}

Performance metrics

The following metrics were taken after rendering 3,000 appointments without resource grouping.

Schedule ViewImprovement in Volume 2 as compared to Volume 1 (using .NET 5)
Day~+67%
Week~+50%
Workweek~+60%
Month~+30%
Agenda~+50%
Month Agenda~+50%
Year~+33%
Timeline Day~+17%
Timeline Week~+36%
Timeline Workweek~+42%
Timeline Month~+19%
Timeline Year~+18%

The following metrics were taken after rendering 3,000 appointments with 100 resources.

Schedule ViewImprovement in Volume 2 as compared to Volume 1 (using .NET 5)
Day~+25%
Week~+22%
Workweek~+15%
Month~+41%
Agenda~+33%
Month Agenda~+57%
Year~+18%
Timeline Day~+30%
Timeline Week~+52%
Timeline Workweek~+46%
Timeline Month~+57%
Timeline Year~+40%

Note: Even though we have improved the performance of our Blazor Scheduler at the source level, we should avoid some Blazor WebAssembly related functionalities while using the Scheduler events. For more information, refer to the WebAssembly performance in Blazor Scheduler component documentation.

Adaptive layout

This feature enables rendering a mobile-adaptive layout on desktop devices. It also lets you render a desktop view on mobile devices. If we render the Scheduler component in space-constrained areas, this feature helps enhance its view experience.

Set the EnableAdaptiveUI property to true to display the mobile view of the Scheduler on desktop devices.

In this 2021 Volume 2 release, we made these changes default in the Blazor Scheduler to render it on desktop devices:

  • View options displayed in the navigation drawer.
  • Plus icon in the header for new event creation.
  • Today icon in the header instead of the Today button.
  • Multiple resources: We show only one resource to enhance the viewer experience of resource events details. To switch to other resources, there is a tree view on the left that lists all the other available resources. Clicking on this will display the particular resource and its related events.
Adaptive Layout Support in Blazor Scheduler
Adaptive Layout Support in Blazor Scheduler                 

Note: For more information, refer to the Example of adaptive grouping in the Blazor Scheduler component and Adaptive UI in desktop documentation.

Year view interval support

The year view displays all the months and their related appointments for a particular year. From the 2021 Volume 2 release onward, you can customize the number of months to be displayed in a year and timeline year views in the Blazor Scheduler.

For example, you can show the months of a quarter in the Scheduler by setting the MonthsCount property to 4.

You can also customize the Blazor Scheduler like in the following screenshot, which displays months from April 2020 to September 2021.

Custom Year View Intervals in Blazor Scheduler
Custom Year View Intervals in Blazor Scheduler

Note: For more information, refer to the Example of year view in the Blazor Scheduler component and Show half-yearly view in Blazor Scheduler component documentation.

Print

Previously, you could print only the appointments visible in the viewport of an agenda view. Now, you can print all the appointments with custom options in the agenda view.

You can print the Scheduler layout by using the PrintAsync method. This feature also allows you to customize the width and height of the element.

Note: For more information, refer to the Example of printing in Blazor Scheduler Component and How to print the Scheduler element documentation.

Summary

Thanks for reading! In this blog, we have seen a quick overview of some of the major features included in our Blazor Scheduler in the 2021 Volume 2 release. To see all the updates in this release, please check our Release Notes and What’s New pages. Try out these new features and leave your feedback in the comments section!

For current customers, the new version is available for download from the License and Downloads page. If you are not yet a Syncfusion customer, you can start a 30-day free trial to check out these features.

Also, you can reach us through our support forumsDirect-Trac, or feedback portal. We are always happy to assist you!

Related blogs

Tags:

Share this post:

Share on twitter
Share on facebook
Share on linkedin
Popular Now

Be the first to get updates

Subscribe RSS feed
Scroll To Top