Lärarguide · Lektion 8 av 8 — Sista lektionen

Render modes, prestanda & deployment

Sista lektionen. Teorin är kort eftersom huvuddelen av tiden är muntlig redovisning av examinationen.

V8
Vecka
2,5 h
Total tid
~40 min
Teori
~90 min
Redovisningar
Studentmaterial 08-render-modes-deploy.html
Kompletterande resurser

Lektionens mål

Agenda (150 min)

0:00
Check-in. Kort retrospektiv över hela kursen.
0:15
Teori: Render modes på djupet — @rendermode, prerendering, fallgropar.
0:35
Teori: Prestandatips, <Virtualize>, @key.
0:45
Teori: Deployment — dotnet publish, Azure App Service, IIS.
0:55
Paus 15 min
1:10
Redovisningar: 8–10 minuter per student + 2–3 min frågor.
2:20
Avrundning + kursutvärdering.
2:30
Slut
Schemalägga redovisningar Om ~10 studenter behövs ofta mer än 90 minuter. Kör då redovisningar utöver lektionstid (separata bokningar V8) — bekräfta i god tid.

Talartips per sektion

När-väljer-jag-vad: ge tre tumregler. (1) Auto är default. (2) Static SSR för informationssidor och SEO. (3) Server när initiation måste vara nästan omedelbar och nätverket är snabbt.
Prerendering-fällan: visa "dubbelt anrop"-problemet live. Lägg en Console.WriteLine i OnInitializedAsync och visa att den körs två gånger i en Interactive-komponent.
Redovisningar: sätt en strikt timer. 10 min går snabbt. Be alla ha appen redo att köra (lokal eller deploy) innan sin tid.

Workshop / Demo — guide för läraren

Sista teori-segmentet bör vara en gemensam live-demo (10 min) snarare än en separat workshop:

  1. Skapa en Blazor Web App med --interactivity Auto.
  2. Lägg @rendermode InteractiveServer på en komponent. Visa nätverksfliken — SignalR-trafik.
  3. Byt till InteractiveWebAssembly. Visa att .NET-runtimen laddas (~1–2 MB).
  4. Visa dotnet publish -c Release -o publish.
  5. Om tid finns: drag&drop deploy till Azure App Service via VS Code Azure-extension.
dotnet publish -c Release -o ./publish

# Kort om Docker
docker build -t minapp .
docker run -p 8080:8080 minapp

Bedömning av redovisningarna

Använd bedömningsmatrisen från 09-examination.html. Fokusera på:

Om en student är klar tidigt med redovisningen

  • Ställ följdfrågor om alternativa designval.
  • Be dem motivera ett kodval på djupet.
  • Stretch-frågor: hur skulle de skalat appen till 10 000 användare?

Om en student är nervös vid redovisningen

  • Börja med "visa appen" istället för "förklara arkitekturen".
  • Ställ enkla frågor först för att bygga självförtroende.
  • Avbryt inte när de tappar tråden — vänta ut tystnaden.

Vanliga frågor

Vad ska jag välja för render mode i "riktiga" projekt?
Default Auto är ett gott val. Statisk SSR för marknadssidor. Renodlat Server om appen är intern och nätverket pålitligt. Renodlat WASM om du vill kunna deploya till en CDN.
Varför körs OnInitialized två gånger?
Prerendering. Servern renderar komponenten en gång, sedan körs den igen när komponenten blir interaktiv på klienten. I .NET 10 använd attributet [PersistentState] på propertyn (den klassiska PersistentComponentState-tjänsten finns kvar men attributet är 1 rad i stället för 20).
Hur stort är en WASM-app?
Första laddning ~1.5–2.5 MB komprimerat. AOT-kompilering ökar storleken men minskar runtime-tid. Cachelagras efter första laddning.

Efter kursen

Nästa steg för studenterna
Inlämnings-deadline Fredag i V8 kl 17.00. Påminn under lektionen. Sen inlämning ger endast G.

Kursavslutning

Ta 10 minuter i slutet för:

← L7 Lektionsplan →