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

Conteúdo

Logotipo da Blazor

Blazor é uma nova estrutura da Web da Microsoft projetada para competir com plataformas líderes de mercado, como React. Exceto que, em vez de usar JavaScript, é 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 inclusivo??

Se você vem do mundo das estruturas JavaScript, você pode estar confuso quanto a vincular o Blazor ao ASP.NET. Ambos são “web quadros”, mas o Blazor é apenas uma parte do ecossistema ASP.NET.

Enquanto o Plataforma ASP.NET tem quase 20 anos nesta época, não é uma moldura de dinossauro; tem melhorado constantemente junto com C # e .NET como um todo, já que a Microsoft o usa internamente. É absolutamente multiplataforma e tão eficiente como sempre.

No princípio, apenas ASP.NET existia, que pode ser usado para fazer todos os tipos de aplicativos da web. Eu era ASP.NET MVC (Model-View-Controller), que cria páginas da web baseadas em dados, e ASP.NET WebAPI, que é especializada em API de back-end. Eles foram recentemente mesclados em um pacote unificado com o ASP.NET Core modernizado.

Faz cinco anos, Razor Pages (que é algo diferente de Blazor e tem um nome confuso) foi lançado para simplificar a sintaxe expressiva do MVC, que precisa de muito texto padrão e, Como tal, não funciona bem com design centrado em componentes de aplicativos modernos. O MVC precisa que você crie uma visualização e um modelo para cada página em arquivos separados:

MVC requer que você crie uma visualização e um modelo para cada página em arquivos separados:

Entretanto, com navalha, você pode criar páginas ou componentes mais otimizados com código incorporado na própria página. Isso funciona melhor quando as páginas são mais simples, mas ambos estão disponíveis como opções para seu uso.

Entretanto, com navalha, você pode criar páginas ou componentes mais otimizados com código incorporado na própria página.

Todas essas características fazem parte do ecossistema “ASP.NET”. A grande parte são os pacotes e suporte. Da mesma forma que NPM para JavaScript, C # também tem um ambiente de pacote saudável com gerenciador de pacotes NuGet.

Então, O que é blazor?

Blazor não muda nada sobre a sintaxe dessas páginas. Você continuará a usar as páginas do Razor e / o MVC. Na realidade, isso nem é uma coisa ruim, porque já existem inúmeras interfaces de usuário e bibliotecas de componentes construídas para páginas Razor baseadas em C #.

O que Blazor adiciona é interatividade. Páginas MVC tradicionais / O Razor usando ASP.NET sempre foi desajeitado e teve problemas para se manter atualizado com aplicativos da web em tempo real como o React. Os aplicativos da web em tempo real são tão rápidos que também estão começando a assumir o controle da área de trabalho, com estruturas como 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 equivalente ao React, onde as ações modificam o status e os acessórios e acionam as atualizações do aplicativo. A estrutura cuidará de atualizar o DOM com base nos componentes que precisam ser atualizados. Isso permite aplicativos em tempo real nos quais a página pode ser atualizada ou até mesmo redesenhada completamente sem a necessidade de atualizar o navegador..

O benefício do Blazor sobre uma estrutura estabelecida como React é a linguagem. Permite que você crie aplicativos da web com C #, e isso por si só o torna atraente para muitos desenvolvedores. Seja qual for a sua opinião sobre o debate da escrita dinâmica vs. estática, há definitivamente benefícios para “mesa” como C #, e a web carece seriamente de alternativas para JavaScript.

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

Blazor permite melhor interoperabilidade. Muitos aplicativos também usam C # e el backend. Como um exemplo, você pode ter uma API ASP.NET que interage com sua interface React. Você precisará de modelos separados para o servidor e o cliente, bem como um código separado para interagir com eles. Se eles são da mesma língua, permite que você compartilhe facilmente códigos e bibliotecas entre cliente e servidor. É por isso que o NodeJS existe no lado do servidor, mesmo que o JavaScript não seja a linguagem de desktop ideal, ter aplicativos integrados em uma única linguagem reduz o tempo de desenvolvimento.

O futuro do Blazor

Na realidade, 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. Hoje em dia, existem duas versões que foram lançadas:

  • Servidor Blazor, que funciona como React Server Side Rendering e faz a maior parte da renderização no servidor.
  • Blazor WebAssembly, que usa a magia do WebAssembly para executar 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 PESO, que é projetado para publicar o site como um aplicativo da web progressivo (PESO) instalável.
  • Blazor Desktop / Híbrido, que torna possível empacotar aplicativos Blazor em aplicativos de desktop e é simplesmente como o Electron, mas com melhor desempenho.
  • Blazor nativo, que substitui a interface do usuário baseada na web por uma interface nativa da plataforma. Não está claro o quão útil isso é, enquanto a interoperabilidade com as ferramentas Blazor existentes, e esta versão ainda está em fase de planejamento.

Em seu anúncio Blazor Desktop, A Microsoft afirmou que “Blazor é um modelo de programação de aplicativos. É muito adaptável e pode ser executado de várias maneiras (De acordo com a necessidade) “.

A Microsoft parece pensar no Blazor como seu próximo padrão para a criação de interfaces de aplicativos.. Seu trabalho também é importante destacar, porque à medida que os aplicativos se tornam cada vez mais dependentes da web, mais difícil de justificar a criação de interfaces separadas para web e desktop. O Blazor tem um futuro brilhante e os aplicativos da web construídos hoje no Blazor Server e WebAssembly terão muito espaço para crescer..

Blazor Server frente a Blazor WebAssembly

Blazor Server usa um Conexão SignalR para se comunicar entre cliente e servidor. Esta é apenas uma camada sofisticada em cima de 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.

O Blazor Server usa uma conexão SignalR para se comunicar entre o cliente e o servidor.

Blazor WebAssembly é onde fica muito legal. WebAssembly (WASM) não é realmente uma língua que você escreve, mas um alvo do compilador. Na realidade, funciona quase exatamente como a linguagem intermediária da Microsoft (MSIL) em que todos os C's são compilados #, F # e VB.NET. Exceto que, em vez de executar com um ambiente de execução .NET, é executado usando o tempo de execução WebAssembly no navegador.

Wasm pode ser usado como um alvo de compilação portátil para outras linguagens

A grande vantagem do WebAssembly é que é uma meta do compilador relativamente fácil de atingir. Da mesma forma que C # pode ser compilado em MSIL, C # também pode ser compilado em WebAssembly. Nós vamos, tecnicamente, é MSIL compilando em WebAssembly (uma vez que é mais simples), mas o ponto é o mesmo.

Qualquer linguagem pode ser compilada em WASM, incluindo linguagens de desktop absolutamente nativas como C ++. Isso não é teórico, realmente funciona na prática. AutoDesk foi capaz de portar AutoCAD, uma base de código C ++ a partir de 30 anos, para um aplicativo da web baseado em WebAssembly, em alguns meses com relativa facilidade. Alguem mesmo portado Ruína 3.

O Blazor WebAssembly apenas leva todo o servidor, bem como o runtime .NET e o executa sobre o WASM. Subseqüentemente, em vez de falar com o servidor via SignalR, fale diretamente com o DOM. Isso elimina o processamento do lado do servidor, que pode ser ideal para algumas aplicações.

Em vez de falar com o servidor por meio do SignalR, Blazor WebAssembly fala diretamente com o DOM.

Isso o coloca em uma posição única para competir com estruturas como React, uma vez que é essencialmente o primeiro verdadeiro concorrente do JavaScript para aplicativos da web do cliente. Embora você precise adicionar algumas tags de script para carregar o tempo de execução, talvez seja necessário mergulhar os dedos do pé no código JavaScript para algumas coisas., em geral, você deve ser capaz de criar um aplicativo da web de produção completa sem escrever uma única linha de JavaScript.

Blazor WASM tem tempos de carregamento inicial lentos, mas isso pode realmente ser corrigido através do uso de um modo híbrido que usa a pré-renderização para gerar a renderização inicial no servidor, mas execute todas as atualizações subsequentes via WASM. Isso tem muitas peculiaridades e ainda está em beta, mas se você quiser mais informações, poderia veja estes guias Jon Hilton.

Si utiliza Blazor Server ou Blazor WebAssembly, depende de você. 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. Blazor WASM é responsivo e rápido, e pode até mesmo ser implementado como um site estático servido apenas com NGINX.

Como o Blazor funciona com JavaScript?

Seja qual for o caso, tem total interoperabilidade de JavaScript. O Blazor pode chamar funções JS de código gerenciado:

Private async Task ConvertArray()
{
    texto = novo(esperar JS.InvokeAsync<fragmento>("convertArray", quoteArray));
}

E vice-versa:

DotNet.invokeMethodAsync('{NOME DA MONTAGEM}', '{.ID DO MÉTODO LÍQUIDO}', {ARGUMENTOS});

Apesar disto, note que isso, desde já, vai usar reflexão, e certamente não é a coisa mais eficaz do mundo.

Tecnicamente, você pode usar todos os pacotes NPM com Blazor, mesmo ao configurar e interagir com ele do lado .NET pode ser uma dor de cabeça, então você deve preferir um pacote NuGet na maioria das vezes.

Você pode usar o Blazor na área de trabalho (Elétron)?

Você pode usar o Blazor na área de trabalho.

Surpreendentemente, a solução é sim. Embora a Microsoft planeje lançar o Blazor Desktop / Híbrido, isso faz o mesmo, Entretanto, pode usar elétron normal. Isso ocorre porque o Electron realmente não se importa com qual página da web está servindo e apenas um aplicativo Blazor pode servir.

Você pode pensar que usaria um aplicativo Blazor WebAssembly, mas é realmente mais fácil apenas adicionar Electron a um servidor ASP.NET Core existente. WASM tem alguma sobrecarga, então este 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. Além disso, você pode chamar funções elétron nativas de C #.

Apesar disto, Microsoft tem planos maiores para o Blazor Desktop. Eles planejam se livrar completamente da dependência de um navegador e do JavaScript e apenas executar um contêiner nativo com um webview que seja .NET totalmente..

“O desktop Blazor será estruturado de forma equivalente a como o Electron funciona. Haverá um controle WebView que processa o conteúdo de um servidor da web Blazor embutido, que pode servir tanto ao Blazor quanto a outros conteúdos da web (JavaScript, CSS, etc.) “.

Este webview usaria Safari, WebKitGTK o WebView2, dependendo do sistema operacional. WebView2 usa o Chromium por baixo do capô, por isso funcionaria de forma muito equivalente ao Electron, exceto por ser mais eficiente e usar menos memória.


Seja qual for a implementação, é empolgante ver outra plataforma competindo com JavaScript e Electron para construir aplicativos de desktop e web multiplataforma. Blazor Desktop deve ser lançado em novembro 2021 com a primeira visualização do .NET 6.

Assine a nossa newsletter

Nós não enviaremos SPAM para você. Nós odiamos isso tanto quanto você.