Evaluating Blazor Rendering Modes : A Comparative Study of Interactive WebAssembly, Interactive Server, and Interactive Auto Rendering

As modern web applications grow in complexity, optimizing performance becomes essential for delivering quality user experiences. The rendering method developers choose to implement is a key contributing factor. This thesis investigates how different rendering techniques affect performance in web applications developed with the Blazor framework, focusing on both initial page load and user interaction. Three functionally identical Blazor web applications were implemented using the three available render modes; client-side rendering with Interactive WebAssembly, server-side rendering with Interactive Server, and a hybrid method named Interactive Auto. These were deployed on Azure App Service, a cloud-based hosting platform. Automated tests, executed with the Puppeteer testing framework, simulated page load and user interactions while collecting metrics measuring different parts of the user experience. Network conditions were throttled across three predefined profiles. The results show that render modes running server-side rendering outperform client-side rendering during initial load, offering better progressive rendering and lower blocking times, improving perceived performance and usability. However, interactivity performance varies by context. Server-side rendering delivers better responsiveness under optimal network conditions, while client-side rendering offers more consistent interaction performance across network conditions, making it a preferable option in poor connection scenarios. The findings contribute to the broader body of research on web performance optimization, particularly in the selection of rendering methods, and offer insights into its impact on a real-world use case, providing practical guidance for future implementations.