Blazor oder MVC und Razor Pages für eine interne Geschäftsanwendung?

Ein .NET-Team startet eine interne Anwendung: Bestellungen, Freigaben, Berichte. Die Hälfte des Teams kennt ASP.NET MVC oder Razor Pages in- und auswendig, und beides ist bewährt, stabil und gut dokumentiert. Jemand schlägt stattdessen Blazor vor. Lohnt sich das?

Microsofts eigener Leitfaden zur Wahl der Web-UI ist eindeutig: Blazor wird für die meisten Web-UI-Szenarien empfohlen. Das heißt aber nicht, dass jede MVC-Anwendung neu geschrieben werden sollte. Die eigentlichen Fragen sind, wie interaktiv die Masken sind und was Sie schon haben.

Der Unterschied in drei Sätzen

• MVC: Controller nehmen die Anfrage an, bereiten die Daten vor und geben eine View zurück. Jeder Klick, der den Server braucht, ist eine neue Anfrage.
• Razor Pages: dieselbe Idee, nach Seiten statt nach Controllern organisiert. Einfacher für formularlastige Anwendungen.
• Blazor: Die Maske besteht aus C#-Komponenten. Sie können wie Razor Pages auf dem Server gerendert werden oder interaktiv laufen, auf dem Server oder per WebAssembly im Browser.

Dasselbe Formular in beiden

Ein einfaches Formular für eine neue Bestellung. In Razor Pages die Seite und ihr Handler:

@page
@model NewOrderModel

<form method="post">
    <input asp-for="Order.Customer" />
    <span asp-validation-for="Order.Customer"></span>
    <button>Save</button>
</form>

public class NewOrderModel(OrderService orders) : PageModel
{
    [BindProperty]
    public OrderInput Order { get; set; } = new();

    public async Task<IActionResult> OnPostAsync()
    {
        if (!ModelState.IsValid)
            return Page();

        await orders.CreateAsync(Order);
        return RedirectToPage("Index");
    }
}

In Blazor eine einzige Komponente:

@inject OrderService Orders
@inject NavigationManager Navigation

<EditForm Model="Order" OnValidSubmit="SaveAsync" FormName="new-order">
    <DataAnnotationsValidator />
    <InputText @bind-Value="Order.Customer" />
    <ValidationMessage For="() => Order.Customer" />
    <button>Save</button>
</EditForm>

@code {
    [SupplyParameterFromForm]
    private OrderInput? Order { get; set; }

    protected override void OnInitialized() => Order ??= new();

    private async Task SaveAsync()
    {
        await Orders.CreateAsync(Order!);
        Navigation.NavigateTo("/orders");
    }
}

Für ein einfaches Formular ist der Aufwand etwa gleich. Der Unterschied zeigt sich, sobald die Maske reagieren muss: Der Preis wird bei geänderter Menge neu berechnet, die zweite Auswahlliste hängt von der ersten ab, die Liste filtert beim Tippen. In MVC und Razor Pages ist das JavaScript neben dem C#. In Blazor bleibt es in C#, in derselben Komponente.

Verglichen nach dem, was für das Geschäft zählt

	Blazor	MVC und Razor Pages
Interaktive Masken	In C#, ohne separates JavaScript	JavaScript oder eine Bibliothek wie htmx neben dem C#
Einfache Formulare und Listen	Genauso einfach	Genauso einfach und sehr ausgereift
Wiederverwendbare Teile der Maske	Komponenten, in der ganzen Anwendung	Partial Views und Tag Helper, weniger natürlich
Öffentliche Seiten und SEO	Gut mit statischem Server-Rendering	Hervorragend, ganz natürlich
Server-Ressourcen	Der interaktive Server-Modus hält eine Verbindung pro offenem Browser-Tab	Anfrage, Antwort, nichts bleibt bestehen
Das Team	C#-Entwickler sind schnell produktiv	Die meisten .NET-Entwickler kennen es schon
Bestehende Anwendung	Kann Maske für Maske ergänzt werden	Bleibt, wie sie ist

Die Server-Zeile verdient einen Satz. Blazor im interaktiven Server-Modus hält für jeden offenen Tab eine Live-Verbindung. Für eine interne Anwendung mit einigen Hundert Anwendern ist das kein Problem. Für eine öffentliche Website mit Tausenden Besuchern nutzen Sie für diese Seiten statisches Rendering oder WebAssembly. Wann was passt, steht in unserem Artikel Blazor Server oder WebAssembly.

Wann MVC oder Razor Pages die richtige Wahl bleibt

• Eine große MVC-Anwendung läuft bereits. Sie nur für einen Frameworkwechsel neu zu schreiben, lohnt sich selten.
• Überwiegend Formulare und statische Seiten, mit wenig Interaktion in der Maske.
• Öffentliche Inhalte, die schnell laden und bei Google ranken müssen.
• Ein Team, das MVC gut kennt und keine reichhaltigeren Masken braucht.

Sie müssen selten nur eins wählen

Blazor-Komponenten können innerhalb einer bestehenden MVC- oder Razor-Pages-Anwendung leben. Deshalb ist der sicherste Weg ein schrittweiser: Die bestehenden Masken bleiben, wie sie sind, und neue, interaktivere werden in Blazor geschrieben. So entwickelt sich die Anwendung in dem Tempo, das das Geschäft braucht, ohne großes Neuschreiben. Derselbe Ansatz funktioniert für ältere Anwendungen; siehe unseren Artikel zur Migration von Web Forms zu Blazor.

Fünf Fragen vor der Entscheidung

1. Wie viel der Anwendung sind Formulare und Listen, und wie viel Masken, die beim Arbeiten reagieren?
2. Gibt es schon eine MVC- oder Razor-Pages-Anwendung, und funktioniert sie?
3. Ist die Anwendung intern oder hinter einem Login, oder öffentlich und von Google abhängig?
4. Wie viele Anwender haben sie gleichzeitig offen?
5. Wer pflegt sie in fünf Jahren, und was können diese Leute?

Zeigen die Antworten auf interaktive Masken, einen Login und ein C#-Team, wählen Sie Blazor für die neue Arbeit. Zeigen sie auf eine funktionierende MVC-Anwendung mit überwiegend Formularen, behalten Sie sie und ergänzen Blazor nur dort, wo eine Maske es wirklich braucht. Wie Blazor im Vergleich zu den JavaScript-Frameworks abschneidet, steht in Blazor oder Angular und Blazor oder React.

Wie wir arbeiten

ProCoding ist ein .NET-Studio aus Split in Kroatien. Wir betreuen MVC- und Razor-Pages-Anwendungen und bringen Blazor seit 2020 in Produktion, haben also keinen Grund, das eine dem anderen vorzuziehen. Wir helfen bei der Wahl, entwickeln neue Blazor-Anwendungen und bringen Blazor Maske für Maske in bestehende Anwendungen. Der erste Schritt ist ein kostenloses 30-minütiges Gespräch.

Quellen

• Choose an ASP.NET Core web UI, Microsoft Learn
• ASP.NET Core Blazor render modes, Microsoft Learn
• Integrate ASP.NET Core Razor components into ASP.NET Core apps, Microsoft Learn