Blazor + C# = ❤️ – En enkel vei til fullstack i .NET

I et stadig mer komplekst teknologilandskap kan det være utfordrende å finne riktig frontend- rammeverk for ditt prosjekt. Blazor har raskt blitt et populært valg for utviklere som ønsker å bygge moderne, interaktive webapplikasjoner med .NET. Det er også stadig flere fremoverlente aktører som tar i bruk nettopp Blazor for sine prosjekter. Et av Blazor sine bedre kvaliteter, er hvor lett det er å sette seg inn i og ta det i bruk, spesielt om man er kjent med ASP.NET prosjekter fra før. Men hva er det som gjør Blazor unikt, og hvilke prosjekttyper er det egentlig best egnet for? Frida, seniorkonsulent i Novanet, deler sine erfaringer.

Bildet er generert av AI

Hva er Blazor, og hvorfor bør du vurdere det?

Blazor er et frontend-rammeverk fra Microsoft som gjør det mulig å bygge interaktive webapplikasjoner med C# og .NET, helt uten JavaScript. Dette betyr at du kan utvikle hele applikasjonen, både frontend og backend, innenfor .NET-økosystemet. For .NET-utviklere som er vant til å arbeide i C#, gir dette en naturlig overgang til webutvikling uten å måtte lære nye språk.

Å bruke Blazor som fullstack-utvikler er både engasjerende og oversiktlig. Vi slipper å bytte mellom ulike språk og verktøy, og det fungerer spesielt godt for mindre prosjekter der hele teamet har erfaring med .NET.

Blazor er utviklet av Microsoft, ledet an av Steve Sanderson, en anerkjent utvikler kjent for å forenkle webutvikling. Han står blant annet bak Knockout.js og har bidratt til flere viktige .NET-verktøy. Blazor bygger på velkjente konsepter fra ASP.NET og Razor Pages, og gir en helhetlig og stabil plattform som gjør det mulig å bruke C# i både frontend og backend. Det forener frontend og backend på en måte som få andre rammeverk gjør, og unngår den strikte separasjonen man ofte ser i tradisjonelle løsninger. Man får bedre oversikt og det erlettere å jobbe fullstack i prosjektet.

Blazor kan lett gi oversikt over hele kodebasen, med alt på ett sted. Det gir oss en sømløs opplevelse i .NET-stacken. Dette betyr mindre tid på å hoppe mellom språk og verktøy – perfekt for team som allerede er vant til å jobbe med C#.

Hva gjør Blazor unikt?

Blazor har flere særtrekk som gjør det til et attraktivt alternativ for utvikling i .NET-miljøet:

Gøy i frontend: Blazor tilbyr en komplett komponentbasert arkitektur, lik React eller Angular, men med kraften fra .NET. Med Blazor kan du skrive gjenbrukbare UI-komponenter med Razor-syntaks, som gjør utviklingen mer effektiv, strukturert og morsomt. I Razor skriver man tilnærmet ren html med koblinger mot backend
Fullstack-utvikling i C#: For fullstack-utviklere er Blazor en gamechanger fordi det forener backend og frontend i én teknologistack, reduserer kontekstbytter og gjør det enklere å dele kode mellom klient og server. Dette er spesielt nyttig i team der utviklerne allerede er erfarne med C# og bidrar til å maksimere tidligere investeringer i .NET-kompetanse.
WebAssembly-teknologi: Blazor kan benytte WebAssembly-teknologi, som gir utviklere muligheten til å kjøre kompilert C#-kode direkte i nettleseren. Kompilert kode kan kjøres direkte i nettleseren uten å gå gjennom tolkning, noe som gir betydelig høyere ytelse, men også muligheten til å kjøre mer kompleks prosessering på klient-siden.
Allsidig: Blazor gir stor fleksibilitet ved å støtte tre ulike driftsmodeller, BlazorWebAssembly, Blazor Server og Blazor Hybrid, som kan tilpasses basert på hva løsningen trenger. Med BlazorWebAssembly kan applikasjonen kjøres direkte i nettleseren, noe som gir fordeler som offline-støtte og mindre belastning på serveren. Blazor Server, derimot, kjører applikasjonen på serveren og krever konstant nettverkstilkobling, men gir raskere oppstart og kan utnytte serverens ressurser mer effektivt. Blazor Hybrid integrererBlazor-komponenter i native mobil- og skrivebordsapplikasjoner ved hjelp av .NET MAUI, som kjører innenfor en WebView i den native applikasjonen. Valget mellom modellene avhenger av behovene for ytelse, skalerbarhet og hvor viktig stabil nettverkstilkobling er for applikasjonen.

For team med solid .NET-kompetanse kanBlazor gi en ryddig arkitektur som gjør det enklere å bygge og vedlikeholde prosjekter.

Svakheter og utfordringer ved Blazor

Selv om Blazor er et kraftig rammeverk fra Microsoft, har det fortsatt noen begrensninger som utviklere bør være klar over. Her er noen av de viktigste utfordringene og hva Microsoft gjør for å adressere dem:

Skaleringsutfordringer i Blazor Server: I Blazor Server skapes en SignalR-kobling mellom server og klient for hver bruker. Ved et høyt antall samtidige brukere kan dette føre til ressursutfordringer og økt kompleksitet i driften. Det kan også være en utfordring for applikasjoner som må fungere offline eller med ustabilt nettverk.
State management og oppdateringer: Blazor Server-applikasjoner kan oppleve sesjonstap for brukerne når nye oppdateringer deployeres. Dette kan være en stor ulempe for applikasjoner som krever kontinuerlig oppetid og en sømløs brukeropplevelse. Derimot har Microsoft gjort mye for å forbedre tilkoblingsopplevelsen
Nytt og umodent: Blazor er et relativt nytt rammeverk og er litt umodent på noen av de nyeste featurene. Men dette forbedres stadig og har blitt mye bedre i de siste versjonene.
For eksempel har det vært mye problemer med Hot Reload i tidligere versjoner, som fungerer betydelig bedre nå i .NET 9.

Blazor Server krever en konstant SignalR-tilkoblingog gjør at hver bruker legger belastning på serveren. Dette kan være utfordrende å håndtere i prosjekter med mange brukere.

Blazor har noen utfordringer, spesielt rundt ytelse, SEO, sanntidskommunikasjon og JavaScript-interop. Microsoft har imidlertid vist et sterkt engasjement for å forbedre Blazor, og mange av de største manglene har blitt adressert i nyere .NET-versjoner.

Med .NET 8 og .NET 9 har vi sett store forbedringer, og .NET 10 og videre vil trolig bringe enda mer optimalisering.

Når bør du ta i bruk Blazor?

Blazor passer godt til visse typer prosjekter, men er ikke nødvendigvis riktig for alle.

Godt egnet for: Interne applikasjoner, administrasjonsverktøy og applikasjoner som kan bygges og driftes innenfor .NET-økosystemet. Hvis man ønsker en mer enhetlig kodebase, at man bygger en SPA (Single Page Application) med WebAssembly eller vil lage en hybrid-app er Blazor et godt valg.
Ikke ideelt for: Applikasjoner med avanserte frontend-krav, eller applikasjoner med høy trafikk og høy skalerbarhet. Det fortsatt være utfordringer med SEO sammenlignet med tradisjonell server-side rendering (SSR).

Av egen erfaring kan det sies at Blazor fungerte godt i et prosjekt med et lite team som hadde behov for rask utvikling og enkelt vedlikehold. Blazor ble valgt på grunn av den sømløse integrasjonen med .NET og den enkle læringskurven for utviklere med C#-bakgrunn.

Sammenligning med andre rammeverk

Blazor konkurrerer med populære JavaScript-baserte rammeverk som Angular, React og Vue. Her er noen av forskjellene:

Angular, React og Vue gir deg en klar separasjon mellom frontend og backend, hvor disse rammeverkene leverer kun på frontend-delen. Blazor gjør veien fra frontend til backend kortere, og gjør det mulig å ha backend i samme løsning (solution) og man kan selv sørge for at skillet mellom frontend og backend er tydelig.
Disse teknologiene har vært i bruk i flere år og har derfor et mer modent økosystem, med omfattende dokumentasjon og tredjepartsbiblioteker. Blazor er fortsatt relativt nytt og har et mindre, men voksende utvalg av ressurser.
De etablerte alternativene har mange løsninger for tilstandshåndtering (state management), noe som forenkler utviklingen av mer komplekse applikasjoner. Blazor har noe færre og mer begrensede muligheter på dette området, derimot er det flere muligheter idag enn tidligere, f.eks. det Flux-baserte biblioteket, Fluxor.
Verktøy for debugging er godt utviklet for teknologier som React og Vue, med utvidelser som React Developer Tools og VueDevtools, som integreres i nettlesere. Blazor mangler slike verktøy, spesielt for WebAssembly, noe som kan gjøre feilsøking mer utfordrende.

Det er ikke sikkert at Blazor vil tiltrekke seg rene JavaScript-utviklere, men for et .NET-team er det et veldig attraktivt valg. Det gir oss muligheten til å holde oss til ett språk gjennom hele stacken.

Tips og anbefalinger for utviklere og team som vurderer å ta i bruk Blazor

Bruk ferdige UI-biblioteker: Utforsk alternativer som MudBlazor, RadzenBlazor eller SyncfusionBlazor. Disse bibliotekene gjør det raskt og enkelt å utvikle komponenter med et profesjonelt utseende, dog de kan redusere noe av fleksibiliteten.

State Management: Vurder verktøy som Fluxor, men kun hvis behovet for avansert tilstandshåndtering er åpenbart.

Test komponentene: Ikke glem å teste komponentene dine! Bruk verktøy som bUnit for effektiv testing av Blazor-komponenter.

Sett opp autentisering tidlig: Implementer innlogging, inkludert autentisering og autorisasjon, på et tidlig stadium. Dette kan være utfordrende med Blazor Server, så det er viktig å få det på plass tidlig i prosjektet.

Best practices

Komponenter: I Blazor er komponentbasert utvikling en av de største fordelene. Ved å organisere kodebasen i komponenter, fra enkle UI-elementer til komplekse funksjoner, skaper du en modulær og vedlikeholdbar arkitektur. Organiser kodebasen i komponenter, fra enkle knapper til mer komplekse funksjoner. Å etablere en struktur tidlig kan spare mye tid senere i prosjektet.

Skill frontend og forretningslogikk: Husk at Blazor er et frontend-rammeverk, selv om det lar deg skrive backend-lignende kode i C#. Applikasjons- og forretningslogikk bør skilles ut fra ren frontend-logikk. Et eksempel på en god struktur finnes i denne blogposten (erstatt Web API med Blazor).

Det anbefales å starte med Blazor Server for å lære seg teknologien, før man eventuelt prøver WebAssembly. Det er også lurt å henvende seg til Microsofts dokumentasjon og MudBlazor som gode ressurser for en rask start.

Konklusjon og fremtidsutsikter

Blazor er et spennende valg for utviklingsteam som allerede jobber innenfor Microsofts økosystem, og som ønsker en rask og kostnadseffektiv vei til markedet. Rammeverket gir muligheten til å bygge applikasjoner raskt og med minimalt kontekstbytte, noe som kan være spesielt nyttig i mindre team med bred .NET-erfaring.

Microsoft jobber kontinuerlig med å forbedre Blazor, og vi ser allerede at det blir stadig mer brukt i .NET-miljøet. Hvis teamet ditt allerede har .NET-kompetanse og søker en måte å bygge interaktive webapplikasjoner på uten å forlate C#, kan Blazor være akkurat det dere trenger for å komme i gang med fullstack webutvikling.

La Novanet hjelpe deg med deres neste Blazor prosjekt

I Novanet har vi erfarne konsulenter med inngående kompetanse på Blazor og hele .NET-økosystemet. Våre spesialister står klare til å hjelpe deg med å utnytte Blazor fullt ut i dine prosjekter.