[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"sanity-UOj1Zo89ZVjVfhXOu93NNOYB92FCODAz-BPnOCkPh9o":3,"sanity-qhJZUXBJFdE4o8UGEfCqXkWy-_Ww1ExSXNdHc1Nb9Pk":917},{"data":4,"sourceMap":-1},{"latestPodcast":5,"latestReleases":14,"post":39,"recent":892},[6],{"_id":7,"publishedAt":8,"slug":9,"sponsored":12,"title":13},"d53f9358-3bb2-4f69-aebe-d31d19522cd4","2026-07-10T07:40:00.000Z",{"_type":10,"current":11},"slug","building-more-than-just-an-agent-harness",null,"Building more than just an agent harness",[15,21,27,33],{"_id":16,"publishedAt":17,"slug":18,"title":20},"eb5b66eb-9410-4329-83bb-22bbff39402a","2026-04-28T13:00:00.000Z",{"_type":10,"current":19},"turn-scattered-knowledge-into-trusted-intelligence","Turning scattered knowledge into trusted intelligence: Stack Internal 2026.3",{"_id":22,"publishedAt":23,"slug":24,"title":26},"369c2401-b62e-4a37-8ff8-bf603023ecad","2026-03-02T15:03:00.988Z",{"_type":10,"current":25},"what-s-new-at-stack-overflow-march-2026","What’s new at Stack Overflow: March 2026",{"_id":28,"publishedAt":29,"slug":30,"title":32},"5e9053a4-07ea-447c-91ea-29e0b6228537","2026-02-02T15:00:00.000Z",{"_type":10,"current":31},"what-s-new-at-stack-overflow-february-2026","What’s new at Stack Overflow: February 2026",{"_id":34,"publishedAt":35,"slug":36,"title":38},"a1b538eb-a8a6-46d0-80a1-ac70ec9bb935","2026-01-05T10:00:00.000-05:00",{"_type":10,"current":37},"what-s-new-at-stack-overflow-january-2026","What’s new at Stack Overflow: January 2026",{"_createdAt":40,"_id":41,"_rev":42,"_type":43,"_updatedAt":44,"author":45,"body":62,"comments":837,"dateUrl":838,"excerpt":839,"image":840,"legacyBody":843,"product":12,"publishedAt":846,"slug":847,"sponsored":12,"tags":849,"title":891,"visible":837},"2023-05-25T09:39:13Z","wp-post-15175","07ZbrKPSUrjrV4wQ6fIhWF","blogPost","2023-07-13T14:55:31Z",[46],{"_createdAt":47,"_id":48,"_rev":49,"_type":50,"_updatedAt":51,"avatar":52,"bio":57,"employee":58,"name":59,"slug":60},"2023-05-23T16:27:18Z","wp-author-cap-15177","07ZbrKPSUrjrV4wQ6fDpaa","blogAuthor","2023-06-20T15:05:10Z",{"_type":53,"asset":54},"image",{"_ref":55,"_type":56},"image-917c633c57cbb0483e60c7e3c67959e8f5677183-40x40-jpg","reference","Chris is a Microsoft MVP, software engineer and blogger with over 15 years of experience working with ASP.NET.\n\nChris is passionate about sharing his knowledge with the community and is an avid blogger and speaker. A strong believer in open source, he maintains several projects under the GitHub organisation, Blazored. He also contributes to other projects as much as possible. Chris is a proud member of the .NET Foundation.\n\nYou can find Chris online at his blog chrissainty.com and on Twitter as @chris_sainty.","none","Chris Sainty",{"current":61},"chris-sainty",[63,74,82,113,121,162,170,180,188,196,204,209,218,226,238,252,264,276,286,298,310,321,332,344,355,365,384,392,400,408,416,420,428,436,444,452,460,468,472,491,499,507,515,531,539,553,561,569,577,585,593,601,609,617,625,633,641,649,657,665,673,677,696,704,712,719,727,735,743,751,758,766,774,782,789,797,805,813,821,829],{"_key":64,"_type":65,"children":66,"markDefs":72,"style":73},"ca801f5a98e3","block",[67],{"_key":68,"_type":69,"marks":70,"text":71},"ca801f5a98e30","span",[],"If you've been keeping up with the latest developments in the .NET world over the past year or two, you've probably heard the word Blazor mentioned once or twice. Blazor is a new client-side UI framework from theASP.NET team. Its big selling point is the ability to write rich web UI experiences using HTML, CSS, and C# instead of JavaScript—something a lot of developers have been dreaming of.",[],"normal",{"_key":75,"_type":65,"children":76,"markDefs":81,"style":73},"695116004527",[77],{"_key":78,"_type":69,"marks":79,"text":80},"6951160045270",[],"While JavaScript has been the defacto standard for front-end web development since its inception, we’ve never really seemed to be happy with it. I mean, how many superset or transpile to JavaScript languages have sprung up over the years to help improve JavaScript and make it more maintainable? CoffeeScript, Dart, Elm and Scala—to name but a few.",[],{"_key":83,"_type":65,"children":84,"markDefs":107,"style":73},"c1f55f34a741",[85,89,94,98,103],{"_key":86,"_type":69,"marks":87,"text":88},"c1f55f34a7410",[],"Looking at the ",{"_key":90,"_type":69,"marks":91,"text":93},"c1f55f34a7411",[92],"110005200794","most loved",{"_key":95,"_type":69,"marks":96,"text":97},"c1f55f34a7412",[]," languages, TypeScript, a language designed by the legendary ",{"_key":99,"_type":69,"marks":100,"text":102},"c1f55f34a7413",[101],"cc0e88506d29","Anders Hejlsberg",{"_key":104,"_type":69,"marks":105,"text":106},"c1f55f34a7414",[],", tops the list. The same man who designed C#, no less. It adds features such as interfaces, classes, compile time type-checking, even generics. However, all those features and more already exist in C#, and have done for years. C# is a powerful, flexible, feature rich language that is easy to learn.",[108,111],{"_key":92,"_type":109,"href":110,"reference":12},"link","https:\u002F\u002Finsights.stackoverflow.com\u002Fsurvey\u002F2019#most-loved-dreaded-and-wanted",{"_key":101,"_type":109,"href":112,"reference":12},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FAnders_Hejlsberg",{"_key":114,"_type":65,"children":115,"markDefs":120,"style":73},"0b99db855102",[116],{"_key":117,"_type":69,"marks":118,"text":119},"0b99db8551020",[],"But Blazor has already started to show it has potential as a highly efficient and productive programming model outside of its original design—as a direct competitor to JavaScript single page application (SPA) frameworks.",[],{"_key":122,"_type":65,"children":123,"markDefs":155,"style":73},"b43400430853",[124,128,133,137,142,146,151],{"_key":125,"_type":69,"marks":126,"text":127},"b434004308530",[],"Microsoft already has multiple experiments going on with Blazor, trialling it with desktop applications using ",{"_key":129,"_type":69,"marks":130,"text":132},"b434004308531",[131],"94461cbf95d9","Electron",{"_key":134,"_type":69,"marks":135,"text":136},"b434004308532",[]," and ",{"_key":138,"_type":69,"marks":139,"text":141},"b434004308533",[140],"c062c88f06f1","WebWindow",{"_key":143,"_type":69,"marks":144,"text":145},"b434004308534",[]," (an experimental lightweight alternative to Electron). But most recently, for native mobile app development where the Blazor programming model is mixed with native ",{"_key":147,"_type":69,"marks":148,"text":150},"b434004308535",[149],"80080240e995","Xamarin",{"_key":152,"_type":69,"marks":153,"text":154},"b434004308536",[]," forms controls.",[156,158,160],{"_key":131,"_type":109,"href":157,"reference":12},"https:\u002F\u002Fwww.electronjs.org\u002F",{"_key":140,"_type":109,"href":159,"reference":12},"https:\u002F\u002Fwww.nuget.org\u002Fpackages\u002FWebWindow",{"_key":149,"_type":109,"href":161,"reference":12},"https:\u002F\u002Fdotnet.microsoft.com\u002Fapps\u002Fxamarin",{"_key":163,"_type":65,"children":164,"markDefs":169,"style":73},"0609cc0da11a",[165],{"_key":166,"_type":69,"marks":167,"text":168},"0609cc0da11a0",[],"Could we be seeing the start of a single unified UI framework for building any type of application with .NET, be it web, desktop, or mobile? I don't know about you, but I certainly find that an exciting prospect.",[],{"_key":171,"_type":65,"children":172,"markDefs":178,"style":179},"72e36ea96fa2",[173],{"_key":174,"_type":69,"marks":175,"text":177},"72e36ea96fa20",[176],"strong","What makes Blazor so flexible?",[],"h2",{"_key":181,"_type":65,"children":182,"markDefs":187,"style":73},"35e98c82071c",[183],{"_key":184,"_type":69,"marks":185,"text":186},"35e98c82071c0",[],"To answer this question, we need to understand how Blazor has been architected.",[],{"_key":189,"_type":65,"children":190,"markDefs":195,"style":73},"4ec7fae9b1e5",[191],{"_key":192,"_type":69,"marks":193,"text":194},"4ec7fae9b1e50",[],"Essentially, Blazor has a separation between how it calculates UI changes (app\u002Fcomponent model) and how those changes are applied (renderer). This sets Blazor apart from other UI frameworks such as Angular or ReactJS\u002FReact Native that can only create web technology based UIs. By using different renderers Blazor is able to create not only web based UIs, but also native mobile UIs as well.",[],{"_key":197,"_type":65,"children":198,"markDefs":203,"style":73},"182f8165c42d",[199],{"_key":200,"_type":69,"marks":201,"text":202},"182f8165c42d0",[],"This does require components to be authored differently, so components written for web renderers can’t be used with native mobile renderers. However, the programming model is the same. Meaning once developers are familiar with it, they can create UIs using any renderer.",[],{"_key":205,"_type":53,"alt":12,"asset":206,"caption":208,"markDefs":12},"2efea0badf69",{"_ref":207,"_type":56},"image-c5418a0a12bed13b4e8bf0e2c5f84b1b1fddbd8a-673x748-png","",{"_key":210,"_type":65,"children":211,"markDefs":216,"style":217},"f37c705abdac",[212],{"_key":213,"_type":69,"marks":214,"text":215},"f37c705abdac0",[176],"Render\u002FHosting Model",[],"h3",{"_key":219,"_type":65,"children":220,"markDefs":225,"style":73},"97fe691dc47b",[221],{"_key":222,"_type":69,"marks":223,"text":224},"97fe691dc47b0",[],"At its core, Blazor's app\u002Fcomponent model is responsible for calculating UI changes, but you can use different renderers to control how the UI is actually displayed and updated. These renderers are more commonly referred to as hosting models. At the time of writing, there are four hosting models for Blazor in various stages of development.\n",[],{"_key":227,"_type":65,"children":228,"markDefs":237,"style":73},"df23b494b0a2",[229,233],{"_key":230,"_type":69,"marks":231,"text":232},"df23b494b0a20",[176],"Blazor Server ",{"_key":234,"_type":69,"marks":235,"text":236},"df23b494b0a21",[],"(Remote Renderer)",[],{"_key":239,"_type":65,"children":240,"level":249,"listItem":250,"markDefs":251,"style":73},"421a85af493a",[241,245],{"_key":242,"_type":69,"marks":243,"text":244},"421a85af493a0",[],"Platform: ",{"_key":246,"_type":69,"marks":247,"text":248},"421a85af493a1",[176],"Web",1,"bullet",[],{"_key":253,"_type":65,"children":254,"level":249,"listItem":250,"markDefs":263,"style":73},"efdb67a221b1",[255,259],{"_key":256,"_type":69,"marks":257,"text":258},"efdb67a221b10",[],"Status - ",{"_key":260,"_type":69,"marks":261,"text":262},"efdb67a221b11",[176],"GA\u002FProduction Supported",[],{"_key":265,"_type":65,"children":266,"markDefs":275,"style":73},"b698bff75516",[267,271],{"_key":268,"_type":69,"marks":269,"text":270},"b698bff755160",[176],"Blazor WebAssembly ",{"_key":272,"_type":69,"marks":273,"text":274},"b698bff755161",[],"(WebAssembly Renderer)",[],{"_key":277,"_type":65,"children":278,"level":249,"listItem":250,"markDefs":285,"style":73},"f88100fc3ff7",[279,282],{"_key":280,"_type":69,"marks":281,"text":244},"f88100fc3ff70",[],{"_key":283,"_type":69,"marks":284,"text":248},"f88100fc3ff71",[176],[],{"_key":287,"_type":65,"children":288,"level":249,"listItem":250,"markDefs":297,"style":73},"21e1a0a48fa4",[289,293],{"_key":290,"_type":69,"marks":291,"text":292},"21e1a0a48fa40",[],"Status: ",{"_key":294,"_type":69,"marks":295,"text":296},"21e1a0a48fa41",[176],"Preview (Committed Product)",[],{"_key":299,"_type":65,"children":300,"markDefs":309,"style":73},"a66387e2fd98",[301,305],{"_key":302,"_type":69,"marks":303,"text":304},"a66387e2fd980",[176],"Blazor Electron ",{"_key":306,"_type":69,"marks":307,"text":308},"a66387e2fd981",[],"(Electron Renderer)",[],{"_key":311,"_type":65,"children":312,"level":249,"listItem":250,"markDefs":320,"style":73},"2551eb05fa80",[313,316],{"_key":314,"_type":69,"marks":315,"text":244},"2551eb05fa800",[],{"_key":317,"_type":69,"marks":318,"text":319},"2551eb05fa801",[176],"Desktop (Windows, Mac, and Linux)",[],{"_key":322,"_type":65,"children":323,"level":249,"listItem":250,"markDefs":331,"style":73},"bc48c53aaff4",[324,327],{"_key":325,"_type":69,"marks":326,"text":292},"bc48c53aaff40",[],{"_key":328,"_type":69,"marks":329,"text":330},"bc48c53aaff41",[176],"Experimental (Not Committed)",[],{"_key":333,"_type":65,"children":334,"markDefs":343,"style":73},"1f95dbf0953f",[335,339],{"_key":336,"_type":69,"marks":337,"text":338},"1f95dbf0953f0",[176],"Mobile Blazor Bindings",{"_key":340,"_type":69,"marks":341,"text":342},"1f95dbf0953f1",[]," (MobileBlazorBindings Renderer)",[],{"_key":345,"_type":65,"children":346,"level":249,"listItem":250,"markDefs":354,"style":73},"40de5843f888",[347,350],{"_key":348,"_type":69,"marks":349,"text":244},"40de5843f8880",[],{"_key":351,"_type":69,"marks":352,"text":353},"40de5843f8881",[176],"Mobile (iOS and Android)",[],{"_key":356,"_type":65,"children":357,"level":249,"listItem":250,"markDefs":364,"style":73},"06cde38f75c7",[358,361],{"_key":359,"_type":69,"marks":360,"text":292},"06cde38f75c70",[],{"_key":362,"_type":69,"marks":363,"text":330},"06cde38f75c71",[176],[],{"_key":366,"_type":65,"children":367,"markDefs":381,"style":73},"5adb61d5279d",[368,372,377],{"_key":369,"_type":69,"marks":370,"text":371},"5adb61d5279d0",[],"Blazor Server is the only production supported model at the time of writing. Blazor WebAssembly is due for release around May 2020—I would expect this could be the big announcement at ",{"_key":373,"_type":69,"marks":374,"text":376},"5adb61d5279d1",[375],"4adcaa99f311","Build",{"_key":378,"_type":69,"marks":379,"text":380},"5adb61d5279d2",[],". Blazor Electron and Mobile Blazor Bindings are both marked as experimental and Microsoft hasn't yet committed to shipping these.",[382],{"_key":375,"_type":109,"href":383,"reference":12},"https:\u002F\u002Fwww.microsoft.com\u002Fen-us\u002Fbuild",{"_key":385,"_type":65,"children":386,"markDefs":391,"style":217},"b24489d2e28b",[387],{"_key":388,"_type":69,"marks":389,"text":390},"b24489d2e28b0",[176],"App\u002FComponent Model",[],{"_key":393,"_type":65,"children":394,"markDefs":399,"style":73},"bc0e0236456b",[395],{"_key":396,"_type":69,"marks":397,"text":398},"bc0e0236456b0",[],"This is the engine room of the framework. Here we can find all the non-UI specific elements which make Blazor work. The programming model, routing and navigation, and the render tree, which is Blazor's mechanism for calculating UI changes.",[],{"_key":401,"_type":65,"children":402,"markDefs":407,"style":73},"40cf56d4d9ef",[403],{"_key":404,"_type":69,"marks":405,"text":406},"40cf56d4d9ef0",[],"The part I want to focus on though is the programming model. Out of the four hosting models I talked about above, the first three have one thing in common, they all understand web standards. Components authored to target these hosting models will be using HTML and CSS. But the fourth model, Mobile Blazor bindings, doesn't understand web standards at all. Applications built for this hosting model will need to have their components written using native mobile controls.",[],{"_key":409,"_type":65,"children":410,"markDefs":415,"style":73},"1cf5d50fc628",[411],{"_key":412,"_type":69,"marks":413,"text":414},"1cf5d50fc6280",[],"To give a more visual example, let's look at the same component written for Blazor WebAssembly, which uses a web standards compliant renderer, vs Mobile Blazor Bindings, which uses the non-web standards-based renderer.",[],{"_key":417,"_type":418,"code":419,"markDefs":12},"c629884ee4d5","code"," \u002F\u002F WebAssembly Renderer\n\n\u003Cdiv>\n \u003Cp>Current count: @currentCount\u003C\u002Fp>\n \u003Cbutton class=\"btn btn-primary\" @onclick=\"IncrementCount\">Click me\u003C\u002Fbutton>\n\u003C\u002Fdiv>\n\n@code {\n    private int currentCount = 0;\n\n    private void IncrementCount()\n    {\n        currentCount++;\n    }\n}\n\n\u002F\u002F MobileBlazorBindings Renderer\n\n\u003CStackLayout>\n \u003CLabel FontSize=\"30\" Text=\"@($\"Current count: {currentCount}\")\" \u002F>\n \u003CButton Text=\"Click me\" OnClick=\"@IncrementCount\" \u002F>\n\u003C\u002FStackLayout>\n\n@code {\n    private int currentCount = 0;\n\n    private void IncrementCount()\n    {\n        currentCount++;\n    }\n}\n\n",{"_key":421,"_type":65,"children":422,"markDefs":427,"style":73},"00dd5a629fb5",[423],{"_key":424,"_type":69,"marks":425,"text":426},"00dd5a629fb50",[],"It's easy to see the differences between the two code samples, but what I want you to focus on the similarities.",[],{"_key":429,"_type":65,"children":430,"markDefs":435,"style":73},"b66d5f4acf4d",[431],{"_key":432,"_type":69,"marks":433,"text":434},"b66d5f4acf4d0",[],"Both samples have a markup section and a code block. In fact, the code blocks are identical between the samples. They each have an `OnClick` event with a specified handler and both use expressions to output the value of the current count field.",[],{"_key":437,"_type":65,"children":438,"markDefs":443,"style":73},"db6639ba81fe",[439],{"_key":440,"_type":69,"marks":441,"text":442},"db6639ba81fe0",[],"The point I'm making here is the programming model is the same. And this is the power of Blazor, learn the programming model and, save a few tweaks here and there, you're going to be able to produce UI for any type of app, on any platform—that's something we've not been able to do before with .NET.",[],{"_key":445,"_type":65,"children":446,"markDefs":451,"style":73},"576334569568",[447],{"_key":448,"_type":69,"marks":449,"text":450},"5763345695680",[],"Now we have a bit more of an understanding about how Blazor is put together, I want to talk a bit about the two main hosting models, Blazor Server and Blazor WebAssembly.",[],{"_key":453,"_type":65,"children":454,"markDefs":459,"style":179},"a692d81dd0c5",[455],{"_key":456,"_type":69,"marks":457,"text":458},"a692d81dd0c50",[176],"Blazor Server",[],{"_key":461,"_type":65,"children":462,"markDefs":467,"style":73},"a8b647da9595",[463],{"_key":464,"_type":69,"marks":465,"text":466},"a8b647da95950",[],"The Blazor Server hosting model is currently the only production supported option for Blazor development right now. It was released back in September 2019 with .NET Core 3, during .NET Conf.",[],{"_key":469,"_type":53,"alt":12,"asset":470,"caption":208,"markDefs":12},"3d8b062420eb",{"_ref":471,"_type":56},"image-1df1f68bb5b9c0f3affa39dd8c4dc37025295706-636x403-png",{"_key":473,"_type":65,"children":474,"markDefs":488,"style":73},"38f9f14a5b88",[475,479,484],{"_key":476,"_type":69,"marks":477,"text":478},"38f9f14a5b880",[],"In this model, the Blazor application runs on the server on top of the full .NET Core runtime. When the user loads the application a small JavaScript file is downloaded which establishes a real-time, two-way ",{"_key":480,"_type":69,"marks":481,"text":483},"38f9f14a5b881",[482],"f9d7f61aa89e","SignalR",{"_key":485,"_type":69,"marks":486,"text":487},"38f9f14a5b882",[]," connection with the server. Any interaction that the user has with the app is then transmitted back to the server over the SignalR connection for the server to process. After the server is done, any UI updates are transmitted back to the client and applied to the DOM.",[489],{"_key":482,"_type":109,"href":490,"reference":12},"https:\u002F\u002Fdocs.microsoft.com\u002Fen-us\u002Faspnet\u002Fcore\u002Fsignalr\u002Fintroduction?view=aspnetcore-3.1",{"_key":492,"_type":65,"children":493,"markDefs":498,"style":73},"e2bd85b3071a",[494],{"_key":495,"_type":69,"marks":496,"text":497},"e2bd85b3071a0",[],"Now, I know what you're thinking. There is no way that that can be performant, all of those interactions and UI updates being constantly sent back and forth. But I think you'll actually be surprised.",[],{"_key":500,"_type":65,"children":501,"markDefs":506,"style":73},"ecd78544e3e2",[502],{"_key":503,"_type":69,"marks":504,"text":505},"ecd78544e3e20",[],"The team did some load testing on Blazor Server to establish what it could and couldn't deal with and this is what they found.",[],{"_key":508,"_type":65,"children":509,"markDefs":514,"style":73},"bc8ea004e9b3",[510],{"_key":511,"_type":69,"marks":512,"text":513},"bc8ea004e9b30",[176],"Test 1 - Standard D1 v2 instance on Azure (1vCPU & 3.5GB memory)",[],{"_key":516,"_type":65,"children":517,"markDefs":530,"style":73},"ed16eed9a740",[518,522,526],{"_key":519,"_type":69,"marks":520,"text":521},"ed16eed9a7400",[],"The application could handle ",{"_key":523,"_type":69,"marks":524,"text":525},"ed16eed9a7401",[176],"over 5000 concurrent active users",{"_key":527,"_type":69,"marks":528,"text":529},"ed16eed9a7402",[]," without any visible degradation in performance.",[],{"_key":532,"_type":65,"children":533,"markDefs":538,"style":73},"f614d1d7d08a",[534],{"_key":535,"_type":69,"marks":536,"text":537},"f614d1d7d08a0",[176],"Test 2 - Standard D3 v2 instance on Azure (4vCPU & 14GB memory)",[],{"_key":540,"_type":65,"children":541,"markDefs":552,"style":73},"4ee1c429304c",[542,545,549],{"_key":543,"_type":69,"marks":544,"text":521},"4ee1c429304c0",[],{"_key":546,"_type":69,"marks":547,"text":548},"4ee1c429304c1",[176],"over 20,000 concurrent active users",{"_key":550,"_type":69,"marks":551,"text":529},"4ee1c429304c2",[],[],{"_key":554,"_type":65,"children":555,"markDefs":560,"style":73},"671823faafdb",[556],{"_key":557,"_type":69,"marks":558,"text":559},"671823faafdb0",[],"These are pretty impressive figures, I think you'll agree. The major findings which came out of these experiments were that memory and latency are the main bottlenecks of Blazor Server applications. If latency got above 200ms then performance took a hit and scale was limited by the available memory on the box.",[],{"_key":562,"_type":65,"children":563,"markDefs":568,"style":217},"c84aae845dd2",[564],{"_key":565,"_type":69,"marks":566,"text":567},"c84aae845dd20",[176],"Benefits",[],{"_key":570,"_type":65,"children":571,"level":249,"listItem":250,"markDefs":576,"style":73},"ace374192b1c",[572],{"_key":573,"_type":69,"marks":574,"text":575},"ace374192b1c0",[],"Runs on the full .NET Core runtime",[],{"_key":578,"_type":65,"children":579,"level":249,"listItem":250,"markDefs":584,"style":73},"11d7779c5c47",[580],{"_key":581,"_type":69,"marks":582,"text":583},"11d7779c5c470",[],"Fast development cycle",[],{"_key":586,"_type":65,"children":587,"level":249,"listItem":250,"markDefs":592,"style":73},"fdce669aee30",[588],{"_key":589,"_type":69,"marks":590,"text":591},"fdce669aee300",[],"Small download size",[],{"_key":594,"_type":65,"children":595,"level":249,"listItem":250,"markDefs":600,"style":73},"f11d24932382",[596],{"_key":597,"_type":69,"marks":598,"text":599},"f11d249323820",[],"Code is kept on the server and not downloaded to the client",[],{"_key":602,"_type":65,"children":603,"markDefs":608,"style":217},"fa71a6c9fdc1",[604],{"_key":605,"_type":69,"marks":606,"text":607},"fa71a6c9fdc10",[176],"Drawbacks",[],{"_key":610,"_type":65,"children":611,"level":249,"listItem":250,"markDefs":616,"style":73},"23bf018fa1ce",[612],{"_key":613,"_type":69,"marks":614,"text":615},"23bf018fa1ce0",[],"Doesn't work well in high latency environments",[],{"_key":618,"_type":65,"children":619,"level":249,"listItem":250,"markDefs":624,"style":73},"6ee2ed5fe711",[620],{"_key":621,"_type":69,"marks":622,"text":623},"6ee2ed5fe7110",[],"No offline support—requires a constant connection to the server",[],{"_key":626,"_type":65,"children":627,"level":249,"listItem":250,"markDefs":632,"style":73},"806d9453f798",[628],{"_key":629,"_type":69,"marks":630,"text":631},"806d9453f7980",[],"Heavy resource demand on the server",[],{"_key":634,"_type":65,"children":635,"markDefs":640,"style":217},"870c0dbb7834",[636],{"_key":637,"_type":69,"marks":638,"text":639},"870c0dbb78340",[176],"Ideal use case",[],{"_key":642,"_type":65,"children":643,"markDefs":648,"style":73},"fbd68209cc4d",[644],{"_key":645,"_type":69,"marks":646,"text":647},"fbd68209cc4d0",[],"I honestly think Blazor Server can be used for lots of scenarios, but its niche will be in intranet applications or low demand public-facing apps. The speed of development with this hosting model is obscenely quick, and I mean fast, due to everything being on the server. There is no need for separate API projects, for example, you can just consume application services directly in your components. I was sceptical of Blazor Server at first, but I have to say, I have been really surprised with what it can do.",[],{"_key":650,"_type":65,"children":651,"markDefs":656,"style":179},"cca2827cd96a",[652],{"_key":653,"_type":69,"marks":654,"text":655},"cca2827cd96a0",[176],"Blazor WebAssembly",[],{"_key":658,"_type":65,"children":659,"markDefs":664,"style":73},"a8f37b0ffbbd",[660],{"_key":661,"_type":69,"marks":662,"text":663},"a8f37b0ffbbd0",[],"This is the big one, the hosting model that usually gets most interest, and for good reason. This model offers a direct competitor to JavaScript SPAs such as Angular, VueJS, and React.",[],{"_key":666,"_type":65,"children":667,"markDefs":672,"style":73},"92b7f7e6f91a",[668],{"_key":669,"_type":69,"marks":670,"text":671},"92b7f7e6f91a0",[],"By using WebAssembly, we are able to write our UI logic using C# and not JavaScript. It's currently in preview and due for release around May 2020.",[],{"_key":674,"_type":53,"alt":12,"asset":675,"caption":208,"markDefs":12},"d4b5b7337a3a",{"_ref":676,"_type":56},"image-8f25663d02bc3845d2b092b513b591f77d6c34f6-477x402-png",{"_key":678,"_type":65,"children":679,"markDefs":693,"style":73},"618d6b0dbd1e",[680,684,689],{"_key":681,"_type":69,"marks":682,"text":683},"618d6b0dbd1e0",[],"A version of the ",{"_key":685,"_type":69,"marks":686,"text":688},"618d6b0dbd1e1",[687],"4a3992f3c4b1","Mono .NET runtime",{"_key":690,"_type":69,"marks":691,"text":692},"618d6b0dbd1e2",[],", compiled to WebAssembly, is downloaded to the client’s browser along with the application DLLs and any dependencies. Once everything is in the browser, the Mono runtime is bootstrapped, and it, in turn, loads and executes the application DLLs.",[694],{"_key":687,"_type":109,"href":695,"reference":12},"https:\u002F\u002Fwww.mono-project.com\u002F",{"_key":697,"_type":65,"children":698,"markDefs":703,"style":73},"ba0ee02833f3",[699],{"_key":700,"_type":69,"marks":701,"text":702},"ba0ee02833f30",[],"I'm going to address the first question that usually arises from hearing the above explanation, what is the download size? Well, the current preview weighs in at around 2.4mb, that's pretty impressive considering there’s a .NET runtime involved. But I appreciate that this isn't amazing when compared to some JavaScript frameworks. By the time the WebAssembly hosting model is released in May, the team hopes to cut that size significantly. The first prototype of Blazor used a very compact .NET runtime, which compiled to just 60k of WebAssembly code. I believe major size improvements are just a matter of time.",[],{"_key":705,"_type":65,"children":706,"markDefs":711,"style":73},"02dcf7cc8da1",[707],{"_key":708,"_type":69,"marks":709,"text":710},"02dcf7cc8da10",[],"Currently, Blazor WebAssembly uses interpreted mode to load and run your application. In this mode, the Mono IL interpreter executes your applications .NET DLLs inside the browser. The only part of the process that is compiled to WebAssembly is the Mono runtime. In the future, the team are looking to allow developers to choose if their apps, or more likely parts of their apps, will be compiled to WebAssembly as well—This is known as AOT or Ahead Of Time compilation. The benefit of this mode is performance, the trade-off is a larger download size.",[],{"_key":713,"_type":65,"children":714,"markDefs":718,"style":217},"71fde17bacbc",[715],{"_key":716,"_type":69,"marks":717,"text":567},"71fde17bacbc0",[176],[],{"_key":720,"_type":65,"children":721,"level":249,"listItem":250,"markDefs":726,"style":73},"725e9716a8ad",[722],{"_key":723,"_type":69,"marks":724,"text":725},"725e9716a8ad0",[],"Compiles to static files, meaning there is no need for a .NET runtime on the server",[],{"_key":728,"_type":65,"children":729,"level":249,"listItem":250,"markDefs":734,"style":73},"65a5da76e176",[730],{"_key":731,"_type":69,"marks":732,"text":733},"65a5da76e1760",[],"Work is offloaded from the server to the client",[],{"_key":736,"_type":65,"children":737,"level":249,"listItem":250,"markDefs":742,"style":73},"7acf5724863f",[738],{"_key":739,"_type":69,"marks":740,"text":741},"7acf5724863f0",[],"Apps can be run in an offline state",[],{"_key":744,"_type":65,"children":745,"level":249,"listItem":250,"markDefs":750,"style":73},"1cffb966e88c",[746],{"_key":747,"_type":69,"marks":748,"text":749},"1cffb966e88c0",[],"Codesharing, C# objects can be shared between client and server easily",[],{"_key":752,"_type":65,"children":753,"markDefs":757,"style":217},"9d2304198014",[754],{"_key":755,"_type":69,"marks":756,"text":607},"9d23041980140",[176],[],{"_key":759,"_type":65,"children":760,"level":249,"listItem":250,"markDefs":765,"style":73},"9d137fce050f",[761],{"_key":762,"_type":69,"marks":763,"text":764},"9d137fce050f0",[],"Payload. Right now if you create a fresh new Blazor project, it weighs in at around 2.4mb. The team hopes to cut this down significantly come May.",[],{"_key":767,"_type":65,"children":768,"level":249,"listItem":250,"markDefs":773,"style":73},"1c0c1362dc64",[769],{"_key":770,"_type":69,"marks":771,"text":772},"1c0c1362dc640",[],"Load time. Due to download size, devices on poor connections can experience longer initial load times.",[],{"_key":775,"_type":65,"children":776,"level":249,"listItem":250,"markDefs":781,"style":73},"f7dc0de18c16",[777],{"_key":778,"_type":69,"marks":779,"text":780},"f7dc0de18c160",[],"Restricted runtime. Apps have to operate in the browser’s sandbox and are subject to the same security restrictions as any JavaScript application.",[],{"_key":783,"_type":65,"children":784,"markDefs":788,"style":217},"fc745c39ec9c",[785],{"_key":786,"_type":69,"marks":787,"text":639},"fc745c39ec9c0",[176],[],{"_key":790,"_type":65,"children":791,"markDefs":796,"style":73},"4e19dfa916c4",[792],{"_key":793,"_type":69,"marks":794,"text":795},"4e19dfa916c40",[],"Blazor WebAssembly is built to be a direct competitor to modern JavaScript frameworks. Therefore, anywhere you would be looking to use one of those frameworks, you could consider Blazor. It's also trivial to make Blazor WebAssembly apps into PWAs (Progressive Web Application). In fact, there will be an out of the box template for this coming in May.",[],{"_key":798,"_type":65,"children":799,"markDefs":804,"style":73},"83d51ab42553",[800],{"_key":801,"_type":69,"marks":802,"text":803},"83d51ab425530",[],"It's also important to point out that using Blazor WebAssembly doesn't require you to use .NET on the server. Meaning if you have a backend written in Node, PHP, or Rails you can happily use Blazor as the frontend without any issues as Blazor WebAssembly compiles to static files.",[],{"_key":806,"_type":65,"children":807,"markDefs":812,"style":179},"7ea94cb23fdc",[808],{"_key":809,"_type":69,"marks":810,"text":811},"7ea94cb23fdc0",[176],"What's the future of Blazor?",[],{"_key":814,"_type":65,"children":815,"markDefs":820,"style":73},"479ec9fc7178",[816],{"_key":817,"_type":69,"marks":818,"text":819},"479ec9fc71780",[],"With one hosting model in production already and another on the way shortly, let's finish by turning our attention to the future.",[],{"_key":822,"_type":65,"children":823,"markDefs":828,"style":73},"604684593824",[824],{"_key":825,"_type":69,"marks":826,"text":827},"6046845938240",[],"Where do I see Blazor going? Coming back to my earlier thought around Blazor becoming a single UI framework for any .NET application. I think this is where Blazor is heading, in my opinion. If all of the current hosting models for Blazor move into production, and right now I can't see why they wouldn't, developers will have the option to learn a single programming model which they can use to create UIs anywhere. This is a big deal.",[],{"_key":830,"_type":65,"children":831,"markDefs":836,"style":73},"777197de543f",[832],{"_key":833,"_type":69,"marks":834,"text":835},"777197de543f0",[],"At a time where there are lots of discussions around the barrier for entry to .NET, with so many choices new developers to the platform have to face, Blazor could offer clarity when it comes to UI, a single programming model, learnt once and applied anywhere. For me, that's the hype with Blazor.\n",[],true,"2020\u002F02\u002F26","Blazor is a new client-side UI framework from the ASP.NET team. Its big selling point is the ability to write rich web UI experiences using HTML, CSS, and C# instead of JavaScript—something a lot of developers have been dreaming of.",{"_type":53,"asset":841},{"_ref":842,"_type":56},"image-9af5c741123286c7a6d41173c438be6231f1bf50-2121x1414-jpg",{"code":844,"language":845},"\u003C!-- wp:paragraph -->\n\u003Cp>If you've been keeping up with the latest developments in the .NET world over the past year or two, you've probably heard the word Blazor mentioned once or twice. Blazor is a new client-side UI framework from the\u003Ca href=\"http:\u002F\u002Fasp.net\"> \u003C\u002Fa>ASP.NET team. Its big selling point is the ability to write rich web UI experiences using HTML, CSS, and C# instead of JavaScript—something a lot of developers have been dreaming of.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>While JavaScript has been the defacto standard for front-end web development since its inception, we’ve never really seemed to be happy with it. I mean, how many superset or transpile to JavaScript languages have sprung up over the years to help improve JavaScript and make it more maintainable? CoffeeScript, Dart, Elm and Scala—to name but a few. \u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Looking at the \u003Ca href=\"https:\u002F\u002Finsights.stackoverflow.com\u002Fsurvey\u002F2019#most-loved-dreaded-and-wanted\">most loved\u003C\u002Fa> languages, TypeScript, a language designed by the legendary \u003Ca href=\"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FAnders_Hejlsberg\">Anders Hejlsberg\u003C\u002Fa>, tops the list. The same man who designed C#, no less. It adds features such as interfaces, classes, compile time type-checking, even generics. However, all those features and more already exist in C#, and have done for years. C# is a powerful, flexible, feature rich language that is easy to learn.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>But Blazor has already started to show it has potential as a highly efficient and productive programming model outside of its original design—as a direct competitor to JavaScript single page application (SPA) frameworks.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Microsoft already has multiple experiments going on with Blazor, trialling it with desktop applications using \u003Ca href=\"https:\u002F\u002Fwww.electronjs.org\u002F\">Electron\u003C\u002Fa> and \u003Ca href=\"https:\u002F\u002Fwww.nuget.org\u002Fpackages\u002FWebWindow\">WebWindow\u003C\u002Fa> (an experimental lightweight alternative to Electron). But most recently, for native mobile app development where the Blazor programming model is mixed with native \u003Ca href=\"https:\u002F\u002Fdotnet.microsoft.com\u002Fapps\u002Fxamarin\">Xamarin\u003C\u002Fa> forms controls.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Could we be seeing the start of a single unified UI framework for building any type of application with .NET, be it web, desktop, or mobile? I don't know about you, but I certainly find that an exciting prospect.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:heading -->\n\u003Ch2>\u003Cstrong>What makes Blazor so flexible?\u003C\u002Fstrong>\u003C\u002Fh2>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>To answer this question, we need to understand how Blazor has been architected.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Essentially, Blazor has a separation between how it calculates UI changes (app\u002Fcomponent model) and how those changes are applied (renderer). This sets Blazor apart from other UI frameworks such as Angular or ReactJS\u002FReact Native that can only create web technology based UIs. By using different renderers Blazor is able to create not only web based UIs, but also native mobile UIs as well.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>This does require components to be authored differently, so components written for web renderers can’t be used with native mobile renderers. However, the programming model is the same. Meaning once developers are familiar with it, they can create UIs using any renderer.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:image -->\n\u003Cfigure class=\"wp-block-image\">\u003Cimg src=\"https:\u002F\u002Flh5.googleusercontent.com\u002F7qSVTvfd6ZYFSsdvRwk_33JmqzlfZlFdF1VVncQYcbR3qSYrrJLd5NkjKD-hnOTcJT103JVlYQT_1dmgnO9TONczizPWqYXs2622cNz2CAiQVBEXlmt4jK8Of0FpFo5rHSHn14Lb\" alt=\"\"\u002F>\u003C\u002Ffigure>\n\u003C!-- \u002Fwp:image -->\n\n\u003C!-- wp:heading {\"level\":3} -->\n\u003Ch3>\u003Cstrong>Render\u002FHosting Model\u003C\u002Fstrong>\u003C\u002Fh3>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>At its core, Blazor's app\u002Fcomponent model is responsible for calculating UI changes, but you can use different renderers to control how the UI is actually displayed and updated. These renderers are more commonly referred to as hosting models. At the time of writing, there are four hosting models for Blazor in various stages of development.\u003Cbr>\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Cstrong>Blazor Server \u003C\u002Fstrong>(Remote Renderer)\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:list -->\n\u003Cul>\u003Cli>Platform: \u003Cstrong>Web\u003C\u002Fstrong>\u003C\u002Fli>\u003Cli>Status - \u003Cstrong>GA\u002FProduction Supported\u003C\u002Fstrong>\u003C\u002Fli>\u003C\u002Ful>\n\u003C!-- \u002Fwp:list -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Cstrong>Blazor WebAssembly \u003C\u002Fstrong>(WebAssembly Renderer)\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:list -->\n\u003Cul>\u003Cli>Platform: \u003Cstrong>Web\u003C\u002Fstrong>\u003C\u002Fli>\u003Cli>Status: \u003Cstrong>Preview (Committed Product)\u003C\u002Fstrong>\u003C\u002Fli>\u003C\u002Ful>\n\u003C!-- \u002Fwp:list -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Cstrong>Blazor Electron \u003C\u002Fstrong>(Electron Renderer)\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:list -->\n\u003Cul>\u003Cli>Platform: \u003Cstrong>Desktop (Windows, Mac, and Linux)\u003C\u002Fstrong>\u003C\u002Fli>\u003Cli>Status: \u003Cstrong>Experimental (Not Committed)\u003C\u002Fstrong>\u003C\u002Fli>\u003C\u002Ful>\n\u003C!-- \u002Fwp:list -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Cstrong>Mobile Blazor Bindings\u003C\u002Fstrong> (MobileBlazorBindings Renderer)\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:list -->\n\u003Cul>\u003Cli>Platform: \u003Cstrong>Mobile (iOS and Android)\u003C\u002Fstrong>\u003C\u002Fli>\u003Cli>Status: \u003Cstrong>Experimental (Not Committed)\u003C\u002Fstrong>\u003C\u002Fli>\u003C\u002Ful>\n\u003C!-- \u002Fwp:list -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Blazor Server is the only production supported model at the time of writing. Blazor WebAssembly is due for release around May 2020—I would expect this could be the big announcement at \u003Ca href=\"https:\u002F\u002Fwww.microsoft.com\u002Fen-us\u002Fbuild\">Build\u003C\u002Fa>. Blazor Electron and Mobile Blazor Bindings are both marked as experimental and Microsoft hasn't yet committed to shipping these.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:heading {\"level\":3} -->\n\u003Ch3>\u003Cstrong>App\u002FComponent Model\u003C\u002Fstrong>\u003C\u002Fh3>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>This is the engine room of the framework. Here we can find all the non-UI specific elements which make Blazor work. The programming model, routing and navigation, and the render tree, which is Blazor's mechanism for calculating UI changes.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The part I want to focus on though is the programming model. Out of the four hosting models I talked about above, the first three have one thing in common, they all understand web standards. Components authored to target these hosting models will be using HTML and CSS. But the fourth model, Mobile Blazor bindings, doesn't understand web standards at all. Applications built for this hosting model will need to have their components written using native mobile controls.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>To give a more visual example, let's look at the same component written for Blazor WebAssembly, which uses a web standards compliant renderer, vs Mobile Blazor Bindings, which uses the non-web standards-based renderer.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:preformatted -->\n\u003Cpre class=\"wp-block-preformatted\"> \u002F\u002F WebAssembly Renderer\n\n<div>\n <p>Current count: @currentCount<\u002Fp>\n <button class=\"btn btn-primary\" @onclick=\"IncrementCount\">Click me<\u002Fbutton>\n<\u002Fdiv>\n\n@code {\n    private int currentCount = 0;\n\n    private void IncrementCount()\n    {\n        currentCount++;\n    }\n}\n\n\u002F\u002F MobileBlazorBindings Renderer\n\n<StackLayout>\n <Label FontSize=\"30\" Text=\"@($\"Current count: {currentCount}\")\" \u002F>\n <Button Text=\"Click me\" OnClick=\"@IncrementCount\" \u002F>\n<\u002FStackLayout>\n\n@code {\n    private int currentCount = 0;\n\n    private void IncrementCount()\n    {\n        currentCount++;\n    }\n}\n\n\u003C\u002Fpre>\n\u003C!-- \u002Fwp:preformatted -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>It's easy to see the differences between the two code samples, but what I want you to focus on the similarities.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Both samples have a markup section and a code block. In fact, the code blocks are identical between the samples. They each have an `OnClick` event with a specified handler and both use expressions to output the value of the current count field.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The point I'm making here is the programming model is the same. And this is the power of Blazor, learn the programming model and, save a few tweaks here and there, you're going to be able to produce UI for any type of app, on any platform—that's something we've not been able to do before with .NET.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Now we have a bit more of an understanding about how Blazor is put together, I want to talk a bit about the two main hosting models, Blazor Server and Blazor WebAssembly.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:heading -->\n\u003Ch2>\u003Cstrong>Blazor Server\u003C\u002Fstrong>\u003C\u002Fh2>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The Blazor Server hosting model is currently the only production supported option for Blazor development right now. It was released back in September 2019 with .NET Core 3, during .NET Conf.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:image -->\n\u003Cfigure class=\"wp-block-image\">\u003Cimg src=\"https:\u002F\u002Flh4.googleusercontent.com\u002FjWAcExuurXUSaF6s4P7JgHvJHSoRpZecXTK9OcryYo3EXXH1L4GGt-zB2Lro4dTytVNL-pw7-PpEX1JUAR939hHnIHe3AJWVSKGQnINVCqSdS_Rm_XX5hTLkipo3GbAlrwFVLUlw\" alt=\"\"\u002F>\u003C\u002Ffigure>\n\u003C!-- \u002Fwp:image -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>In this model, the Blazor application runs on the server on top of the full .NET Core runtime. When the user loads the application a small JavaScript file is downloaded which establishes a real-time, two-way \u003Ca href=\"https:\u002F\u002Fdocs.microsoft.com\u002Fen-us\u002Faspnet\u002Fcore\u002Fsignalr\u002Fintroduction?view=aspnetcore-3.1\">SignalR\u003C\u002Fa> connection with the server. Any interaction that the user has with the app is then transmitted back to the server over the SignalR connection for the server to process. After the server is done, any UI updates are transmitted back to the client and applied to the DOM.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Now, I know what you're thinking. There is no way that that can be performant, all of those interactions and UI updates being constantly sent back and forth. But I think you'll actually be surprised.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The team did some load testing on Blazor Server to establish what it could and couldn't deal with and this is what they found.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Cstrong>Test 1 - Standard D1 v2 instance on Azure (1vCPU & 3.5GB memory)\u003C\u002Fstrong>\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The application could handle \u003Cstrong>over 5000 concurrent active users\u003C\u002Fstrong> without any visible degradation in performance.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Cstrong>Test 2 - Standard D3 v2 instance on Azure (4vCPU & 14GB memory)\u003C\u002Fstrong>\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The application could handle \u003Cstrong>over 20,000 concurrent active users\u003C\u002Fstrong> without any visible degradation in performance.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>These are pretty impressive figures, I think you'll agree. The major findings which came out of these experiments were that memory and latency are the main bottlenecks of Blazor Server applications. If latency got above 200ms then performance took a hit and scale was limited by the available memory on the box.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:heading {\"level\":3} -->\n\u003Ch3>\u003Cstrong>Benefits\u003C\u002Fstrong>\u003C\u002Fh3>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:list -->\n\u003Cul>\u003Cli>Runs on the full .NET Core runtime\u003C\u002Fli>\u003Cli>Fast development cycle\u003C\u002Fli>\u003Cli>Small download size\u003C\u002Fli>\u003Cli>Code is kept on the server and not downloaded to the client\u003C\u002Fli>\u003C\u002Ful>\n\u003C!-- \u002Fwp:list -->\n\n\u003C!-- wp:heading {\"level\":3} -->\n\u003Ch3>\u003Cstrong>Drawbacks\u003C\u002Fstrong>\u003C\u002Fh3>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:list -->\n\u003Cul>\u003Cli>Doesn't work well in high latency environments\u003C\u002Fli>\u003Cli>No offline support—requires a constant connection to the server\u003C\u002Fli>\u003Cli>Heavy resource demand on the server\u003C\u002Fli>\u003C\u002Ful>\n\u003C!-- \u002Fwp:list -->\n\n\u003C!-- wp:heading {\"level\":3} -->\n\u003Ch3>\u003Cstrong>Ideal use case\u003C\u002Fstrong>\u003C\u002Fh3>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>I honestly think Blazor Server can be used for lots of scenarios, but its niche will be in intranet applications or low demand public-facing apps. The speed of development with this hosting model is obscenely quick, and I mean fast, due to everything being on the server. There is no need for separate API projects, for example, you can just consume application services directly in your components. I was sceptical of Blazor Server at first, but I have to say, I have been really surprised with what it can do.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:heading -->\n\u003Ch2>\u003Cstrong>Blazor WebAssembly\u003C\u002Fstrong>\u003C\u002Fh2>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>This is the big one, the hosting model that usually gets most interest, and for good reason. This model offers a direct competitor to JavaScript SPAs such as Angular, VueJS, and React.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>By using WebAssembly, we are able to write our UI logic using C# and not JavaScript. It's currently in preview and due for release around May 2020.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:image -->\n\u003Cfigure class=\"wp-block-image\">\u003Cimg src=\"https:\u002F\u002Flh3.googleusercontent.com\u002FmOlbeBLFNYCEl6CdctXBoadoKK3JRV2wONEStZmheeb0vJXwMPC8FEjDjjmvbH9Hoq_x2G8I03xX8hKlKdXi8azoWX5YXqAfPBLM1aHTWqjj_chj4l7FUjsQMDyT8rvOe55giwRK\" alt=\"\"\u002F>\u003C\u002Ffigure>\n\u003C!-- \u002Fwp:image -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>A version of the \u003Ca href=\"https:\u002F\u002Fwww.mono-project.com\u002F\">Mono .NET runtime\u003C\u002Fa>, compiled to WebAssembly, is downloaded to the client’s browser along with the application DLLs and any dependencies. Once everything is in the browser, the Mono runtime is bootstrapped, and it, in turn, loads and executes the application DLLs.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>I'm going to address the first question that usually arises from hearing the above explanation, what is the download size? Well, the current preview weighs in at around 2.4mb, that's pretty impressive considering there’s a .NET runtime involved. But I appreciate that this isn't amazing when compared to some JavaScript frameworks. By the time the WebAssembly hosting model is released in May, the team hopes to cut that size significantly. The first prototype of Blazor used a very compact .NET runtime, which compiled to just 60k of WebAssembly code. I believe major size improvements are just a matter of time.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Currently, Blazor WebAssembly uses interpreted mode to load and run your application. In this mode, the Mono IL interpreter executes your applications .NET DLLs inside the browser. The only part of the process that is compiled to WebAssembly is the Mono runtime. In the future, the team are looking to allow developers to choose if their apps, or more likely parts of their apps, will be compiled to WebAssembly as well—This is known as AOT or Ahead Of Time compilation. The benefit of this mode is performance, the trade-off is a larger download size.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:heading {\"level\":3} -->\n\u003Ch3>\u003Cstrong>Benefits\u003C\u002Fstrong>\u003C\u002Fh3>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:list -->\n\u003Cul>\u003Cli>Compiles to static files, meaning there is no need for a .NET runtime on the server\u003C\u002Fli>\u003Cli>Work is offloaded from the server to the client\u003C\u002Fli>\u003Cli>Apps can be run in an offline state\u003C\u002Fli>\u003Cli>Codesharing, C# objects can be shared between client and server easily\u003C\u002Fli>\u003C\u002Ful>\n\u003C!-- \u002Fwp:list -->\n\n\u003C!-- wp:heading {\"level\":3} -->\n\u003Ch3>\u003Cstrong>Drawbacks\u003C\u002Fstrong>\u003C\u002Fh3>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:list -->\n\u003Cul>\u003Cli>Payload. Right now if you create a fresh new Blazor project, it weighs in at around 2.4mb. The team hopes to cut this down significantly come May.\u003C\u002Fli>\u003Cli>Load time. Due to download size, devices on poor connections can experience longer initial load times.\u003C\u002Fli>\u003Cli>Restricted runtime. Apps have to operate in the browser’s sandbox and are subject to the same security restrictions as any JavaScript application.\u003C\u002Fli>\u003C\u002Ful>\n\u003C!-- \u002Fwp:list -->\n\n\u003C!-- wp:heading {\"level\":3} -->\n\u003Ch3>\u003Cstrong>Ideal use case\u003C\u002Fstrong>\u003C\u002Fh3>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Blazor WebAssembly is built to be a direct competitor to modern JavaScript frameworks. Therefore, anywhere you would be looking to use one of those frameworks, you could consider Blazor. It's also trivial to make Blazor WebAssembly apps into PWAs (Progressive Web Application). In fact, there will be an out of the box template for this coming in May.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>It's also important to point out that using Blazor WebAssembly doesn't require you to use .NET on the server. Meaning if you have a backend written in Node, PHP, or Rails you can happily use Blazor as the frontend without any issues as Blazor WebAssembly compiles to static files.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:heading -->\n\u003Ch2>\u003Cstrong>What's the future of Blazor?\u003C\u002Fstrong>\u003C\u002Fh2>\n\u003C!-- \u002Fwp:heading -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>With one hosting model in production already and another on the way shortly, let's finish by turning our attention to the future.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Where do I see Blazor going? Coming back to my earlier thought around Blazor becoming a single UI framework for any .NET application. I think this is where Blazor is heading, in my opinion. If all of the current hosting models for Blazor move into production, and right now I can't see why they wouldn't, developers will have the option to learn a single programming model which they can use to create UIs anywhere. This is a big deal.\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>At a time where there are lots of discussions around the barrier for entry to .NET, with so many choices new developers to the platform have to face, Blazor could offer clarity when it comes to UI, a single programming model, learnt once and applied anywhere. For me, that's the hype with Blazor.\u003Cbr>\u003C\u002Fp>\n\u003C!-- \u002Fwp:paragraph -->","html","2020-02-26T15:24:18.000Z",{"current":848},"whats-behind-the-hype-about-blazor",[850,857,862,864,869,874,879,884,886],{"_createdAt":851,"_id":852,"_rev":853,"_type":854,"_updatedAt":851,"slug":855,"title":856},"2023-05-23T16:43:21Z","wp-tagcat-blazor","9HpbCsT2tq0xwozQfkc4ih","blogTag",{"current":856},"blazor",{"_createdAt":851,"_id":858,"_rev":853,"_type":854,"_updatedAt":851,"slug":859,"title":861},"wp-tagcat-bulletin",{"current":860},"bulletin","Bulletin",{"_createdAt":851,"_id":858,"_rev":853,"_type":854,"_updatedAt":851,"slug":863,"title":861},{"current":860},{"_createdAt":851,"_id":865,"_rev":853,"_type":854,"_updatedAt":851,"slug":866,"title":868},"wp-tagcat-c-sharp",{"current":867},"c-sharp","c sharp",{"_createdAt":851,"_id":870,"_rev":853,"_type":854,"_updatedAt":851,"slug":871,"title":873},"wp-tagcat-code-for-a-living",{"current":872},"code-for-a-living","Code for a Living",{"_createdAt":851,"_id":875,"_rev":853,"_type":854,"_updatedAt":851,"slug":876,"title":878},"wp-tagcat-dot-net",{"current":877},"dot-net","dot net",{"_createdAt":851,"_id":880,"_rev":853,"_type":854,"_updatedAt":851,"slug":881,"title":883},"wp-tagcat-stackoverflow",{"current":882},"stackoverflow","Stackoverflow",{"_createdAt":851,"_id":880,"_rev":853,"_type":854,"_updatedAt":851,"slug":885,"title":883},{"current":882},{"_createdAt":851,"_id":887,"_rev":853,"_type":854,"_updatedAt":851,"slug":888,"title":890},"wp-tagcat-web-dev",{"current":889},"web-dev","web dev","What's behind the hype about Blazor?",[893,899,905,911],{"_id":894,"publishedAt":895,"slug":896,"sponsored":12,"title":898},"76c9771b-34e6-4d98-8641-ecefc711f0ef","2026-07-06T15:23:34.559Z",{"_type":10,"current":897},"when-the-sensor-starts-thinking-snortml-agentic-ai-and-the-evolving-architecture-of-intrusion-detection","When the sensor starts thinking: SnortML, agentic AI, and the evolving architecture of intrusion detection",{"_id":900,"publishedAt":901,"slug":902,"sponsored":12,"title":904},"28e560af-f0aa-4d46-bd90-f435ad604aa7","2026-06-26T14:00:27.102Z",{"_type":10,"current":903},"paging-charity-how-can-engineering-leaders-avoid-becoming-bond-villains","Paging Charity! How can engineering leaders avoid becoming Bond villains?",{"_id":906,"publishedAt":907,"slug":908,"sponsored":12,"title":910},"4b22c2a3-3779-4966-93eb-5230391dbdce","2026-06-23T14:08:58.595Z",{"_type":10,"current":909},"your-ai-shipped-a-backend-that-boots-that-is-the-whole-problem","Your AI shipped a backend that boots. That is the whole problem.",{"_id":912,"publishedAt":913,"slug":914,"sponsored":12,"title":916},"5cf362e1-fe7b-45af-b69c-914731c6a052","2026-06-23T14:00:00.000Z",{"_type":10,"current":915},"the-2026-developer-survey-is-now-open-for-human-developers-only","The 2026 Developer Survey is now open (for human developers only)!",{"data":918,"sourceMap":-1},{"count":919,"lastTimestamp":920},131,"2023-05-25T09:47:09Z"]