Marvin's Blog【程式人生】

Ability will never catch up with the demand for it

03 Aug 2021

基于Webview的Blazor

.NET 6 Gets Blazor WebView Controls for WPF, WinForms 提到.NET 6 Preview 3为WPF和WinForms提供了BlazorWebView。有点好奇BlazorWebView到底是什么。

有个Github项目https://github.com/jspuij/TwokaB为以下平台创建了BlazorWebview:

- Xamarin Android (running on the Mono runtime)
- Xamarin iOS (running on the Mono runtime)
- Xamarin Mac (running on the Mono runtime)
- WPF (running on the .NET Core runtime)

相关文档在https://jspuij.github.io/BlazorWebView.Docs/pages/index.html

从项目介绍上看,此BlazorWebview的功能已经并入https://github.com/xamarin/MobileBlazorBindings,并在https://devblogs.microsoft.com/aspnet/hybrid-blazor-mobile-blazor-bindings-july-update/中可见。

同时该项目还提到,其灵感来自于Steve Sanderson的博客文章:Meet WebWindow, a cross-platform webview library for .NET Core

Meet WebWindow, a cross-platform webview library for .NET Core

制作了一个WebWindow 可以用于.NET Core console app。

文中还是有不少例子的。

Exploring lighter alternatives to Electron for hosting a Blazor desktop app

对Electron做了介绍:2014年开源,自带Chromium,NodeJS,提供了一套跨平台API。

Blazor on Electron的一个试验项目: https://github.com/aspnet/AspLabs/tree/master/src/ComponentsElectron。不运行于WebAssembly之中,而是以.NET Core的runtime作为运行时。

Blazor on pure webview的一个试验项目:https://github.com/steveSandersonMS/BlazorDesktop。采用系统自带的Webview以及.NET runtime。.NET项目的好处是可以很容易设置为standalone或者framework-dependent。后者的体积会非常小。

小结

Incremental DOM

Blazor所作的事,简单地说是管理DOM状态。当所管理的状态发生变化时,将差异部分应用到真实的DOM上。根据https://blazor-university.com/components/render-trees/,Blazor有自己的RenderTree,既像Virtual DOM,又像Incremental DOM。

从谷歌的这个项目https://github.com/google/incremental-dom看来,Incremental DOM没有居中的树形数据结构,而是直接在前线操作DOM树。(Think of it as ASM.dom)。但https://blazor-university.com/components/render-trees/提到了Incremental DOM和谷歌的这个项目可能不是一个东西。

Blazor采用的是局部更新,如果通过浏览器的Inspector修改了DOM,Blazor的更新会失败。

其他参考:

Blazor的应用形式

现在Blazor有几种应用形式。感觉其中最重要的差别在于Blazor所依赖的.NET运行时在何处提供:

  • BlazorWebAssembly
    • .NET运行时采用Mono,部署在浏览器中,通过SignalR与前端交互
  • BlazorServer
    • .NET运行时采用CoreCLR,部署在云端,通过JS interop与前端交互
  • BlazorDesktop
    • .NET运行时采用App自带的CLR,通过Webview interop与前端交互

(本篇完)

Categories