22 novembre 2025 12:38

Differenze tra progetti Blazor net10 e net9

Quando esce una nuova versione di .net spendo sempre qualche minuto per vedere cosa è cambiato nei template di progetto che offre Visual Studio creando due progetti e confrontandoli con WinMerge. Così, in caso di upgrade di un vecchio progetto oltre a cambiare la versione del framework nel .csproj so anche cosa modificare e/o aggiungere. Ecco la carrellata di cambiamenti tra un progetto Blazor Server 10 e 9, configurato come nell'immagine sottostante (ho ovviamente lasciata deselezionata l'opzione .dev.localhost TLD non presente se si sceglie net9)

Solution

Il file .sln va in pensione... benvenuto al nuovo .slnx in formato XML come i csproj (qui tutti i dettagli). Per migrare un vecchio .sln a .slnx si usa il comando

dotnet sln migrate

(poi il file .sln va cancellato a mano)

NotFound

Gran parte delle novità riguardano la gestione migliorata con il router che supporta un approccio più esplicito con NotFound e NotFoundContent, integrato con i nuovi modelli di rendering e con il supporto a prerendering e stato persistente.

In Program.cs

app.UseStatusCodePagesWithReExecute("/not-found", createScopeForStatusCodePages: true);

Nel file Nomeprogetto.csproj si aggiunge questo flag introdotto per controllare il comportamento del router di Blazor quando si verifica una navigazione verso una route non valida o non trovata.

<BlazorDisableThrowNavigationException>true</BlazorDisableThrowNavigationException>

Una nuova Page (in Components/Pages) chiamata NotFound.razor dove finalmente possiamo mettere il nostro layout custom con le immagini spiritose che mettiamo nella 404 :-)

e la sua applicazione in Routes.razor nel tag Router

<Router AppAssembly="typeof(Program).Assembly" NotFoundPage="typeof(Pages.NotFound)">

Reconnect

Altro grosso tema la migliorata esperienza di Reconnect quando la connessione SignalR va in idle

in App.razor uso del Componente <ReconnectModal> che troviamo (razor + isolated css + js) nel folder Components/Layout

E per non specificare nel componente il namespace hanno aggiunto nel file _imports.razor lo @using Nomeprogetto.Components.Layout

App.razor

Sempre in app.razor il file blazor.web.js viene ora caricato tramite @Assets[] così come già avveniva per i css, cosa che garantisce che il browser carichi sempre il file giusto, anche se il framework applica cache busting o hashing ai nomi dei file.

<script src="@Assets["_framework/blazor.web.js"]"></script>

Subito dopo il tag base, troviamo un nuovo tag <ResourcePreloader /> che serve a precaricare automaticamente gli asset critici di Blazor (JS, CSS, framework) per rendere più veloce e fluido l’avvio dell’app

Typo

Modifica fondamentale... si sono accorti dopo anni di un typo nella pagina di esempio Weather.razor (mancava la H di Fahrenheit)

<th aria-label="Temperature in Fahrenheit">Temp. (F)</th>

Conclusioni

Nulla di eclatante rispetto ad altri salti generazionali dove i cambiamenti furono molto più massicci... meglio così, visto che già un anno di tempo tra una versione e l'altra sembra sempre volare...

Recap & Check List

• program.cs
• aggiungere app.UseStatusCodePagesWithReExecute("/not-found", createScopeForStatusCodePages: true); prima di app.UseHttpsRedirection();
• attenzione se si ha app.UseStaticFiles, cambiarlo con app.MapStaticAssets  (vedi questo video)
• copiare i 3 ReconnectModal.* in Component/Layout
  • fixare ReconnectModal.razor.js come suggerito qui
• copiare NotFound.razor in Pages
• aggiungere in _imports.razor
• @using nomeapp.Components.Layout
• aggiungere in MainLayout.razor la parte NotFound
• <Router AppAssembly="typeof(Program).Assembly" NotFoundPage="typeof(Pages.NotFound)">
• app.razor
• mettere <ResourcePreloader /> dopo <base href>
• mettere <ReconnectModal /> dopo <Routes />
• mettere <script src="@Assets["_framework/blazor.web.js"]"></script> al posto di quello attuale