> Markdown version of [/videos/699-blazor-the-new-spa-framework-for-everyone-who-hates-javascript?t=446](https://www.wearedevelopers.com/videos/699-blazor-the-new-spa-framework-for-everyone-who-hates-javascript?t=446). Every page supports `.md` or `Accept: text/markdown`. Links point to the HTML versions so they work for humans too. Agent guide: [/agents.md](https://www.wearedevelopers.com/agents.md).

---

# Blazor – the new SPA Framework for everyone who hates JavaScript

Sick of juggling C# backends with messy JavaScript frameworks? Blazor unifies your web stack, letting you build robust single-page applications entirely in C#.

- **Speakers:** [Christian Giesswein](https://www.wearedevelopers.com/@christian-giesswein)
- **Event:** World Congress 2023
- **Published:** September 27, 2023
- **Duration:** 29:52
- **URL:** https://www.wearedevelopers.com/videos/699-blazor-the-new-spa-framework-for-everyone-who-hates-javascript

## Summary

Microsoft's historical web UI stack—ranging from deprecated Web Forms and Silverlight to MVC—left developers reliant on split architectures involving C# backends and separate JavaScript frameworks. Blazor emerges to unify the stack, allowing developers to build robust single-page applications natively using shared C# and .net code environments. By writing Razor components that seamlessly inject HTML with C#, teams can manage client-side interactivity, native browser rendering, and shared data models without having to maintain separate UI and API ecosystems.

The framework provides distinct deployment modes meticulously tailored to varying structural requirements. Blazor Server runs entirely server-side, orchestrating a slimmed-down browser client that receives user interface increments via an active SignalR web socket connection, prioritizing security but demanding network stability. Conversely, Blazor WebAssembly runs application code fundamentally within the browser by downloading and executing compiled .net assemblies. While WebAssembly introduces a significantly heavier initial network payload, structural overhead is negated rapidly by aggressive browser caching logic. This application methodology continues expanding via Blazor Hybrid for compiling into native mobile hosts, and the latest unified model mixing partial server with client-side outputs dynamically.

Developing elements within this single-stack infrastructure sharply lowers UI complexities by anchoring typical web state functions entirely into C# syntax. Event handling, generic list mappings, and active counter decrements bypass messy document parsing loops. Even when isolated away from traditional JavaScript frameworks, teams securely utilize continuous JavaScript interop mappings to retain full functional access to existing npm packages while maximizing the efficiency of a single unified language layer.

**Keywords:** blazor webassembly, blazor server architecture, single-page applications, razor components, c# web development, .net full-stack unification, signalr web socket connections, browser dom rendering, javascript interop techniques, blazor hybrid deployment, blazor united native rendering, asp.net core integrations, front-end framework replacement, compiled assembly execution, web application caching payloads

## Chapters

1. **Evolution of Microsoft frontend architectures and user interfaces** (00:13) — The historical challenges of building user interfaces in the structured Microsoft ecosystem reveal a persistent gap alongside strong backends.
1. **Unifying frontend and backend development with ASP.NET Core Blazor** (04:18) — Building end-to-end web applications using a single C# and .NET technology stack eliminates the need for separate JavaScript frameworks.
1. **Hosting models for executing Blazor applications across different platforms** (07:26) — Developers can choose between server-side, client-side, hybrid, and integrated hosting approaches to deploy their web components.
1. **Comparing server-side delivery and WebAssembly application execution** (09:55) — Architectural trade-offs exist between streaming continuous web socket updates and downloading complete compiled assemblies directly into the browser engine.
1. **Analyzing web component structures and network performance profiles** (13:37) — A practical look at standard project templates demonstrates how downloaded assemblies are cached to improve initial loading metrics.
1. **Building interactive frontends using inline logic inside HTML components** (21:20) — Embedding native code within markup tags enables developers to create robust dynamic states and interactive click events seamlessly.
1. **Integrating JavaScript libraries and mixing hosting deployment models** (28:34) — Real-world conditions often require calling standard node packages and balancing reliable local connectivity against uncertain public network connections.

## Related Moments

- [Introduction to Blazor for seamless web development](https://www.wearedevelopers.com/videos/1564-blazor-unleashed-the-future-of-net-web-development) (from "Blazor Unleashed: The Future of .NET Web Development")
- [Introduction to serverless websites with Blazor and Azure Functions](https://www.wearedevelopers.com/videos/115-blazor-and-azure-functions-for-serverless-website) (from "Blazor and Azure functions for Serverless Website")
- [Understanding Blazor components and the Razor syntax integration](https://www.wearedevelopers.com/videos/1564-blazor-unleashed-the-future-of-net-web-development) (from "Blazor Unleashed: The Future of .NET Web Development")
- [Delivering cross-platform enterprise applications from a single codebase](https://www.wearedevelopers.com/videos/1564-blazor-unleashed-the-future-of-net-web-development) (from "Blazor Unleashed: The Future of .NET Web Development")
- [Running Blazor inside hybrid desktop application web views](https://www.wearedevelopers.com/videos/1564-blazor-unleashed-the-future-of-net-web-development) (from "Blazor Unleashed: The Future of .NET Web Development")
- [Addressing accessibility challenges and Blazor developer adoption](https://www.wearedevelopers.com/videos/568-blazing-accessibility-basics) (from "Blazing Accessibility Basics")

## Related Articles

- [c't <webdev> 2023](https://www.wearedevelopers.com/magazine/307-c-t-webdev-2023)
- [Web Development Best Practices: What The Data Tells us](https://www.wearedevelopers.com/magazine/84-web-development-best-practices-what-the-data-tells-us)
- [Native Web Apps: Are We There Yet?](https://www.wearedevelopers.com/magazine/83-native-web-apps-are-we-there-yet)
- [The Best JavaScript Framework to Learn](https://www.wearedevelopers.com/magazine/229-the-best-javascript-framework-to-learn)

## Related Jobs

- [Backend Entwickler C#/.NET iv.)](https://www.wearedevelopers.com/jobs/ext/1262419-backend-entwickler-c-net-iv) at **Bosch-Gruppe Österreich**
- [Software Engineer Frontend (all genders welcome) in the field of Water Line Integrity Solutions](https://www.wearedevelopers.com/jobs/ext/127888-software-engineer-frontend-all-genders-welcome-in-the-field-of-water-line-integrity-solutions) at **Rosenxt Group**
- [Staff Frontend Engineer](https://www.wearedevelopers.com/jobs/48313-staff-frontend-engineer) at **SMG Swiss Marketplace Group**
- [Junior Frontend Engineer](https://www.wearedevelopers.com/jobs/ext/1532351-junior-frontend-engineer) at **Almedia**
- [Working Student Frontend Development](https://www.wearedevelopers.com/jobs/ext/1185791-working-student-frontend-development) at **ZEISS Group**
- [Staff Frontend Engineer (Expert+/Lead equivalent) - Hybrid working model, 100%, Ho Chi Minh City](https://www.wearedevelopers.com/jobs/48314-staff-frontend-engineer-expert-lead-equivalent-hybrid-working-model-100-ho-chi-minh-city) at **SMG Swiss Marketplace Group**