Real-time server side rendered web applications using html, css & server language without writing a single line of JavaScript
Tags: csharp, razorcomponents, aspnetcore, signalr
Published: 2019-01-19 01:54:34

---
title: Real-time server side rendered web applications using html, css & server language without writing a single line of JavaScript
published: true
description: 
tags: c-sharp, razor components, asp.net core, signalr
---

It's 2019 already and technologies have evolved so far such that there are many options to try on with different combinations when it comes to web applications. Being a full stack developer, have got to work on projects with many combination of technologies over the decade. When it comes to real-time functionality javascript implementation of web-sockets is always first thought that comes to the mind. After introduction of webassembly standard few years ago, Microsoft introduced framework called [Blazor.net](https://blazor.net)(still experimental) [almost a year ago](https://blogs.msdn.microsoft.com/webdev/2018/02/06/blazor-experimental-project/?ranMID=24542&ranEAID=je6NUbpObpQ&ranSiteID=je6NUbpObpQ-mo17T_cKvNZQ1Y5AZc7rKg&epi=je6NUbpObpQ-mo17T_cKvNZQ1Y5AZc7rKg&irgwc=1&OCID=AID681541_aff_7593_1243925&tduid=(ir__9xciw9kee9kfr1202j3ttrvko32xhpb031pfjc1u00)(7593)(1243925)(je6NUbpObpQ-mo17T_cKvNZQ1Y5AZc7rKg)()&irclickid=_9xciw9kee9kfr1202j3ttrvko32xhpb031pfjc1u00) which primarily allows to create web applications using server languages and html(with options for javascript interop as well) that can run through WebAssembly in browser. After watching the video 

{% youtube GI_9g9lZpik %} 

late last year have tried out demo project using *Blazor's server side template* ([an option while creating new project](https://blazor.net/docs/get-started.html)) {% github NileshSP/dotnetefrazorcompssr %} with working [demo link](https://dotnetefrazorcompssr.herokuapp.com/websitesdata) as 

![Alt image to text](https://thepracticaldev.s3.amazonaws.com/i/n3nazt2d8agt0650t0wb.gif)<sub>[Live app link](https://dotnetefrazorcompssr.herokuapp.com/websitesdata) - is made available on heroku by hosting app as a container using docker</sub>

Most of the rendered code to display elements like filters, table with data and continuously updating *Current server time* option are all in one [file](https://github.com/NileshSP/dotnetefrazorcompssr/blob/master/DotnetEFRazorCompSSR.App/Pages/WebsitesData.cshtml) with no javascript other than required c#, css & html

Regarding realtime functionality, 
- *Current server time* is continuously being updated from server using timer with interval of 1000ms
- Table data for each row is being made available at an interval of 100ms (kind of streaming like functionality where in whenever associated data entity is added with new item it is being streamed and made available to client in the browser)  

And the best part is download size over to the client browser is very less, in this case it's 2.9KB overall

![Alt image to text](https://thepracticaldev.s3.amazonaws.com/i/e1mra42wzwaf3v9ngygi.jpg)

This led me to think about creating real-time applications with new approach requiring minimal overhead of working along multiple languages or technologies with overall less code

Let me know guys what do think & thanks for stopping by!