You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: aspnetcore/blazor/components/lifecycle.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -594,19 +594,19 @@ Welcome to your new app.
594
594
> [!NOTE]
595
595
> Although the examples in this section discuss the <xref:Microsoft.AspNetCore.Components.ComponentBase.OnInitializedAsync%2A> lifecycle method, other lifecycle methods that execute during prerendering may delay final rendering of a component. Only [`OnAfterRender{Async}`](#after-component-render-onafterrenderasync) isn't executed during prerendering and is immune to delays due to quiescence.
596
596
597
-
During prerendering, the `Home` component doesn't render until the `Slow` component is prerendered, which takes ten seconds. The UI is blank during this ten-second period, and there's no loading message. After prerendering, the `Home` component renders, and the `Slow` component's loading message is displayed. After ten more seconds, the `Slow` component finally displays the loaded message.
597
+
During prerendering, the `Home` component doesn't render until the `Slow` component is rendered, which takes ten seconds. The UI is blank during this ten-second period, and there's no loading message. After prerendering, the `Home` component renders, and the `Slow` component's loading message is displayed. After ten more seconds, the `Slow` component finally displays the loaded message.
598
598
599
599
:::moniker range=">= aspnetcore-8.0"
600
600
601
-
As the preceding demonstration illustrates, quiescence during prerendering results in a poor user experience. To address the problem, begin by implementing [streaming rendering](xref:blazor/components/rendering#streaming-rendering) to avoid waiting for the asynchronous task to complete when prerendering.
601
+
As the preceding demonstration illustrates, quiescence during prerendering results in a poor user experience. To improve the user experience, begin by implementing [streaming rendering](xref:blazor/components/rendering#streaming-rendering) to avoid waiting for the asynchronous task to complete while prerendering.
602
602
603
603
Add the [`[StreamRendering]` attribute](xref:Microsoft.AspNetCore.Components.StreamRenderingAttribute) to the `Slow` component (use `[StreamRendering(true)]` in .NET 8):
604
604
605
605
```razor
606
606
@attribute [StreamRendering]
607
607
```
608
608
609
-
When the `Home` component is prerendering, the `Slow` component is quickly rendered with its loading message. The `Home` component doesn't wait for ten seconds to render placeholder content before prerendering is complete. However, the loaded message displayed at the end of prerendering is replaced by the loading message while the component finally renders, which is another ten-second delay. In the case of a component that's accessing a real service, such as a database, the service call (or query for a database) re-executes a second time as well, which creates undesirable load on the app's service (or database). To address this, persist the prerendered state with <xref:Microsoft.AspNetCore.Components.PersistentComponentState> for final rendering of the component, as seen in the following updates to the `Slow` component:
609
+
When the `Home` component is prerendering, the `Slow` component is quickly rendered with its loading message. The `Home` component doesn't wait for ten seconds for the `Slow` component to finish rendering. However, the loaded message displayed at the end of prerendering is replaced by the loading message while the component finally renders, which is another ten-second delay. In the case of a component that's accessing a real service, such as a database, the service call (or query for a database) re-executes a second time as well, which creates undesirable load on the app's service (or database). To address this, persist the prerendered state with <xref:Microsoft.AspNetCore.Components.PersistentComponentState> for final rendering of the component, as seen in the following updates to the `Slow` component:
0 commit comments