Great video, that's exactly the main issue with the new template. That's a lot of headache and people lost just for SEO , I hope they have better reasons. I think they just wanted to get rid of WASM/Server and wanted to unify them. But they forgot how incompatible Client rendering and Server rendering are, demanding developers to find tricks to make it working.
i just turn off prerendering bc it messes with CSS animations and can cause them to play twice sometimes, which is really annoying when you want to have some sort of loading animation
It’s easy to pick up the prerendered data on the client, so that you don’t have to fetch it twice. I usually have that logic in a basecomponent. Another tip is to use Magic onion, then you don’t have to think about creating a server api, you can fetch your data the same way regardless of where your component is executed (on server or client) without dupplication of code.
Yeah I think this is just a big miss for Blazor and a shame. How are we expecting people to stop using Next/Nuxt/Angular when the framework has this fundamentals so confusingly implemented. Are there ways around it? Yes. You could fetch on after render instead on initialize (which, I know, defeats the purpose since you can do this without having a DOM) because there you can check if that is the first render. You could also use the HttpContext or some other variables to determine whether the code is currently being executed on the server or client. But again, this is just something kind of "advanced" to do, which definitely would deter new people from embracing the framework. I really love Blazor but this type of thing is one of those that really makes you hate Microsoft for butchering an opportunity to build something great.
So basically only enable prerender on pages that will be crawled by the search engines. All other pages use a different method (SSR, Stream or Render). For the SEO pages, like you said it is strange for the server to make a service call to it's self, is it better to just have SEO pages live within server project?
that means the uri needs to be hardcoded somewhere in the settings file does it? also, the api call for the data happens twice now, once for prerender and then wasm takes over and fetches the data again... i am currently doing this for wasm prerendering @using System.Runtime.InteropServices; @rendermode InteractiveWebAssembly @page "/blog" ... bool IsWasm = RuntimeInformation.ProcessArchitecture == Architecture.Wasm; bool? DataLoadedSuccessfully = null; // null for loading, false for error and true to display the f.e. table/grid of blogs, or image gallery protected override async Task OnAfterRenderAsync(bool firstRender) // or use oninitialized ... { if(firstRender) { if(!IsWasm) return; await LoadData(); } } what do you think
I'm wondering why Blazor reloads already rendered page on the server... It has no change since load, isn't? It should switch to client side rendering just after first user interaction with the page. This is how Angular works (as far as I know).
Great video. Around 9:50 is what was giving me a problem in a different video of yours!! I like how you come back to things in different videos.
Great info. The .NET8 changes have been biting us in the butt as we've been upgrading from 6.
Great video, that's exactly the main issue with the new template. That's a lot of headache and people lost just for SEO , I hope they have better reasons.
I think they just wanted to get rid of WASM/Server and wanted to unify them. But they forgot how incompatible Client rendering and Server rendering are, demanding developers to find tricks to make it working.
i just turn off prerendering bc it messes with CSS animations and can cause them to play twice sometimes, which is really annoying when you want to have some sort of loading animation
Prerendering should be 'off' by default, and opt-in. Having it default to 'on' has resulted in SO MUCH FRUSTRATION for so many people.
It’s easy to pick up the prerendered data on the client, so that you don’t have to fetch it twice. I usually have that logic in a basecomponent. Another tip is to use Magic onion, then you don’t have to think about creating a server api, you can fetch your data the same way regardless of where your component is executed (on server or client) without dupplication of code.
Yeah I think this is just a big miss for Blazor and a shame. How are we expecting people to stop using Next/Nuxt/Angular when the framework has this fundamentals so confusingly implemented.
Are there ways around it? Yes. You could fetch on after render instead on initialize (which, I know, defeats the purpose since you can do this without having a DOM) because there you can check if that is the first render.
You could also use the HttpContext or some other variables to determine whether the code is currently being executed on the server or client. But again, this is just something kind of "advanced" to do, which definitely would deter new people from embracing the framework.
I really love Blazor but this type of thing is one of those that really makes you hate Microsoft for butchering an opportunity to build something great.
So basically only enable prerender on pages that will be crawled by the search engines. All other pages use a different method (SSR, Stream or Render). For the SEO pages, like you said it is strange for the server to make a service call to it's self, is it better to just have SEO pages live within server project?
that means the uri needs to be hardcoded somewhere in the settings file does it?
also, the api call for the data happens twice now, once for prerender and then wasm takes over and fetches the data again...
i am currently doing this for wasm prerendering
@using System.Runtime.InteropServices;
@rendermode InteractiveWebAssembly
@page "/blog"
...
bool IsWasm = RuntimeInformation.ProcessArchitecture == Architecture.Wasm;
bool? DataLoadedSuccessfully = null; // null for loading, false for error and true to display the f.e. table/grid of blogs, or image gallery
protected override async Task OnAfterRenderAsync(bool firstRender) // or use oninitialized ...
{
if(firstRender)
{
if(!IsWasm)
return;
await LoadData();
}
}
what do you think
I'm wondering why Blazor reloads already rendered page on the server... It has no change since load, isn't? It should switch to client side rendering just after first user interaction with the page. This is how Angular works (as far as I know).
temperature in coulomb - interesting
and in farad =)
How to cache server response that we will not make api call second time on the client. Only this part is missing in that video.
Add output caching to your pipeline
Blazor ... making simple applications complex since 2019 :)
Excellent
Thank you :)
nice point
Dont load the data in a lifecycle method that can run more than once. Simples.
That is basically the same as disabling "prerender" mode. So why not disable it and use the full page cycle.