Cursos

[Noticias][grids]

O que é o Blazor Web Framework da Microsoft e você deve usá-lo?

 

Blazor é uma nova estrutura da web da Microsoft projetada para competir com plataformas líderes do setor, como React. Exceto que, em vez de usar JavaScript, ele é executado no tempo de execução . NET e permite que os desenvolvedores criem aplicativos da web interativos com C # e HTML.

O que é ASP. NET Even?

Se você vem do mundo das estruturas JavaScript, pode estar confuso sobre o relacionamento do Blazor com o ASP. NET. Ambos são “ estruturas da web, ” mas o Blazor é apenas uma parte do ecossistema ASP. NET.

Embora a plataforma ASP. NET tenha quase 20 anos neste ponto, não é uma estrutura de dinossauro — ela tem melhorado consistentemente junto com C # e . NET como um todo, conforme a Microsoft o usa internamente. É totalmente multiplataforma e com o melhor desempenho de sempre.

No início, havia apenas ASP. NET, que pode ser usado para fazer todos os tipos de aplicativos da web. Havia a ASP. NET MVC (Model-View-Controller), que cria páginas da web orientadas a dados, e a ASP. NET WebAPI, que é especializada em APIs de back-end. Eles foram recentemente mesclados em um pacote unificado com o ASP. NET Core modernizado.

Cinco anos atrás, o Razor Pages (que é uma coisa separada do Blazor e tem um nome confuso) foi lançado para simplificar a sintaxe expressiva do MVC, que requer muitos clichês e, como tal, não funciona bem com o design de aplicativos modernos com foco em componentes. O MVC requer que você faça uma visualização e um modelo para cada página em arquivos separados:

Publicidade

Enquanto isso, com o Razor, você pode fazer páginas ou componentes mais simplificados com código integrado na própria página. Isso funciona melhor quando as páginas são mais simples, mas ambas estão disponíveis como opções para você usar.

Todos esses recursos fazem parte do “ ASP. NET ” ecossistema. A grande parte disso são os pacotes e o suporte. Muito parecido com o NPM para JavaScript, C # também tem um ambiente de pacote saudável com o gerenciador de pacotes NuGet.

Então, o que é Blazor?

O Blazor não muda nada na sintaxe dessas páginas. Você ainda estará usando páginas do Razor e / ou MVC. Na verdade, isso não é nem uma coisa ruim, porque já existem inúmeras IU e bibliotecas de componentes feitas para páginas do Razor apoiadas em C #.

O que o Blazor adiciona é a interatividade. As páginas MVC / Razor tradicionais que usam ASP. NET sempre foram desajeitadas e têm se esforçado para acompanhar os aplicativos da web em tempo real como o React. Os aplicativos da web em tempo real são tão rápidos que estão começando a assumir o controle da área de trabalho também, com estruturas como o Electron executando aplicativos em um contêiner Chromium, sem que os usuários percebam.

Então, o Blazor foi criado para atender a essa demanda. Funciona de maneira muito semelhante ao React, em que as ações modificam o estado e as propriedades e acionam atualizações para o aplicativo. A estrutura cuidará da atualização do DOM para você com base nos componentes que precisam ser atualizados. Isso permite aplicativos em tempo real onde a página pode ser atualizada ou até mesmo completamente redesenhada sem a necessidade de atualizar o navegador.

O benefício do Blazor sobre um framework estabelecido como React é a linguagem. Ele permite que você crie aplicativos da web com C #, o que por si só o torna atraente para muitos desenvolvedores. Qualquer que seja a opinião que você possa ter sobre o debate sobre tipagem dinâmica versus estática, definitivamente há benefícios em “ desktop ” linguagens como C # e a web carecem de alternativas ao JavaScript.

Publicidade

Se você tiver um back-end que requer alto desempenho, C # também será executado muito mais rápido do que JavaScript. Mesmo que JS não seja lento e tenha melhorado muito ao longo dos anos, ainda assim terá menos desempenho do que o C #, que na verdade funciona muito próximo do desempenho nativo do C ++.

O Blazor permite uma melhor interoperabilidade. Muitos aplicativos também já usam C # no back-end. Por exemplo, você pode ter uma API ASP. NET que interage com seu front-end React. Você precisará de modelos separados para o servidor e para o cliente, bem como um código separado para interagir com eles. Se forem da mesma linguagem, isso permite que você compartilhe facilmente o código e as bibliotecas entre o cliente e o servidor. Esta é toda a razão pela qual o NodeJS existe no lado do servidor — embora o JavaScript não seja a linguagem de desktop ideal, ter aplicativos construídos em uma linguagem reduz o tempo de desenvolvimento.

O futuro do Blazor

Na verdade, existem alguns tipos diferentes de Blazor, já que a Microsoft tem feito um grande esforço de desenvolvimento recentemente para modernizar o ecossistema ASP. NET. Atualmente, existem duas versões que foram lançadas:

  •  Blazor Server, que funciona como React Server Side Rendering e faz a maior parte do processamento no servidor.
  •  Blazor WebAssembly, que usa a magia do WebAssembly para executar o código . NET real em um navegador cliente real.

A Microsoft também planeja lançar mais três versões do Blazor, que ainda estão em desenvolvimento e disponíveis para visualização:

  •  Blazor PWA, que foi projetado para publicar o site como um Progressive Web App (PWA) instalável.
  •  Blazor Desktop / Hybrid, que permite que aplicativos Blazor sejam empacotados em aplicativos de desktop e é basicamente como Electron, mas com melhor desempenho.
  •  Blazor Native, que substitui a IU baseada na web por uma interface nativa da plataforma. Não está claro o quão útil isso é, além da interoperabilidade com as ferramentas Blazor existentes, e esta versão ainda está nas fases de planejamento.

Em seu anúncio para o Blazor Desktop, a Microsoft afirmou que “ Blazor é um modelo de programação de aplicativo. É muito adaptável e pode ser executado de várias maneiras (dependendo da necessidade). ”

A Microsoft parece pensar no Blazor como seu próximo padrão para fazer front-ends de aplicativos. O trabalho deles também vale a pena, porque conforme os aplicativos se tornam cada vez mais dependentes da web, é mais difícil justificar a criação de interfaces separadas para web e desktop. O Blazor tem um futuro brilhante, e os aplicativos da web feitos hoje no Blazor Server e WebAssembly terão muito espaço para crescer.

Blazor Server vs. Blazor WebAssembly

O Blazor Server usa uma conexão SignalR para se comunicar entre o cliente e o servidor. Esta é apenas uma camada sofisticada sobre uma conexão WebSocket, que pode opcionalmente recorrer a outras conexões quando necessário. Isso mantém todo o processamento no servidor e deixa o cliente como uma visualização simples com uma maneira básica de manipular o DOM.

Publicidade

O Blazor WebAssembly é onde fica seriamente legal. WebAssembly (WASM) não é realmente uma linguagem na qual você escreve, mas um destino do compilador. Na verdade, funciona quase exatamente como a Microsoft Intermediary Language (MSIL) para a qual todos os C #, F # e VB. NET são compilados. Exceto que, em vez de executar com um tempo de execução . NET, ele é executado usando o tempo de execução WebAssembly no navegador.

A parte legal do WebAssembly é que ele é um alvo de compilador relativamente fácil de atingir. Assim como o C # pode ser compilado para MSIL, o C # também pode ser compilado para WebAssembly. Bem, tecnicamente, é MSIL compilando para WebAssembly (já que é mais simples), mas o ponto é o mesmo.

Qualquer linguagem pode ser compilada para WASM, até mesmo linguagens de desktop totalmente nativas como C ++. Isso não é teórico; na verdade, funciona na prática. AutoDesk foi capaz de portar AutoCAD, uma base de código C ++ de 30 anos, para um aplicativo da web baseado em WebAssembly, em alguns meses com relativa facilidade. Alguém até portou Doom 3.

O Blazor WebAssembly basicamente pega todo o servidor, bem como o tempo de execução do . NET, e o executa sobre o WASM. Então, em vez de falar com o servidor pelo SignalR, ele se comunica diretamente com o DOM. Isso corta o processamento do lado do servidor, que pode ser ideal para alguns aplicativos.

Isso o torna exclusivamente posicionado para competir com estruturas como React, já que é essencialmente o primeiro verdadeiro concorrente do JavaScript para aplicativos da web cliente. Embora você tenha que adicionar algumas tags de script para carregar o tempo de execução e possa ter que mergulhar no código JavaScript para algumas coisas, você deve, na maior parte, ser capaz de fazer um aplicativo da web de produção inteiro sem escrever uma única linha de JavaScript.

Publicidade

Você decide se usa o Blazor Server ou o Blazor WebAssembly. Ambos têm suas vantagens. O Blazor Server executa todo o código de processamento em um ambiente confiável e não exige que você tenha uma API pública. O Blazor WASM é responsivo e rápido, e pode até mesmo ser implantado como um site estático servido apenas com NGINX.

Como o Blazor funciona com JavaScript?

Em ambos os casos, você realmente tem interoperabilidade total de JavaScript. O Blazor pode chamar funções JS do código gerenciado:

 tarefa assíncrona privada ConvertArray () {text = new (await JS. InvokeAsync < string > ("convertArray", quoteArray)); }

E vice-versa:

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

Embora, tenha em mente que isso, é claro, usa reflexão e certamente não é a coisa com melhor desempenho no mundo.

Você pode usar tecnicamente todos os pacotes NPM com o Blazor, embora configurá-lo e interagir com ele do lado . NET possa ser um pouco chato, então você deve preferir um NuGet pacote na maioria das vezes.

Você pode usar o Blazor no desktop (Electron)?

Surpreendentemente, a resposta é sim. Enquanto a Microsoft planeja lançar o Blazor Desktop / Hybrid, que faz a mesma coisa, enquanto isso, você pode usar apenas o Electron normal. Isso ocorre porque o Electron realmente não se importa com a página da web que está servindo e pode apenas servir um aplicativo Blazor.

Você pode pensar que ele usaria um aplicativo Blazor WebAssembly, mas na verdade é mais fácil apenas adicionar Electron a um servidor ASP. NET Core existente. O WASM tem alguma sobrecarga, portanto, esse método é mais rápido. Isso é o que Electron. NET faz, e funciona surpreendentemente bem. Tudo que você precisa fazer é instalá-lo e adicionar Electron como um serviço ASP. NET. Você também pode chamar funções nativas do Electron em C #.

Publicidade

A Microsoft tem planos maiores para o Blazor Desktop, no entanto. Eles planejam se livrar completamente da dependência de um navegador e do JavaScript e apenas executar um contêiner nativo com uma visualização da web que é . NET totalmente instalada.

“ A área de trabalho do Blazor será estruturada de forma semelhante à forma como o Electron funciona. Haverá um controle WebView que renderiza o conteúdo de um servidor da web Blazor incorporado, que pode servir Blazor e outro conteúdo da web (JavaScript, CSS, etc.). ”

Esta visualização da web usaria Safari, WebKitGTK ou WebView2, dependendo do sistema operacional. O WebView2 usa o Chromium por baixo do capô, então funcionaria muito como o Electron, exceto por ter mais desempenho e usar menos memória.

Qualquer que seja a implementação, é empolgante ver outra plataforma competindo com JavaScript e Electron para criar aplicativos de plataforma cruzada para web e desktop. Blazor Desktop deve ser lançado em novembro de 2021 com a primeira visualização do . NET 6 &’ s.