Как отключить вторичный рендеринг страниц Wasm в автоматическом режиме Blazor?

При запросе страницы сначала выполняется рендеринг на стороне сервера, а затем браузер отображает содержимое, отображаемое на стороне сервера. Когда загрузка Wasm завершена, страница отображается. Если логика рендеринга сервера и wasm различна, страница будет мигать.

Например:

@if (imageID == 0)
{
    <img src = "images/banner1.jpeg" class = "w-full object-cover object-center">
}
else if (imageID == 1)
{
    <img src = "images/banner2.jpeg" class = "w-full object-cover object-center">
}
else 
{
    
}

@code{
    int imageID = -1;

    protected override void OnInitialized()
    {
        Random rd = new Random();
        imageID = rd.Next(1, 1000) % 2;
    } 
} 

Я хочу, чтобы страница отображалась только один раз, но я не нахожу способа.

Кроме отключения вторичного рендеринга wasm, есть ли еще какие-нибудь методы?

Спасибо

Для развертывания Сайтов с использованием Blazor, Angular и React с репозиторием на GitHub на Cloudflare
Для развертывания Сайтов с использованием Blazor, Angular и React с репозиторием на GitHub на Cloudflare
Как развернуть сайты с помощью Blazor, Angular и React с репозиторием на GitHub на Cloudflare.
1
0
75
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Мы можем использовать @rendermode @(new InteractiveAutoRenderMode(prerender: false)), чтобы отключить prerender, который включен по умолчанию в интерактивном режиме, чтобы избежать двойного срабатывания OnInitialized.

===========================

Автоматический режим blazor должен быть веб-приложением blazor Интерактивный автоматический режим рендеринга в .net 8. Мы называем его веб-приложением blazor, и автоматический режим будет иметь как клиентское приложение, так и серверное приложение, клиентское приложение работает как wsam. Как показано на снимке экрана ниже, на домашней странице есть @rendermode InteractiveServer, поэтому при первой загрузке на ней не загружен wsam. А на странице счетчика будет wsam после того, как я добавил @rendermode InteractiveWebAssembly. Разница заключается в режиме рендеринга.

И я не понял, что означает If the rendering logic of the server and wasm are different, the page will flash., но что касается the page to be rendered only once, боюсь, вас беспокоит функция предварительного рендеринга при рендеринге на стороне сервера((wsam полностью рендерится на стороне клиента, поэтому у него нет предварительного рендеринга на стороне сервера ).), потому что когда мы добавим точку останова в метод OnInitialized, мы увидим, что она срабатывает дважды.

Затем мы можем добавить @rendermode @(new InteractiveServerRenderMode(prerender: false)), чтобы отключить предварительный рендеринг, и OnInitialized будет запускаться только один раз.

Спасибо. Ответ. Моя страница использует режим InteractiveAuto。 <img src = "images/@img" class = "w-full object-cover object-center"> шаг 1. Когда я открываю страницу через браузер, она отображается сервером в первый раз. В это время выполняется OnInitialized. @img — случайное число, например 1. Step2 После завершения загрузки Wasm OnInitialized выполняется один раз, а @img может быть 2. Поскольку интервал между шагами 1 и 2 относительно мал, браузер отображает 1.jpeg и 2.jpeg. последовательно, что выглядит как мерцание.

boolean0011 13.06.2024 17:46

Спасибо за ваш ответ! Тогда вы можете попробовать @rendermode @(new InteractiveAutoRenderMode(prerender: false)) вместо @rendermode InteractiveAuto. Я воспроизвел вашу проблему на своей стороне, и метод OnInitialized будет запущен один раз после отключения prefernder. Вы можете посмотреть этот раздел: Learn.microsoft.com/en-us/aspnet/core/blazor/comComponents/…

Tiny Wang 14.06.2024 08:49

Спасибо за ваш ответ! Этот метод хорош, но он создаст большую нагрузку на сервер. Я хочу, чтобы на клиенте выполнялось больше обработки, а рендеринг на сервере - как можно меньше. Это также первоначальный замысел автоматического режима.

boolean0011 14.06.2024 10:40

@boolean0011 I want more processing to be done on the client -> мы отключили server-side prerender, но не предварительный рендеринг на стороне клиента. Клиентская сторона не выполняет предварительную визуализацию. Когда мы отключаем предварительный рендеринг на стороне сервера, мы пытаемся снизить нагрузку на сервер.

Tiny Wang 14.06.2024 10:49

Целью разработки автоматического режима является максимально возможное использование рендеринга на стороне клиента вместо рендеринга на стороне сервера. Только когда васм клиента не загружен, временно используется рендеринг на стороне сервера. После завершения загрузки Wasm лучше не выполнять повторный рендеринг страницы, которая была отображена и обработана сервером.

boolean0011 15.06.2024 04:12

до .net 8 у нас был только отдельный режим рендеринга wsam или sever, wsam требует загрузки wsam перед рендерингом страницы, что может быть не так удобно, поскольку требует нескольких секунд, но это принесет пользу позже, поскольку все операции выполняются клиентом. Хотя рендеринг на стороне сервера обрабатывается сервером, поэтому при первом открытии веб-сайта загрузка wsam в начале не займет много времени. Когда у нас есть веб-приложение blazor в .net 8, мы можем интегрировать wsam и серверный рендеринг, чтобы избежать недостатков обоих и получить преимущества обоих.

Tiny Wang 15.06.2024 07:01

может быть, мы можем сделать домашнюю страницу для использования InteractiveServer, а другие страницы — для использования InteractiveWebAssembly? Между тем, "рендеринг в 2 раза" вызван пререндером.

Tiny Wang 15.06.2024 07:03

Спасибо. Ответ. Это было решено, это действительно вызвано предварительным рендерингом.

boolean0011 17.06.2024 03:29

Моя страница использует режим InteractiveAuto, вот так

@page "/"
@rendermode InteractiveAuto

<img src = "images/@img">

@code {
    string img;

    protected override void OnInitialized()
    {
        Random rd = new Random();
        r = rd.Next(1, 1000) % 2;
        img = String.Format("{0}.jpeg", r);
    }
}

шаг 1 Когда я захожу на страницу через браузер, она отображается сервером впервые. В это время выполняется OnInitialized. @img — случайное число, например 1.

шаг 2 После завершения загрузки Wasm OnInitialized выполняется один раз, и @img может иметь значение 2.

Поскольку интервал между шагами 1 и 2 относительно небольшой, браузер отображает файлы 1.jpeg и 2.jpeg последовательно, что выглядит как мерцание.

Другие вопросы по теме