How to Rendering Appointments on server-side
Hi everyone
I am using .NET 8 with Blazor, interactive mode WebAssembly. I get the Scheduler to pre-render on server, but not with any content (appointments). Is this even possible somehow or is this not supported. Content will render after WASM is initialized, but not before.
I am thankful for every helpful answer.
Fabian
Hi Fabian,
Yes, it is possible to pre-render appointments on the
server-side using .NET 8 with Blazor in interactive mode WebAssembly before the
WASM is initialized. Blazor provides server-side prerendering, which allows the
UI to be displayed before the application is fully downloaded. This approach
enhances the user experience by reducing the initial loading time. However, it
requires running the application as a server application rather than a static
app. For more details on implementing pre-rendering in a Blazor WebAssembly
application, you can refer the below shared links.
Forum link: https://www.syncfusion.com/forums/163149/blazor-webassembly-with-pre-rendering
UG link: https://blazor.syncfusion.com/documentation/common/how-to/create-blazor-webassembly-prerendering
Don't hesitate to get in touch if you require further help or more information.
Regards,
Vijay
Hi Vijay,
I am already using this approach. The scheduler itself is already prerendered, but not any of the content (appointments). I can see using logs, that the "OnInitialized" hook is called on server, but not any of the data-fetching methods. I tried different methods for this (like DataSource-property and DataManager).
So maybe the scheduler does not support prerendering of appointments after all?
Best regards
Fabian
Hi Fabian,
We have prepared a
sample based on the configuration you provided. The sample renders correctly,
and appointments are displayed as expected. However, we suspect that the issue
might be due to a missing @rendermode InteractiveServer directive or improper mapping
of scripts and styles in your App.razor file. This configuration oversight
could be affecting the component rendering. If you still facing issue, can you
share the issue reproducing sample for further
validation.
[Home.razor]
|
@page "/" @rendermode InteractiveServer
<SfSchedule TValue="AppointmentData" Height="650px" @bind-SelectedDate="@CurrentDate"> <ScheduleEventSettings DataSource="@DataSource"></ScheduleEventSettings> <ScheduleViews> <ScheduleView Option="View.Day"></ScheduleView> <ScheduleView Option="View.Week"></ScheduleView> <ScheduleView Option="View.WorkWeek"></ScheduleView> <ScheduleView Option="View.Month"></ScheduleView> <ScheduleView Option="View.Agenda"></ScheduleView> </ScheduleViews> </SfSchedule> |
[App.razor]
|
<html lang="en">
<head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <base rel='nofollow' href="/" /> <link rel="stylesheet" rel='nofollow' href="bootstrap/bootstrap.min.css" /> <link rel="stylesheet" rel='nofollow' href="app.css" /> <link rel="stylesheet" rel='nofollow' href="BlazorApp3.styles.css" /> <link rel="icon" type="image/png" rel='nofollow' href="favicon.png" /> <link rel='nofollow' href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" rel="stylesheet" /> <HeadOutlet /> </head>
<body> <Routes /> <script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script> <script src="_framework/blazor.web.js"></script> </body>
</html> |
Regards,
Vijay
Attachment: BlazorApp3_5f43d6a0.zip
Hello Vijay,
even with your provided example, the appointments are not prerendered. They get rendered as soon as a websocket connection is established. But before that, not appointments are shown. They are, how ever already in the DOM but not visible. I assume it is not possible with SfScheduler then?
Best regards,
Fabian
Hi Fabian,
The appointments are pre-rendered on the server, but we have configured the
Scheduler to determine their positions based on the dimensions of the fully
rendered Scheduler component. Consequently, the appointment positions are
adjusted only after the DOM has been completely rendered with the final
dimensions. This can lead to a visual delay, making it seem as though the
appointments are loading slowly, despite being pre-rendered.
Don't hesitate to get in touch if you require further help
or more information.
Regards,
Vijay
- 5 Replies
- 2 Participants
-
FA Fabian
- Oct 31, 2024 02:56 PM UTC
- Nov 5, 2024 01:53 PM UTC
