août 31, 2022

Retour d’expérience : Blazor

Aujourd’hui nous allons évoquer une technologie qui me tient à coeur particulièrement : Blazor.

Blazor a été annoncé et publié en 2018 lors de la sortie d’ASP .NET Core 3.1 mais uniquement la version serveur.

Le contexte

Que ce soit de type Blazor Server ou Blazor WebAssembly, je crois énormément en cette typologie de projets que tout les développeur .NET attendaient.

En effet, dans ma carrière, j’ai fait énormément de projets Web et fatalement j’ai du utiliser Javascript (plus précisément JQuery). Ce n’est pas que je n’aime pas Javascript mais si je pouvais m’en passer, j’aurais préféré. Ensuite sont arrivé les langages client Typescript et les librairies/frameworks comme VueJs, Angular ou React pour les plus connus.

Ces derniers ont pris beaucoup de place dans le monde du développement Web.J’ai donc expérimenté VUeJs et Angular principalement et le constat est simple : la courbe d’apprentissage est assez rude pour une développeur qui n’a fait quasiment que du C#.

C’est la que Microsoft a annoncé Blazor et nous vendait des applications Web sans une ligne de Javascript. Les démos nous démontraient cette capacité très clairement mais dans la réalité, c’était autre chose au début de sa release.

En effet, Blazor manquait de packages pour les intéractions client comme créer des popup, des modal ou même des toast ce qui poussait les développeurs à intégrer des librairies JS et à les appeller via des méthodes comme-suit :

Javascript :

<script>
  window.convertArray = (win1251Array) => {
    var win1251decoder = new TextDecoder('windows-1251');
    var bytes = new Uint8Array(win1251Array);
    var decodedArray = win1251decoder.decode(bytes);
    console.log(decodedArray);
    return decodedArray;
  };
</script>

Appel sur la page :

@page "/call-js-example-1"
@inject IJSRuntime JS

<h1>Call JS <code>convertArray</code> Function</h1>

<p>
    <button @onclick="ConvertArray">Convert Array</button>
</p>

<p>
    @text
</p>

<p>
    Quote ©2005 <a href="https://www.uphe.com">Universal Pictures</a>: 
    <a href="https://www.uphe.com/movies/serenity-2005">Serenity</a><br>
    <a href="https://www.imdb.com/name/nm0472710/">David Krumholtz on IMDB</a>
</p>

@code {
    private MarkupString text;

    private uint[] quoteArray = 
        new uint[]
        {
            60, 101, 109, 62, 67, 97, 110, 39, 116, 32, 115, 116, 111, 112, 32,
            116, 104, 101, 32, 115, 105, 103, 110, 97, 108, 44, 32, 77, 97,
            108, 46, 60, 47, 101, 109, 62, 32, 45, 32, 77, 114, 46, 32, 85, 110,
            105, 118, 101, 114, 115, 101, 10, 10,
        };

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

Ce n’est pas forcément mauvais mais celà envoyait un mauvais signal sur la technologie en laissant supposer que la communauté ne souhaite pas s’y investir pour produire des packages.

Tout cela a bien évidemment été gommé avec quelques temps et les packages ont énormément grossi.

Aujourd’hui on trouve énormément de librairies de controles de style Telerik ou SyncFusion mais gratuites ( mais moins fournies bien évidemment mais largement suffisantes) comme Blazored ou Radzen.

Il en va de même pour les performances et les bugs.

A l’heure actuelle, nous avons une version qui tient clairement la route en termes de performances si l’on place en face Angular ou React. En effet, beaucoup d’efforts ont été faits par Microsoft de ce coté la.

Même si la logique reste la même avec des components, des modules et des pages, je trouve que Blazor est bien plus accessible qu’Angular de mon point de vue. Cette dernière constatation améliore aussi énormément ma productivité sur les projets Blazor.

Les projets

Lors de sa sortie j’ai fait quelques projets de petite taille pour expérimenter et mettre les mains sur la technologie.

Peu de clients ont choisi cette technologie et les explications peuvent être les suivantes :

  • Aucune connaissance de l’existence de la technologie
  • Peur de la jeunesse de la techno
  • « Hégémonie » actuelle des libraires front comme Angular , React ou VueJS

En 2022 les projets pour des clients sur Blazor commencent à arriver doucement et ne ressemblent plus à des POC ou des projets utilisés par 3 personnes dans un petit service pour limiter les effets négatifs si la techno ne tient pas la route.

Le futur est plus que brillant de mon coté pour Blazor ainsi que du coté de Microsoft.

En effet, la roadmap est bien remplie et en voici un exemple avec la preview 7 de .net 7.0 : https://devblogs.microsoft.com/dotnet/asp-net-core-updates-in-dotnet-7-preview-7/

Et en version plus visuelle :

Conclusion

Pour conclure, je trouve la technologie très intéressante, je la porterais quoi qu’il arrive car elle me parle plus qu’Angular ou React. Malgré tout elle reste jeune par rapport aux librairies Typescript/Javascript existantes donc j’attends beaucoup des prochaines releases.

Je vous invite donc à tester pour peut être vous laisser convaincre 😉

Happy coding ! 😎