Syncfusion’s Blazor collection offers over 70 high-performance, lightweight, and responsive UI components, including file-format libraries, in a single package. The components work with Blazor server-side and client-side (Blazor WebAssembly) projects seamlessly. In this blog, I am going to walk you through the new astonishing features and control for Blazor in our 2021 Volume 2 release.
Now, you can enjoy Tailwind CSS theming support in all Syncfusion Blazor UI components. This provides more styles for elegantly designing a webpage.
You can check out each Blazor component’s design using the theme switcher on our website.
You can skip the built-in JavaScript isolation and load only the necessary scripts from the application end. This feature helps improve the initial load performance of the Blazor components.
You can refer to the scripts in any one of the following three ways:
<script src="_content/Syncfusion.Blazor/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>
<script src="https://cdn.syncfusion.com/blazor/19.2.44/syncfusion-blazor.min.js" type="text/javascript"></script>
Ignore JavaScript isolation in the ~/Startup.cs file | Usage |
services.AddSyncfusionBlazor(options => { options.IgnoreScriptIsolation = true; } | //_Host.cshtml //For Syncfusion Blazor overall Package <head> ... <script src="_content/Syncfusion.Blazor/scripts/syncfusion-blazor.min.js" type="text/javascript"></script> </head> //For Individual Package <head> ... <script src="Path for CRG generated script" type="text/javascript"></script> </head> |
Blazor WebAssembly (WASM):
Ignore JavaScript isolation in the ~/Program.cs file | Usage |
builder.Services.AddSyncfusionBlazor(options => { options.IgnoreScriptIsolation = true; } | //index.html //For Syncfusion Blazor overall Package <head> ... <script src="_content/Syncfusion.Blazor/scripts/syncfusion-blazor.min.js" type="text/javascript"></script> </head> //For Individual Package <head> ... <script src="Path for CRG generated script" type="text/javascript"></script> </head> |
Please find the details of the improvement made in our Blazor Scheduler in the following table.
In week view | Script isolation disabled | Script isolation enabled | Percentage improved |
Loading 1000 events without resource. | 2.3 seconds | 1.2 seconds | 48% |
Loading 1000 events with 30 resources. | 7.3 seconds | 3.4 seconds | 53% |
We have introduced a new version of the Blazor Diagram component that overcomes the current Diagram component’s limitations. We intend to keep the current Diagram component in maintenance mode and focus future development on the new one. We are confident that the new Blazor Diagram delivers better performance, especially in the Blazor WebAssembly (WASM) applications. Currently, the new Diagram component is in preview mode.
For more information, refer to the Example of Flow Chart in Blazor Diagram Component demo and Introducing the New Blazor Diagram Component blog.
Our Blazor DataGrid component receives these three major features in the 2021 Volume 2 release:
For more information, check out the Blazor DataGrid Frozen Virtualization demo.
We have put a lot of effort into improving the Blazor Scheduler’s initial rendering performance. It has been improved along with the resource configuration by 25% in the Blazor Server and WebAssembly apps. However, we suggest you define the required ScheduleView to get better performance.
Apart from these improvements, we have also added these features in the Blazor Scheduler in the 2021 Volume 2 release:
The Blazor Pivot Table has these user-friendly features in the 2021 Volume 2 release:
The Blazor Gantt Chart supports these new features in the 2021 Volume 2 release:
The Blazor Rich Text Editor provides various styles for the ordered and unordered lists in the 2021 Volume 2 release.
Ordered list:
Unordered list:
You can apply these list styles to the nested lists too.
You can check out the Blazor Rich Text Editor Component demo for more details.
The Blazor Document Editor (Word Processor) component focuses on preserving styles while handling document contents. You can make use of these new features from this release onward:
The Blazor Kanban allows you to freeze the swimlane row header while scrolling the Kanban content. With this feature, you can view the swimlane cards with a static header.
Check out the Swimlane in Blazor Kanban Component demo for more details.
From the 2021 Volume 2 release onward, the Blazor TreeGrid provides remote data binding support with virtualization.
For more details, check out the Example of Remote Data Binding in the Blazor Tree Grid Component.
Also, we have standardized the asynchronous functions with the suffix Async. You can read Microsoft’s asynchronous programming guidelines for more details.
Note: While introducing new functions, we have renamed a few methods with the function name. You can find those names in the release notes.
Our strategy for obsolete properties is to maintain them for a minimum of four releases to avoid compilation-related issues. So, we have removed all the obsolete properties introduced on or before the 2020 Volume 2 release.
Thanks for reading! In this blog post, we have seen the new, useful features in our Syncfusion Blazor components in the 2021 Volume 2 release. You can check out the list of all the features in our Release Notes and What’s New pages. Try these new, stunning features for yourself and share your feedback in the comments section of this blog post!
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 forums, Direct-Trac, or feedback portal. We are always happy to assist you!