Qu'est-ce que le framework Web Blazor de Microsoft et devriez-vous l'utiliser ?  – CloudSavvy IT
Agence web » Actualités du digital » Qu’est-ce que le framework Web Blazor de Microsoft et devriez-vous l’utiliser ? –

Qu’est-ce que le framework Web Blazor de Microsoft et devriez-vous l’utiliser ? –

Blazor est un nouveau framework Web de Microsoft conçu pour concurrencer les plates-formes leaders du secteur telles que React. Sauf qu’au lieu d’utiliser JavaScript, il s’exécute sur l’environnement d’exécution .NET et permet aux développeurs de créer des applications Web interactives avec C# et HTML.

Qu’est-ce qu’ASP.NET ?

Si vous venez du monde des frameworks JavaScript, vous pourriez être confus au sujet de la relation de Blazor avec ASP.NET. Ce sont tous deux des « frameworks Web », mais Blazor n’est qu’une partie de l’écosystème ASP.NET.

Bien que la plate-forme ASP.NET ait presque 20 ans à ce stade, ce n’est pas un framework de dinosaure – elle s’améliore constamment aux côtés de C# et .NET dans son ensemble, car Microsoft l’utilise en interne. C’est complètement multiplateforme et toujours aussi performant.

Au début, il n’y avait qu’ASP.NET, qui peut être utilisé pour créer toutes sortes d’applications Web. Il y avait ASP.NET MVC (Model-View-Controller), qui crée des pages Web basées sur les données, et ASP.NET WebAPI, qui se spécialise dans les API backend. Ceux-ci ont récemment été fusionnés dans un package unifié avec ASP.NET Core modernisé.

Il y a cinq ans, Razor Pages (qui est une chose distincte de Blazor et dont le nom prête à confusion) a été publié pour simplifier la syntaxe expressive de MVC, qui nécessite beaucoup de passe-partout et, en tant que tel, ne fonctionne pas bien avec la conception axée sur les composants. d’applications modernes. MVC vous oblige à créer une vue et un modèle pour chaque page dans des fichiers séparés :

MVC vous oblige à créer une vue et un modèle pour chaque page dans des fichiers séparés :

Pendant ce temps, avec Razor, vous pouvez créer des pages ou des composants plus rationalisés avec du code intégré sur la page elle-même. Cela fonctionne mieux lorsque les pages sont plus simples, mais les deux sont disponibles en tant qu’options que vous pouvez utiliser.

Pendant ce temps, avec Razor, vous pouvez créer des pages ou des composants plus rationalisés avec du code intégré sur la page elle-même.

Toutes ces fonctionnalités font partie de l’écosystème « ASP.NET ». La grande partie à ce sujet est les packages et le support. Tout comme NPM pour JavaScript, C# dispose également d’un environnement de package sain avec le gestionnaire de packages NuGet.

Alors, qu’est-ce que Blazor?

Blazor ne change rien à la syntaxe de ces pages. Vous utiliserez toujours les pages Razor et/ou MVC. Ce n’est même pas une mauvaise chose, car il existe déjà de nombreuses bibliothèques d’interfaces utilisateur et de composants conçues pour les pages Razor basées sur C#.

Ce que Blazor ajoute est interactivité. Les pages MVC/Razor traditionnelles utilisant ASP.NET ont toujours été maladroites et ont eu du mal à suivre les applications Web en temps réel comme React. Les applications Web en temps réel sont si rapides qu’elles commencent également à prendre le contrôle du bureau, avec des frameworks comme Electron exécutant des applications dans un conteneur Chromium, avec des utilisateurs non avertis.

Ainsi, Blazor a été créé pour répondre à cette demande. Cela fonctionne un peu comme React, où les actions modifient l’état et les accessoires et déclenchent des mises à jour de l’application. Le framework gérera la mise à jour du DOM pour vous en fonction des composants à mettre à jour. Cela permet des applications en temps réel où la page peut être mise à jour ou même complètement redessinée sans avoir à actualiser réellement le navigateur.

L’avantage de Blazor par rapport à un cadre établi comme React est le langage. Il vous permet de créer des applications Web avec C#, et cela seul le rend attrayant pour de nombreux développeurs. Quelle que soit votre opinion sur le débat entre typage dynamique et statique, les langages « de bureau » comme C# présentent certainement des avantages, et le Web manque cruellement d’alternatives à JavaScript.

Si vous avez un backend qui nécessite des performances élevées, C# s’exécutera également beaucoup plus rapidement que JavaScript. Même si JS n’est en aucun cas lent et s’est beaucoup amélioré au fil des ans, il finira toujours par être moins performant que C#, qui fonctionne en fait assez proche des performances natives du C++.

Blazor permet une meilleure interopérabilité. De nombreuses applications utilisent également déjà C# sur le backend. Par exemple, vous pouvez avoir une API ASP.NET qui interagit avec votre interface React. Vous aurez besoin de modèles distincts pour le serveur et le client, ainsi que d’un code distinct pour interagir avec eux. S’il s’agit du même langage, cela vous permet de partager facilement du code et des bibliothèques entre le client et le serveur. C’est la seule raison pour laquelle NodeJS existe côté serveur, même si JavaScript n’est pas le langage de bureau idéal, le fait d’avoir des applications construites dans un seul langage réduit le temps de développement.

L’avenir de Blazor

Il existe en fait différents types de Blazor, car Microsoft a récemment fait un gros effort de développement pour moderniser l’écosystème ASP.NET. Actuellement, deux versions sont sorties :

  • Serveur Blazor, qui fonctionne comme React Server Side Rendering et effectue la plupart du traitement sur le serveur.
  • Blazor WebAssembly, qui utilise la magie de WebAssembly pour exécuter du code .NET réel dans un navigateur Web client réel.

Microsoft prévoit également de publier trois autres versions de Blazor, qui sont toujours en développement et disponibles en avant-première :

  • Blazor PWA, qui est conçu autour de la publication du site en tant qu’application Web progressive (PWA) installable.
  • Blazor Desktop/Hybride, qui permet aux applications Blazor d’être empaquetées dans des applications de bureau et est fondamentalement comme Electron mais avec de meilleures performances.
  • Blazor Native, qui remplace l’interface utilisateur Web par une interface native de la plate-forme. Il n’est même pas clair à quel point cela est utile en plus de l’interopérabilité avec les outils Blazor existants, et cette version est encore en phase de planification.

Dans son annonce pour Blazor Desktop, Microsoft a déclaré que « Blazor est un modèle de programmation d’applications. Il est très adaptable et peut être exécuté de plusieurs manières (selon le besoin).

Microsoft semble considérer Blazor comme son prochain standard pour créer des interfaces d’applications. Leur travail en vaut également la peine, car à mesure que les applications dépendent de plus en plus du Web, il est plus difficile de justifier la création d’interfaces distinctes pour le Web et le bureau. Blazor a un bel avenir et les applications Web créées aujourd’hui sur Blazor Server et WebAssembly auront beaucoup de place pour se développer.

Blazor Server vs Blazor WebAssembly

Blazor Server utilise une connexion SignalR pour communiquer entre le client et le serveur. Il s’agit simplement d’une couche sophistiquée au-dessus d’une connexion WebSocket, qui peut éventuellement se rabattre sur d’autres connexions si nécessaire. Cela conserve tout le traitement sur le serveur et laisse le client comme une vue simple avec un moyen basique de manipuler le DOM.

Blazor Server utilise une connexion SignalR pour communiquer entre le client et le serveur.

Blazor WebAssembly est l’endroit où ça devient vraiment cool. WebAssembly (WASM) n’est pas vraiment un langage dans lequel vous écrivez, mais une cible de compilateur. Il fonctionne en fait presque exactement comme le Microsoft Intermediary Language (MSIL) avec lequel tous les C#, F# et VB.NET sont compilés. Sauf que, plutôt que de s’exécuter avec un runtime .NET, il s’exécute à l’aide du runtime WebAssembly dans le navigateur.

Wasm peut être utilisé comme cible de compilation portable pour d'autres langues

La partie intéressante de WebAssembly est que c’est une cible de compilateur relativement facile à atteindre. Tout comme la façon dont C# peut compiler vers MSIL, C# peut également compiler vers WebAssembly. Eh bien, techniquement, c’est la compilation MSIL vers WebAssembly (car c’est plus simple), mais le point est le même.

N’importe quel langage peut compiler vers WASM, même des langages de bureau entièrement natifs comme C++. Ce n’est pas théorique, cela fonctionne en pratique. AutoDesk a pu porter AutoCAD, une base de code C++ vieille de 30 ans, vers une application Web basée sur WebAssembly, en quelques mois avec une relative facilité. Quelqu’un a même porté Doom 3.

Blazor WebAssembly prend essentiellement l’intégralité du serveur ainsi que l’environnement d’exécution .NET et l’exécute au-dessus de WASM. Ensuite, au lieu de parler au serveur via SignalR, il parle directement au DOM. Cela supprime le traitement côté serveur, ce qui peut être idéal pour certaines applications.

Au lieu de parler au serveur via SignalR, Blazor WebAssembly parle directement au DOM.

Cela le place dans une position unique pour concurrencer des frameworks comme React, car il s’agit essentiellement du premier véritable concurrent de JavaScript pour les applications Web clientes. Bien que vous deviez ajouter quelques balises de script pour charger le runtime et que vous deviez peut-être plonger vos orteils dans le code JavaScript pour certaines choses, vous devriez, pour la plupart, être capable de créer une application Web de production entière sans écrire une seule ligne de JavaScript.

Que vous utilisiez Blazor Server ou Blazor WebAssembly, c’est à vous de décider. Ils ont tous les deux leurs avantages. Blazor Server exécute tout le code de traitement dans un environnement de confiance et ne nécessite pas que vous ayez une API publique. Blazor WASM est réactif et rapide, et peut même être déployé en tant que site statique servi avec uniquement NGINX.

Comment Blazor fonctionne-t-il avec JavaScript ?

Dans les deux cas, vous disposez en fait d’une interopérabilité JavaScript complète. Blazor peut appeler des fonctions JS à partir de code managé :

private async Task ConvertArray()
{
    text = new(await JS.InvokeAsync<string>("convertArray", quoteArray));
}

Et vice versa:

DotNet.invokeMethodAsync('{ASSEMBLY NAME}', '{.NET METHOD ID}', {ARGUMENTS});

Cependant, gardez à l’esprit que cela utilisera bien sûr la réflexion, et n’est certainement pas la chose la plus performante au monde.

Vous pouvez techniquement utiliser tous les packages NPM avec Blazor, bien que la configuration et l’interaction avec le côté .NET puissent être un peu un casse-tête, vous devriez donc préférer un package NuGet la plupart du temps.

Pouvez-vous utiliser Blazor sur le bureau (Electron) ?

Vous pouvez utiliser Blazor sur le bureau.

Étonnamment, la réponse à cette question est oui. Alors que Microsoft prévoit de publier Blazor Desktop/Hybrid, qui fait la même chose, en attendant, vous pouvez simplement utiliser Electron normal. En effet, Electron ne se soucie pas vraiment de la page Web qu’il sert et peut simplement servir une application Blazor.

Vous pourriez penser qu’il utiliserait une application Blazor WebAssembly, mais il est en fait plus facile d’ajouter simplement Electron à un serveur ASP.NET Core existant. WASM a une certaine surcharge, donc cette méthode est plus rapide. C’est ce que fait Electron.NET, et cela fonctionne étonnamment bien. Tout ce que vous avez à faire est de l’installer et d’ajouter Electron en tant que service ASP.NET. Vous pouvez également appeler des fonctions natives Electron à partir de C#.

Microsoft a cependant des projets plus ambitieux pour Blazor Desktop. Ils prévoient de se débarrasser complètement de la dépendance à l’égard d’un navigateur et de JavaScript et d’exécuter simplement un conteneur natif avec une vue Web entièrement en .NET.

« Le bureau Blazor sera structuré de la même manière que Electron fonctionne. Il y aura un contrôle WebView qui restituera le contenu d’un serveur Web Blazor intégré, qui peut servir à la fois Blazor et d’autres contenus Web (JavaScript, CSS, etc.).

Cette vue Web utiliserait Safari, WebKitGTK ou WebView2, selon le système d’exploitation. WebView2 utilise Chromium sous le capot, il fonctionnerait donc un peu comme Electron, sauf pour être plus performant et utiliser moins de mémoire.


Quelle que soit l’implémentation finale, il est passionnant de voir une autre plate-forme rivaliser avec JavaScript et Electron pour la création d’applications Web et de bureau multiplates-formes. Blazor Desktop devrait sortir en novembre 2021 avec le premier aperçu de .NET 6.

★★★★★