Slide 1
Slide 1 text
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Patrick Jahr
@jahr_patrick
Architekt
Slide 2
Slide 2 text
Hello, it’s me.
Patrick Jahr
Developer Consultant / Blazor Expert @ Thinktecture AG
E-Mail: [email protected]
Twitter: @jahr_patrick
Slides: https://thinktecture.com/patrick-jahr
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Patrick Jahr
P
Slide 3
Slide 3 text
„Terminal Server für Web-Entwickler“
• Thinktecture fokussiert auf SPA-Architekturen
• Blazor WebAssembly ist ein waschechtes SPA-Framework
• Blazor Server hat komplexe, nicht Web-Style Basisarchitektur – aka „Server-Client“
• Code wird immer auf Serverseite ausgeführt
• Zustand wird ausschließlich auf Serverseite gehalten
• Skalierung wird deutlich aufwändiger
• Auf dem Client ist nur ein schmaler JavaScript-Stub aktiv (aus dem Blazor-Framework)
• Jegliche UI-Interaktionen wandern immer über das Netzwerk (SignalR-Verbindung)
• Ständige Netzwerkverbindung nötig - fehleranfällig
• Keine Offlinefähigkeit - Möglichkeiten als SPA / PWA werden eingeschränkt
• Zustandsbehaftete Datenhaltung erschwert
• Infos über die technischen Details und Eigenheiten von Blazor Server:
• https://www.thinktecture.com/de/blazor/webinar-blazor-server-moegliche-alternative-zu-spas/
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Was ist mit Blazor Server?
Slide 4
Slide 4 text
DEMO
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Slide 5
Slide 5 text
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Slide 6
Slide 6 text
RenderFragment DynamicComponent
Resumé
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
P
Slide 7
Slide 7 text
7
• (Klassischer) Ansatz zum Rendern von Segmenten des User-Interface zur Laufzeit
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
RenderFragment
Code-Behind Razor-Code
Slide 8
Slide 8 text
DEMO
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Slide 9
Slide 9 text
RenderFragment DynamicComponent
Resumé
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Slide 10
Slide 10 text
10
• Seit .NET6 im Blazor-Framework
• Mit dem Komponententyp und den Parameteren können Komponenten dynamisch
gerendert werden
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
DynamicComponent
Slide 11
Slide 11 text
DEMO
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
P
Slide 12
Slide 12 text
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Slide 13
Slide 13 text
13
• Dynamic Component ist sehr cool, hat aber dennoch grenzen
• RenderFragments erlauben den RenderTree selbst zu erstellen
• Am Ende wird bei beiden Ansätzen das gleiche Verfahren genutzt
Blazor WebAssembly
Dynamische Formulare und Inhalte in Aktion
Resümee
Slide 14
Slide 14 text
Vielen Dank
für Ihre Aufmerksamkeit!
Patrick Jahr
@jahr_patrick
[email protected]