Qu'est-ce que le framework Web Blazor de Microsoft et dois-je l'utiliser ?

  • Principal
  • Nouvelles
  • Qu'est-ce que le framework Web Blazor de Microsoft et dois-je 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 le runtime .NET et permet aux développeurs de créer des applications Web interactives à l'aide de C # et HTML.

Qu'est-ce que ASP.NET aussi ?

Si vous êtes dans le monde des frameworks JavaScript, vous pouvez être confus quant à 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 Dino - elle a été constamment améliorée avec C # et .NET dans son ensemble, car elle est utilisée en interne par Microsoft. Il est complètement multiplateforme et fonctionne comme d'habitude.

Au début, il n'y avait que 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 du nom déroutant) a été publié pour simplifier la syntaxe expressive de MVC, qui nécessite beaucoup de texte passe-partout et, en tant que tel, ne fonctionne pas bien avec la conception centrée sur les composants. d'applications modernes. MVC nécessite que vous créiez 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 à utiliser.

Toutes ces fonctionnalités font partie de l'écosystème 'ASP.NET'. La meilleure partie est les packages et le support. Comme NPM pour JavaScript, C# dispose également d'un environnement de packaging intégré au gestionnaire de packages NuGet.

Alors c'est quoi le blazer ?

Blazor ne change rien à la syntaxe de ces pages. Vous utiliserez toujours Razor Pages et/ou MVC. En fait, ce n'est même pas une mauvaise chose, car il existe déjà de nombreuses interfaces utilisateur et bibliothèques de composants conçues pour les pages Razor compatibles 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, sans même que les utilisateurs s'en rendent compte.

Par conséquent, Blazor a été créé pour répondre à cette demande. Cela fonctionne un peu comme React, où les actions changent d'état et d'accessoires et déclenchent des mises à jour d'applications. Le framework gérera la mise à jour du DOM pour vous en fonction des composants qui doivent être mis à jour. Cela permet des applications en temps réel où la page peut être actualisée ou même complètement repensée sans avoir à actualiser le navigateur.

L'avantage de Blazor sur un framework é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 le typage dynamique et statique, les langages 'de bureau' comme C # présentent certainement des avantages et le Web manque sérieusement 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. Bien que JS ne soit pas du tout lent et se soit beaucoup amélioré au fil des ans, il sera toujours moins performant que C #, qui fonctionne en fait très près des performances C ++ natives.

Blazer permet une meilleure interopérabilité. De nombreuses applications utilisent également 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 côté client, ainsi que d'un code distinct pour interagir avec eux. S'ils sont dans le même langage, cela vous permet de partager facilement du code et des bibliothèques entre le client et le serveur. C'est pourquoi NodeJS existe côté serveur, même si JavaScript n'est pas le langage de bureau idéal, avoir des applications construites dans un seul langage réduit le temps de développement.

L'avenir de Blazer

Il existe en fait quelques types différents 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 Blazer, qui fonctionne comme React Server Side Rendering et effectue la majeure partie du rendu 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 :

    POIDS de la veste, conçu pour publier le site en tant qu'application Web progressive (PWA) installable. Veste de bureau/hybride, qui vous permet d'intégrer des applications Blazor dans des applications de bureau et est fondamentalement similaire à Electron mais avec de meilleures performances. veste indigène,qui remplace l'interface utilisateur basée sur le Web par une interface native de la plate-forme. On ne sait pas à quel point il est utile au-delà de l'interopérabilité avec les outils Blazor existants, et cette version est encore en phase de planification.

Dans son annonce Blazor Desktop, Microsoft a déclaré que 'Blazor est un modèle de programmation d'applications'. Il est très personnalisable et peut être exécuté de différentes manières (selon les besoins) ».

Microsoft semble considérer Blazor comme la prochaine norme pour la création d'interfaces d'applications. Votre travail en vaut également la peine, car les applications devenant de plus en plus dépendantes du Web, il devient 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 construites sur Blazor Server et WebAssembly aujourd'hui auront beaucoup de place pour se développer.

Serveur Blazor vs assemblage Web Blazor

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 sous la forme d'une vue simple avec une manière basique de manipuler le DOM.

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

La bonne chose à propos de WebAssembly est qu'il s'agit d'un objectif de compilateur relativement facile à atteindre. Tout comme C# peut compiler jusqu'à MSIL, C# peut également compiler WebAssembly. Eh bien, techniquement, c'est MSIL qui est compilé dans WebAssembly (puisque c'est plus simple), mais le point est le même.

N'importe quel langage peut être compilé dans WASM, même les langages de bureau complètement natifs comme C++. Ce n'est pas théorique, ça marche dans la pratique. AutoDesk a pu transférer 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 apporté Destin 3 .

Blazor WebAssembly prend essentiellement l'intégralité du serveur et de l'exécution .NET et l'exécute dans WASM. Ainsi, au lieu de parler au serveur dans SignalR, parlez directement au DOM. Cela élimine le traitement côté serveur, qui peut être idéal pour certaines applications.

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 ayez besoin d'ajouter des balises de script pour charger le runtime, et que vous deviez peut-être plonger vos doigts dans le code JavaScript pour certaines choses, pour la plupart, vous devriez être en mesure de créer une application Web de production complète sans écrire une ligne . seulement. de JavaScript.

C'est à vous d'utiliser Blazor Server ou Blazor WebAssembly. Les deux ont leurs avantages. Blazor Server exécute tout le code de traitement dans un environnement de confiance et ne nécessite pas d'API publique. Blazor WASM est réactif et rapide et peut également être déployé en tant que site statique servi uniquement avec NGINX.

Comment Blazer fonctionne-t-il avec JavaScript ?

Quoi qu'il en soit, il dispose en fait d'une interopérabilité JavaScript complète. Blazor peut appeler des fonctions JS à partir de code managé :

|__+_|

Et vice versa:

|__+_|

Notez cependant que cela utilisera bien sûr la réflexion et n'est certainement pas le plus performant au monde.

Techniquement, vous pouvez utiliser tous les packages NPM avec Blazor, bien que le configurer et interagir avec lui du côté .NET puisse être pénible, vous devriez donc préférer un package NuGet la plupart du temps.

Pouvez-vous utiliser Blazor sur ordinateur (électron) ?

Par surprise, la réponse est oui. Bien que Microsoft envisage de publier Blazor Desktop/Hybrid, qui fait la même chose, vous pouvez utiliser l'Electron standard en attendant. En effet, Electron ne se soucie pas vraiment de la page Web qu'il dessert et ne peut servir qu'une application Blazor.

Vous pourriez penser que vous utiliseriez une application d'assemblage Web Blazor, mais il est en fait plus facile d'ajouter Electron à un serveur ASP.NET Core existant. WASM a des frais généraux, 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 Electron natives à partir de C#.

Cependant, Microsoft a de plus grands projets pour Blazer Desktop. Ils prévoient de supprimer complètement la dépendance à un navigateur et à JavaScript et d'exécuter simplement un conteneur natif avec une vue Web entièrement .NET.

Le bureau Blazer aura une structure similaire au fonctionnement d'Electron. Il y aura un contrôle WebView qui restitue 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 utilisera 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 efficace et utiliser moins de mémoire.


Quelle que soit la mise en œuvre, il est passionnant de voir une autre plate-forme concurrencer JavaScript et Electron pour créer des applications de bureau et Web multiplateformes. Blazor Desktop devrait être lancé en novembre 2021 avec le premier aperçu de .NET 6.

Qu'est-ce que tu penses?