Dot.Blog

C#, XAML, Xamarin, WinUI/Android/iOS, MAUI

Vous êtes blasé ? Pensez Blazor !

Blazor fait partie de l’écosystème MAUI, ce n’est pas un langage de plus mais une philosophie de développement différente. Vous ne connaissez pas encore ? Suivez le guide !

Blazor

En 2011, la conférence des développeurs Microsoft Build a secoué le monde des développeurs Windows en présentant JavaScript et HTML comme le moyen principal (et quasi unique) de développer des applications pour Windows 8. C’était un pis-aller pour brosser l’histoire dans le sens du poil car Microsoft n’avait plus rien à proposer pour faire du cross-plateforme, Silverlight venant de rendre l’âme comme Flash de Adobe (sur décision de Jobs ce faux gourou). Cela a été considéré à juste titre comme une trahison par de nombreux développeurs .NET fidèles, ils n’avaient pas encore le recul pour comprendre que Microsoft n’avait pas le choix des armes… Bien entendu il y eu beaucoup de scepticisme quant au fait que Microsoft serait en mesure d'inciter les développeurs Web à développer pour le Windows Store alors même que cette population déteste viscéralement la marque depuis toujours et de façon irrationnelle. D’ailleurs ils ne sont pas venus… À l'époque, on nous a également présenté UWP avec beaucoup moins de fanfare il faut l’avouer. Certes on a pu voir dans UWP une nouvelle tentative désespérée de sauver WinRT, mort aussi. Ce n’est pas faux et UWP est mort lui aussi d’ailleurs. Tout cela ne donne pas forcément confiance à première vue.

Et pourtant… si on comprend l’histoire mouvementée de ces années-là (ce que j’ai expliqué et même prévu dans de nombreux billets de l’époque) Microsoft n’avait plus le choix. Plus de Silverlight et rien pour remplacer, il valait mieux, par force, crier avec Apple « vive HTML 5 » qui n’était qu’un leurre sans tooling à l’époque ni de support clair des Browsers. Mais c’était mieux que de passer pour des idiots hasbeen. Puis Windows Phone est mort. Et c’est très injuste c’était certainement sur de nombreux points le meilleur OS pour smartphone, largement mieux que Android ou iOS en tout cas. Mais plus de possibilité pour Microsoft de viser « l’universalité » avec Windows 8. Si UWP dont la première lettre signifie Universal ne tournait plus que sur les PC sous Windows, elle était où l’universalité ? Nulle part…

Le temps de comprendre que Xamarin tenait la solution, de racheter la société, de mettre au point Xamarin.Forms, de relancer .NET au travers de Core, il fallait tenir tant bien que mal. C’est aussi simple que ça.

Blazor est-il un changement de circonstance comme UWP ou HTML ?

Non. Et heureusement. On peut vasouiller une fois, pas à chaque fois…

Blazor est au contraire une petite merveille fondée sur Wasm mais en terriblement mieux ! Et il ne vient pas tout chambouler, au contraire. Si MAUI est l’unification des smartphones / tablettes avec le desktop Mac et PC, Blazor vient lui ajouter une unification avec le Web mais utilisable aussi sous les autres cibles MAUI et mélangeable en harmonie avec le reste des outils de la plateforme.

Le Web n’est pas forcément ma tasse de thé, les lecteurs assidus le savent déjà. J’exècre HTML, CSS et JavaScript, ça fait beaucoup pour que j’y trouve du plaisir. Je ne parle pas d’intérêt professionnel, forcément le Web c’est crucial et il faut se le farcir de gré ou de force, non, je parle en tant que personne, je déteste les technos Web, je déteste l’informatique centralisée dangereuse pour la démocratie et nos libertés, etc. Bref, Dot.Blog n’est pas un blog politique, vous échapperez donc à mes diatribes contre tous ces trucs qui nous surveillent, nous pistent, nous cookisent, nous centralisent etc. Et en tant qu’informaticien je trouve que ces « langages » (HTML, CSS, JS) sont une sorte de trinité de l’enfer tellement ils sont mal fichus et mal assortis. ASP.NET a pu un temps de réconcilier avec le Web, en tout cas avec la programmation Web, mais hélas on retombe toujours sur le trio infernal cité…

Et Blazor alors ?

Une décennie plus tard, grâce aux progrès des technologies Web et au désir d'obtenir des performances natives dans le navigateur sans les problèmes de sécurité d'ActiveX, ce rêve devient réalité avec Blazor.. Blazor exploite les modèles Razor pour développer des applications Web à l'aide de .NET et HTML. Il existe actuellement deux options pour développer des applications Blazor. Vous pouvez développer côté serveur en utilisant SignalR pour gérer l'interaction avec l'interface utilisateur. Alternativement, vous pouvez développer le côté client en utilisant WebAssembly et tout exécuter dans le navigateur. Une version autonome de .NET s'exécute dans WebAssembly et l'application Blazor s'exécute par-dessus. Real .NET fonctionnant nativement dans le navigateur et pas de transpilation vers JavaScript. Blazor fournit également un accès à JavaScript, de sorte qu'une application hybride peut être créée selon les besoins. Blazor et WebAssembly en général sont considérés comme sécurisés dans le navigateur, car le navigateur limite l'accès au système d'exploitation sous-jacent.

Nous nous concentrerons sur les applications Blazor qui s'exécutent dans WebAssembly, car c'est ce qui est le plus pertinent pour .NET MAUI. Dans Visual Studio 2022, il existe un template d'application pour créer une application Blazor WebAssembly.

Le projet que cela crée à quelques fonctionnalités de base avec une poignée d'exemples de modèles Razor, et voici l'application en cours d'exécution :

Et voici le modèle pour l'onglet compteur :

@page "/counter"

<h1>Counter</h1>

<p role="status">Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>

@code {

    private int currentCount = 0;

    private void IncrementCount()

    {

        currentCount++;

    }

}

Notez le bloc de code C# pour gérer le clic sur le bouton. C’est là que Blazor dans ce retour à la rationalité du côté clair de la force devient sympathique…

Le côté ASP (le premier) où on mélange HTML et code est trop brouillon pour moi, je dois être psychorigide mais je trouve ça bordélique. Mais il y a des gens à qui cela plait… En tout cas, avec Blazor, l’intérêt est bien entendu dans cette liaison naturelle avec C#, donc avec .NET, donc avec MAUI aujourd’hui. Car cela veut dire que vos frontends Blazor peuvent s’appuyer sur du code partagé avec vos applications maisons ou vos Apps … Vous allez me dire que ASP.NET Core le permet aussi. Oui, pas faux. Bon, je ne vais pas vous embrouiller, je vous présente Blazor parce que je trouve le boulot de Microsoft énorme sur la base d’une norme toute pourrie comme WebAssembly (lisez les specs de WebAssembly, ça fait peur, regardez Blazor, ça rend le sourire…).

Chacun fera son choix et je suis certain (malgré ma mauvaise humeur palpable sur les sujets pur Web) que Blazor peut être un excellent choix dans certains contextes. C’est pour cela que le professionnel que je suis s’y intéresse. Après tout mes états d’âmes sur la démocratie ou la beauté de C# compilé en natif n’intéressent pas mes clients.

De Blazor à MAUI

Une application Blazor peut également être présentée sous la forme d'une application Web progressive (PWA), d'une application Electron ou d'autres technologies d'application Web. La dernière option consiste à exécuter Blazor dans une application .NET MAUI. Maintenant pourquoi est-ce intéressant ? Et qu'est-ce qui rend cette solution attrayante par rapport à ces autres techniques ?

  • Accès à l'intégralité du .NET Framework. Lorsque les vues Web Blazor s'exécutent dans MAUI, elles n'utilisent pas WebAssembly ni sa propre copie de .NET. Le code Blazor s'exécute en fait avec l'application MAUI, et le code Blazor a accès à tout ce à quoi MAUI a accès, y compris les API de la plate-forme.
  • Mélangez et associez les contrôles MAUI avec les vues Web Blazor selon vos besoins. Choisissez le bon cadre pour l'interface utilisateur souhaitée et mélangez et assortissez, avec la possibilité d'avoir plusieurs vues Web Blazor sur une seule page si vous le souhaitez.
  • Profitez de l'expérience d'empaquetage de MAUI, ciblant les plates-formes les plus populaires en tant qu'application native dans l'App Store.

Depuis la sortie de .NET 6 Preview 4, cette fonctionnalité est disponible dans MAUI et vous pouvez l'essayer dès aujourd'hui puisque nous avons même franchi la GA. 

On peut aussi créer une application Blazor Maui comme suit en utilisant la console SDK :

dotnet new maui-blazor -o MauiBlazorApp

En exécutant cette application sur le bureau, cela ressemble à ceci :