Explore Prerendering in Blazor Server & WebAssembly with .NET 8 🔥


Hey Reader,

In this week's newsletter, I'm focusing on a fundamental yet often misunderstood aspect of Blazor in .NET 8 - prerendering in the new render modes (Server, WebAssembly, and Auto).

🚀 Prerendering Issue Resolution Video

You have two choices: watch the video below, which illustrates the common issue with prerendering, or continue reading for the code details.

video preview

🌟 Disabling Prerendering in Blazor with .NET 8

It's quite straightforward. When you opt for one of Blazor's new rendering modes in .NET 8 - Server, WebAssembly, or Auto - you'll need to use the @rendermode directive. This directive allows you to select one of these modes for either a page or a component:

Here's an important note: if you're loading data, for example, prerendering is on by default. This can cause an unsightly flicker. Observe in the gif below how the values change twice upon page reload.

That's prerendering for you. While it might be beneficial for SEO, there are times when it's not desirable due to the negative impact on user experience.

To address this, simply instantiate the render mode of your choice and set the prerender parameter to false.

This solution is applicable to all render modes and is also useful if you're looking to modify the effect for specific components rather than an entire page.


💌 Now It's Your Turn! How do you feel about prerendering? When and where would you use it?

A huge thank you to our community, and special gratitude to my Patrons for their steadfast support. Your contributions are vital to the success of this newsletter and my YouTube channel.

Excited for our next coding journey together. Stay safe and happy coding! 💻

Take care,

Patrick


Patrick God

Become a .NET & Blazor expert with weekly tutorials featuring best practices and the latest improvements, right in your inbox.

Read more from Patrick God
video preview

Hey Reader, You may have seen the recent blog post from Jimmy Bogard (creator of MediatR and AutoMapper) announcing that these libraries are going commercial. And to be clear, I fully support that. Time is money, and supporting your family always comes first. BUT… In most of my projects, I don’t actually use everything MediatR offers. I usually just need a small part of it, the classic "send a request, get a response" pattern. So I thought: why not build a simple version myself? 👉 That’s...

video preview

Hey Reader, In my last video, I showed you how to build a CRUD app using Vertical Slice Architecture and controllers in .NET 9. But… What if you could do the same thing - cleaner, simpler, and without all that controller clutter? 👉 That’s exactly what I show you in my brand-new video: In this one, you’ll learn how to: Use Minimal APIs instead of controllers Keep your Program.cs neat and tidy Stay fully organized with the Vertical Slice Architecture Work with Carter, a super helpful library...

video preview

Hey Reader, If you’ve ever built a simple CRUD app with a layered architecture… you might be making things harder than they need to be. In my newest YouTube tutorial, I show you how to build a scalable CRUD app using something super clean and refreshing: 👉 Vertical Slice Architecture in .NET 9 We’ll build a full Video Game API, step-by-step, with: .NET 9 Web API + Entity Framework Core Code-first migrations Controllers (yep, still using those!) The Mediator pattern for cleaner code And, of...