Desde el lanzamiento de Blazor Server con .NET Core 3.0 el mes pasado, mucha gente ha compartido su entusiasmo con nosotros sobre la posibilidad de construir una interfaz de usuario web del lado del cliente con solo .NET y C #. Al mismo tiempo, también hemos escuchado muchas preguntas sobre qué es Blazor Server, cómo se relaciona con Blazor WebAssembly y para qué escenarios Blazor Server es el más adecuado. ¿Debería elegir Blazor Server para sus necesidades de interfaz de usuario web del lado del cliente, o esperar a Blazor WebAssembly? Esta publicación busca responder estas preguntas y proporcionar información sobre cómo Blazor Server se desempeña a escala y cómo imaginamos que Blazor evolucionará en el futuro.
¿Qué es el servidor Blazor?
Las aplicaciones de Blazor Server alojan componentes de Blazor en el servidor y manejan las interacciones de la interfaz de usuario a través de una conexión SignalR en tiempo real. A medida que el usuario interactúa con la aplicación, los eventos de la interfaz de usuario se envían al servidor a través de la conexión para que los diversos componentes que componen la aplicación los manejen. Cuando un componente maneja un evento de IU, se representa en función de su estado actualizado. Blazor compara la salida recién renderizada con la que se renderizó anteriormente y envía los cambios al navegador y los aplica al DOM.
Dado que las aplicaciones de Blazor Server se ejecutan en .NET Core en el servidor, disfrutan de todos los beneficios de ejecutarse en .NET Core, incluido un excelente rendimiento en tiempo de ejecución y herramientas. Las aplicaciones de Blazor Server pueden aprovechar el ecosistema completo de las bibliotecas .NET Standard sin ninguna limitación impuesta por el navegador.
¿Cuándo debo usar Blazor Server?
Blazor Server le permite agregar una interfaz de usuario interactiva enriquecida a sus aplicaciones .NET
hoy sin tener que escribir JavaScript. Si necesita la interactividad de una aplicación de una sola página en su aplicación .NET, entonces Blazor Server es una gran solución.
Blazor Server se puede usar para escribir aplicaciones completamente nuevas o para complementar las aplicaciones existentes de MVC y Razor Pages. No es necesario reescribir la lógica de la aplicación existente. Blazor está diseñado para trabajar junto con MVC y Razor Pages, no para reemplazarlas. Puede continuar usando MVC y Razor Pages para sus necesidades de representación del servidor mientras usa Blazor para las interacciones de la interfaz de usuario del lado del cliente.
Blazor Server funciona mejor para escenarios en los que tiene una conexión de red confiable de baja latencia, que normalmente se logra cuando el cliente y el servidor están geográficamente en el mismo continente. Las aplicaciones que requieren actualizaciones instantáneas de extremadamente alta fidelidad en cada pequeño movimiento del mouse, como juegos en tiempo real o aplicaciones de dibujo, no son una buena opción para Blazor Server. Debido a que las aplicaciones de Blazor Server requieren una conexión de red activa, los escenarios fuera de línea no son compatibles.
Blazor Server también es útil cuando desea descargar el trabajo del cliente al servidor. Las aplicaciones de Blazor Server requieren solo una pequeña descarga para establecer la conexión con el servidor y procesar las interacciones de la interfaz de usuario. Todo el trabajo duro de ejecutar la lógica de la aplicación y representar la interfaz de usuario se realiza en el servidor. Esto significa que las aplicaciones de Blazor Server se cargan rápidamente incluso a medida que crece la funcionalidad de la aplicación. Debido a que el lado del cliente de una aplicación Blazor Server es tan delgado, es una gran solución para aplicaciones que necesitan ejecutarse en dispositivos de baja potencia.
Usando Blazor Server a escala
Blazor Server puede escalar desde una pequeña línea interna de aplicaciones comerciales hasta grandes aplicaciones de escala de Internet. Mientras que .NET Core 3.0 todavía estaba en versión preliminar, probamos Blazor Server para ver cómo se ven sus características de escala de línea de base. Pusimos una aplicación Blazor Server bajo carga con clientes activos y monitoreamos la latencia de las interacciones del usuario. En nuestras pruebas, una sola instancia
Standard_D1_v2 en Azure (1 vCPU, memoria de 3.5 GB) podría manejar más de 5,000 usuarios concurrentes sin ninguna degradación en la latencia.
Una instancia
Standard_D3_V2 (4 vCPU, memoria de 14GB) manejó más de 20,000 clientes concurrentes. El principal cuello de botella para manejar más carga fue la memoria disponible. ¿Verás este nivel de escala en tu propia aplicación? Eso dependerá en gran medida de la cantidad de memoria adicional que su aplicación requiera por usuario. Pero para muchas aplicaciones, creemos que este nivel de escala es bastante razonable. También planeamos publicar actualizaciones adicionales sobre mejoras en la escalabilidad del servidor Blazor en las próximas semanas. ¡Así que estad atentos!
¿Qué es Blazor WebAssembly?
Blazor es un marco de interfaz de usuario que puede ejecutarse en diferentes entornos. Cuando crea componentes de la interfaz de usuario con Blazor, obtiene la flexibilidad de elegir cómo y dónde se hospedan y ejecutan. Además de ejecutar sus componentes de IU en el servidor con Blazor Server, puede ejecutar esos mismos componentes en el cliente con Blazor WebAssembly. Esta flexibilidad significa que puede adaptarse a las necesidades de sus usuarios y evitar el riesgo de estar vinculado a un modelo específico de alojamiento de aplicaciones.
Las aplicaciones Blazor WebAssembly alojan componentes en el navegador utilizando un tiempo de ejecución .NET basado en WebAssembly. Los componentes manejan eventos de IU y ejecutan su lógica de representación directamente en el navegador. Las aplicaciones Blazor WebAssembly utilizan solo estándares web abiertos para ejecutar código .NET en el lado del cliente, sin la necesidad de complementos de navegador o transpilación de código. Al igual que con las aplicaciones de Blazor Server, el marco de Blazor maneja la comparación de la salida recién renderizada con lo que se renderizó anteriormente y actualiza el DOM en consecuencia, pero con Blazor WebAssembly la representación de la interfaz de usuario se maneja del lado del cliente.
¿Cuándo debo usar Blazor WebAssembly?
Blazor WebAssembly todavía está en versión preliminar y aún no está listo para su uso en producción. Si está buscando una solución preparada para la producción, Blazor Server es lo que le recomendamos.
Una vez que se envíe Blazor WebAssembly (mayo de 2020), permitirá ejecutar componentes de Razor y código .NET en el navegador del dispositivo del usuario. Las aplicaciones Blazor WebAssembly ayudan a descargar el trabajo del servidor al cliente. Una aplicación Blazor WebAssembly puede aprovechar los recursos informáticos, de memoria y de almacenamiento del dispositivo cliente, así como otros recursos disponibles a través de las API de navegador estándar.
Las aplicaciones Blazor WebAssembly no requieren el uso de .NET en el servidor y pueden usarse para construir sitios estáticos. Una aplicación Blazor WebAssembly es solo un conjunto de archivos estáticos que se pueden alojar con cualquier solución de alojamiento de sitios estáticos, como páginas de GitHub o Azure Static Website Hosting. Cuando se combina con un trabajador de servicio, una aplicación Blazor WebAssembly puede funcionar completamente fuera de línea.
Cuando se combina con .NET en el servidor, Blazor WebAssembly permite el desarrollo web de pila completa. Puede compartir código, aprovechar el ecosistema .NET y reutilizar sus habilidades e infraestructura .NET existentes.
La inclusión de un tiempo de ejecución .NET con su aplicación web aumenta el tamaño de la aplicación, lo que afectará el tiempo de carga. Si bien hay una variedad de técnicas para mitigar esto (procesamiento previo en el servidor, almacenamiento en caché HTTP, enlace IL, etc.), Blazor WebAssembly puede no ser la mejor opción para aplicaciones que son muy sensibles al tamaño de descarga y al tiempo de carga.
Las aplicaciones Blazor WebAssembly también requieren un navegador que admita WebAssembly. WebAssembly es compatible con todos los navegadores modernos, incluidos los navegadores móviles y de escritorio. Sin embargo, si necesita admitir navegadores antiguos sin compatibilidad con WebAssembly, entonces Blazor WebAssembly no es para usted.
Blazor WebAssembly está optimizado para escenarios de representación de la interfaz de usuario, pero actualmente no es excelente para ejecutar cargas de trabajo intensivas de CPU. Las aplicaciones Blazor WebAssembly de hoy usan un intérprete .NET IL para ejecutar su código .NET, que no tiene el mismo rendimiento que un tiempo de ejecución nativo de .NET con compilación JIT. Estamos trabajando para abordar mejor este escenario en el futuro agregando soporte para compilar su código .NET directamente en WebAssembly en lugar de usar un intérprete.
Puedes cambiar de opinión más tarde
Independientemente de si elige Blazor Server o Blazor WebAssembly, siempre puede cambiar de opinión más adelante. Todas las aplicaciones Blazor usan un modelo de componente común, los componentes Razor. Los mismos componentes se pueden alojar en una aplicación Blazor Server o una aplicación Blazor WebAssembly. Entonces, si comienza con un modelo de alojamiento Blazor y luego decide que desea cambiar a uno diferente, hacerlo es muy sencillo.
¿Qué sigue para Blazor?
Después de enviar Blazor WebAssembly, planeamos expandir Blazor para admitir no solo aplicaciones web, sino también aplicaciones web progresivas (PWA), aplicaciones híbridas e incluso aplicaciones completamente nativas.
- Blazor PWAs: los PWA son aplicaciones web que aprovechan los últimos estándares web para proporcionar una experiencia más nativa. Los PWA pueden admitir escenarios fuera de línea, notificaciones push e integraciones del sistema operativo, como el soporte para fijar la aplicación a la pantalla de inicio o al menú Inicio de Windows.
- Blazor Hybrid: las aplicaciones híbridas son aplicaciones nativas que usan tecnologías web para la interfaz de usuario. Los ejemplos incluyen aplicaciones Electron y aplicaciones móviles que se muestran en una vista web. Las aplicaciones Blazor Hybrid no se ejecutan en WebAssembly, sino que usan un tiempo de ejecución nativo de .NET como .NET Core o Xamarin. Puedes encontrar una muestra experimental para usar Blazor con Electron en GitHub.
- Blazor Native: las aplicaciones de Blazor hoy en día procesan HTML, pero el renderizador se puede reemplazar para representar controles nativos. Una aplicación nativa de Blazor se ejecuta de forma nativa en los dispositivos y utiliza una abstracción de interfaz de usuario común para representar los controles nativos para ese dispositivo. Esto es muy similar a cómo funcionan hoy marcos como Xamarin Forms o React Native.
Estos tres esfuerzos son actualmente experimentales. Esperamos tener vistas previas oficiales de soporte para las aplicaciones Blazor PWAs y Blazor Hybrid que usan Electron en el marco de tiempo .NET 5 (noviembre de 2020). Todavía no hay una hoja de ruta para el soporte de Blazor Native, pero es un área que estamos investigando activamente.
Resumen
Con .NET Core 3.0, puede construir una interfaz de usuario interactiva enriquecida del lado del cliente
hoy con Blazor Server. Blazor Server es una excelente manera de agregar funcionalidad del lado del cliente a sus aplicaciones web existentes y nuevas utilizando sus habilidades y activos .NET existentes. Blazor Server está diseñado para escalar para todas sus necesidades de aplicaciones web. Blazor WebAssembly todavía está en versión preliminar, pero se espera que se envíe en mayo del próximo año. En el futuro, esperamos seguir evolucionando Blazor para admitir PWA, aplicaciones híbridas y aplicaciones nativas. Por ahora, ¡esperamos que pruebe Blazor Server
instalando .NET Core 3.0 !