Categories
back-end front-end Tools Web Services

Ep.62 – The FOMO Monster Returns

A heavily Microsoft slant for this one!

Where do I begin… well, have a listen, and if you really want to know more I have summarised the overall .NET conf stuff below 🙂

 

.NET Conf 2023 Keynote – Welcome to .NET 8

Introduction

  • .NET Conf over the next 3 days, hear from team, partners, and the .NET Community about what’s new in .NET and things people are building with it.
  • Goal: build a unified development platform that developers love and businesses trust, enabling them to build any kind of application with best-in-class runtime, programming languages, development tools, and a vast ecosystem.
  • Momentum: .NET used by over 6 million developers, adopting the latest version faster than ever, over 50,000 contributors to date, the most admired framework on Stack Overflow survey, and one of the highest velocity open source projects.
  • Launching .NET 8, one of the largest releases, built with trust and contributions from developers worldwide.

“Tomorrow our goal with .NET is to build a unified development platform that developers love and businesses trust.”

Performance Improvements in .NET 8

  • .NET 8 brings over 1,250 performance improvements.
  • Significant improvements in performance across frameworks and programming languages.
  • Notable improvements in the TechEmpower web framework benchmarks using ASP.NET Core, with an 18% improvement in the Json API scenario, reaching nearly 1 million requests per second.
  • In the Fortune scenario, which simulates real-world workload including database access and HTML rendering, a 24% improvement was achieved, reaching over 300,000 requests per second.

“.NET 8 brings over 1,250 performance improvements.”

Full Stack Web Apps and APIs with ASP.NET Core in .NET 8

  • ASP.NET Core in .NET 8 offers everything needed to build modern web apps, whether browser-based or scalable backend services.
  • No need to stitch together multiple frameworks, as ASP.NET Core provides a complete solution out of the box.
  • Includes Blazor, a front-end web framework for .NET, which allows using server and client together for full stack web UI needs.
  • Blazor in .NET 8 provides enhanced server-side rendering, navigation, and streaming rendering, optimizing page load time and elevating the user experience.
  • Improved performance in Blazor WebAssembly, with components rendering 20% faster.
  • New tooling enhances developer experience in Visual Studio and Visual Studio Code.

“ASP.NET Core in .NET 8 has everything you need to build modern web apps… No need to stitch together a solution from multiple different frameworks.”

 

“Blazor now includes enhanced server-side rendering capabilities… so you can optimize page load time and elevate the user experience.”

New APIs and Enhanced Tooling in ASP.NET Core for Productivity

  • ASP.NET Core in .NET 8 packed with new APIs that boost developer productivity.
  • New tooling in Visual Studio and Visual Studio Code enhances the developer experience.
  • Route Tooling in .NET 8 highlights route parameters and provides helpful warnings for unused parameters.
  • Primary Constructors feature in C# 2 allows concise syntax for declaring constructors with parameters available in the entire class body.
  • Enhanced Web CIL packaging format for deployment simplifies the process.
  • New built components for displaying data, defining section outlets, and handling authentication improve productivity.

“ASP.NET Core in .NET 8 packed with new APIs that allow you to be more productive.”

 

“New tooling in Visual Studio and Visual Studio Code enhances the developer experience.”

Endpoints Explorer in Visual Studio

  • Visual Studio has an Endpoints Explorer tool that allows developers to browse all routes registered in their application.
  • The routes are discovered statically, so there is no need to build or run the application to see them.

“I don’t need to build or run my application in order to see these routes. They’re all discovered statically.”

Generating Requests for Endpoints

  • Developers can select any endpoint and right-click to generate a request for it.
  • Visual Studio has a built-in HTTP request client that shows the request and response right within the IDE.

“I can select any of the endpoints that I’ve created, here’s my new one and right click to generate a request for it. This request will show up in Visual Studio’s new built-in HTTP request client.”

Testing API Endpoints

  • It is important to test API endpoints before shipping to production.
  • The speaker shares that they have already started writing tests for the API endpoint.
  • They mention using collection expressions, a new C# 12 feature, to provide a parameter value for a method that takes an IEnumerable.

“I’ve added a new test to exercise the API endpoint that I’ve just introduced, and I’m using another cool new C# 12 feature, collection expressions, to provide a parameter to a method that takes an IEnumerable.”

Debugging and Fixing Test

  • The test fails because it was not able to find the route associated with the new endpoint.
  • The speaker sets a breakpoint after registering all the routes in the application and debugs the test to figure out the issue.
  • The debugger display for the app type in .NET 8 has been improved, allowing better examination of the registered endpoints.

“My test is failing because it was not able to find the route associated with the new endpoint that I just added. I’m going to set a break point right here at the entry point for my application and start debugging my test to figure out what might be going on.”

 

“The debugger display for this type and quite a few others in ASP.NET has been improved in this particular case. I can take a look and examine the endpoints that are registered in my application.”

Front-End UI and Blazer

  • The speaker introduces the front-end UI for the web app and mentions that it is built using Blazer and Blazer components.
  • Blazer allows for server-side rendering and enhances the page loading experience by making it faster and smoother.

“That Dev experience for building that new endpoint API looked amazing.”

 

“This whole web app is built using Blazer and Blazer components.”

Server-Side Rendering with Blazer

  • Blazer and .NET 8 support server-side rendering, allowing the web app to be fully rendered from the server.
  • This improves the page loading speed and scalability.

“Blazer and .NET 8 support static server rendering.”

Enhanced Navigation and Form Handling with Blazer

  • Blazer enhances page navigation by intercepting requests and intelligently updating the DOM without requiring a full page reload.
  • This results in faster and smoother navigation without losing scroll position.
  • Blazer also enhances form handling by intercepting form requests and using fetch requests instead of full page reloads.

“Instead of doing a full page reload, Blazer’s intercepting the request, doing a fetch request, and then intelligently updating the DOM with the retrieved content from the server.”

Static Server Rendering and Enhanced Form Handling in Action

  • The speaker demonstrates the enhanced navigation and form handling features in the running app.
  • When filtering or submitting a form, the updates are fast, smooth, and preserve scroll position.

“It’s fast, it’s smooth, and I no longer lose my scroll position.”

 

“It’s fast, it’s smooth, and I no longer lose my scroll position.”

 

“That’s enhanced navigation and form handling.”

Streaming Rendering in Blazor

  • Apply streaming rendering attribute to the component to enable streaming rendering in Blazor.

With streaming rendering, Blazor will render the component immediately with some placeholder content, allowing for a faster user experience while the API call is being made. Once the API call is completed, Blazor will render the component again and stream the updated content to the browser. This provides a much better user experience as the page loads quickly and updates are streamed automatically.

Interactivity in Blazor Components

  • Apply the interactive render mode to build richly interactive components in Blazor.
  • Use either Blazor Server or Blazor Web Assembly to add interactivity to specific components.
  • Disable pre-rendering if animation repetition is undesired.

By applying the interactive render mode in Blazor, developers can create interactive and responsive user experiences. Even when using server side rendering, components such as a chatbot can be made interactive. This allows for a seamless user experience as users can simultaneously interact with the chatbot while browsing and filtering the product catalog.

No Websockets Required for Streaming Rendering

  • Streaming rendering in Blazor does not require a Websocket connection.
  • Streamed updates are sent on the same response used for the initial request.

Unlike other techniques, streaming rendering in Blazor does not require Websockets. The updates are sent on the same response used for the initial request, ensuring a streamlined and efficient process.

Maui and the C and C devkit extensions

  • Developers can install the Maui extension to easily set up the necessary dependencies.
  • Maui extension will automatically pull in other required extensions.
  • Detailed instructions for setting up Maui are available.

“Maui the C and the C devkit extensions”

Writing and debugging mobile apps with Maui

  • After setting up the Maui workloads, developers can start writing and debugging mobile apps.
  • Apps can be tested on any target platform supported by the device.
  • The speaker demonstrates running an app on a Mac, with Xcode and Android SDK installed.
  • The speaker shows the available deployment options, including the pixel emulator and different simulators provided by Xcode.
  • To run the app, the speaker simply hits the run button.

“once you have the Maui workloads you can then start writing your mobile apps and debugging them and trying them on any Target platform that your device supports so on my Mac here I have um xcode installed and I have my Android SDK installed so I can actually see all of those things when I zoom in down here to what we’re calling our language status item um and it’s telling me the project that I’m deploying to and also the target I’m deploying to so I’m going to go up and pin this so I can see it um and then when I click on this that says my Mac I can see all of the valid places I can deploy this app to so I have my pixel emulator and then I have all of the different simulators that xcode gives me we are going to run this on my Mac all I have to do is hit run and debug if I want to create a launch Json file I totally can but it’s really easy to just hit run or hit F5 if that’s what you like to do give it a second and then you see that the debugger launches and the app is going to pop right up for me”

Customizing Maui apps for different platforms

  • The speaker showcases a rebuilt version of the eShop app with a customized user interface using Maui.
  • The app’s UI is different from the previous version, demonstrating the flexibility of Maui.
  • The speaker compares the app running on Mac and iOS simulator, showing that it is cross-platform.
  • Customizations, such as adding a delete button on the desktop app, can be achieved with a few lines of code.
  • The speaker explains how the customization was done by modifying the XAML code for the basket item.

“so again this is the same eShop app we were just looking at but I rebuilt the UI in Maui so it’s a little bit different I took some creative liberties with it but I can just go ahead add things to my cart and then go look at my cart and see all of that in the total if I pop up my iOS simulator alongside this I already have the app running again and you can see it’s the exact same crossplatform even things like the app icon this purple Northern mountains logo is the exact same as it is on my Mac so it’s all part of Maui I didn’t have to do anything custom to get that to work both places and then I also customized the code so that on the cart page there’s a delete button only on the desktop app because on a mobile phone I might want to swipe right swipe to delete that’s something that people do but on my desktop app I probably don’t want to swipe with my trackpad as much so I just created this delete button does the same thing and all I had to do to make that work was actually go into the XAML go to the XAML for my basket item and use a couple lines of code to create a button that says on desktop it’s visible that’s it that’s all I had to do to customize this based on desktop or mobile apps”

Testing and running unit tests with Maui and C devkit

  • The speaker demonstrates running unit tests using the testing project in Visual Studio code.
  • The C devkit provides all the necessary tools for testing and running unit tests.
  • The speaker emphasizes having everything needed to get started with Maui and work on different platforms.

“and thanks to C devkit I can actually also go and see my testing project and run my unit tests right with inv Visual Studio code so I have everything I need right here to get started with Maui and to start working on all the different platforms”

Overview of .NET Maui developer experience

  • The speaker provides a sneak peek into the .NET Maui developer experience with Visual Studio code.
  • Maui is in preview and available for download and testing.
  • The speaker invites viewers to join a deep dive session later in the afternoon to explore more features of .NET Maui and .NET 8.

“that has been a sneak peek into the do net Maui developer experience with Visual Studio code like I said it’s in preview today so you’re more than welcome to download and try it out and you can also join me and my teammate David Orton now later this afternoon for a deep dive into all of the amazing features of dunet Maui and net 8”

Adoption of .NET Maui by Microsoft and other companies

  • The Microsoft 365 admin app and the Microsoft Azure app, both with millions of downloads, have adopted .NET Maui.
  • Companies worldwide are choosing .NET Maui as their platform for multiplatform development.
  • The speaker highlights the success of the MBC Sports Journey with .NET Maui, resulting in faster delivery of features and increased productivity.

“teams at Microsoft have been adopting net Maui over this past year including the micros moft 365 admin app and the Microsoft Azure app which have millions of downloads and excellent ratings across the platforms that they ship to there are companies around the globe that have adopted net Maui as their platform for multiplatform development let’s take a look at the MBC Sports Journey with net Maui for the last 10 plus years we have leveraged a multitude of Microsoft engineering Technologies specifically the net platform has been as productive as it has been innovative for us and our products as we continue to build crossplatform Solutions across the board we’re always looking to become more and more efficient and that’s where Mai comes in it has allowed us to coordinate and share code across web mobile and our apis leading to Features being delivered to the market faster having used Microsoft’s traditional crossplatform approach for mobile for more than eight years we have learned to streamline not only code productivity but also better collaborate and communicate within our product and Technology teams in 2022 our team embark on re right in the sports engine app we would attract to the D net Maui as it promises simpler and scalable development compared to other crossplatform Frameworks and with Microsoft fully behind Maui we decided to use it for this project this choice helped us to finish the work much quicker releasing the app in record time the success of this project underscores mau’s productivity boost reaffirming our choice to embrace this technology in my experience net Maui is intuitive and a timesaver it opens up the door to integrate with blazer on the

Leveraging AI in Application Development

  • Demonstrating how to use natural language to interact with an application.
  • Adding items to the cart using natural language commands.
  • Showing the code behind the AI integration in the chatbot.
  • Highlighting the use of semantic functions to invoke AI actions.
  • Emphasizing the ease of making applications intelligent with just a few lines of code.

“We have a very natural response and… you too can make your app intelligent”

AI in User Experiences

  • Microsoft and developers worldwide using AI to personalize user experiences.
  • Bing Chat as one of the most popular AI assistants built with .NET.
  • Collaboration with industry partners like Intel to push performance boundaries.

“AI is setting industry standards on how you build large-scale AI applications”

Cloud Native and Building Resilient Applications

  • Making .NET the best platform for building cloud-native applications.
  • Focus on observability, resilience, scalability, and ease of management.
  • Collaboration with service partners to extract useful components.
  • Deep integration with open telemetry for observability.
  • Improving security and size of containerized deployments in .NET 8.

“.NET team has been working really hard this release on lots of features”.

Ahead-of-Time Compilation

  • AOT (Ahead-of-Time) compilation in .NET 8 for performance optimization.
  • Creating small, self-contained executables for cloud-native microservices.
  • AOT sample application showcasing improvements in size, working set, and startup time.
  • SignalR and Entity Framework not fully compatible with AOT yet.

“We think that Partners really nicely with Cloud-native because you often have small microservices”

Publish Size of the Application Before

  • Before applying the AOT (Ahead-of-Time) compilation and trimming, the application size was 102 megabytes.
  • The published application included the entire framework and all its dependencies, making it quite large.

“This application contains the entire framework and every dependency required to run the application, but it’s not very small.”

AOT Compilation and Trimming

  • AOT allows us to trim the application to its bare minimum dependencies and compile the code natively without depending on the runtime.
  • Enabling AOT compilation during publishing resulted in a significant reduction in the application size.
  • By running the dotnet publish command with AOT enabled, the application was compiled to IL (Intermediate Language) and then transformed into native code.

“During this phase of compilation, you will get warnings if your app or any of your app dependencies are not native AOT compatible.”

Reduced Application Size

  • After applying AOT compilation and trimming, the application size was reduced from 102 megabytes to just 23 megabytes.
  • This reduction in size allows for better resource utilization and the ability to fit more applications onto a cluster.

“The app that was 102 Megs is now 23 megabytes. That’s amazing, and you’re going to be able to fit a lot more of those onto a cluster when you’re trying to achieve high-density Cloud native apps.”

Project management and configuration

  • Aspire handles all the project configuration details like connection strings, URLs, and ports.
  • The Aspire orchestration process injects the appropriate connection strings into the application at runtime.
  • The eShop application, consisting of about 13 projects, is wired up with only 63 lines of code.
  • Aspire eliminates the need for using Docker Compose or configuring multiple startup projects in Visual Studio.

“Project configuration details like connection strings, URLs, and ports are all handled by Aspire, saving developers time and effort.”

Aspire Dashboard overview

  • The Aspire Dashboard provides an overview of all the projects, containers, and executables in the entire application.
  • The dashboard displays error logs, end points, environment variables, and console logs.
  • Developers can run the entire application with a single run command and monitor its behavior through the dashboard.

“The Aspire Dashboard provides developers with a comprehensive overview of their application, allowing them to monitor various aspects like errors, end points, and environment variables.”

Traces and distributed tracing

  • The Aspire Dashboard allows developers to view a list of requests and traces that occurred in the application.
  • Traces provide a detailed view of the distributed operation, including calls to dependencies like Redis and RabbitMQ.
  • The dashboard helps identify errors and visualize the flow of the application.

“Traces in the Aspire Dashboard provide developers with a detailed view of the distributed operation, including calls to dependencies, facilitating effective troubleshooting.”

Aspire project structure and customization

  • Aspire projects include the Aspire AppHost and Aspire DoServiceDefaults projects.
  • The Aspire DoServiceDefaults project allows customization of default settings for Telemetry, health checks, service discovery, and resilience.
  • Developers can easily configure their own defaults for specific services or components.

“The Aspire project structure allows developers to customize default settings for various components and services, ensuring flexibility and adaptability in their applications.”

Deployment to Azure using Azure Developer CLI

  • The Azure Developer CLI supports deployment of Aspire projects to Azure.
  • Developers can run the “acd up” command to deploy the application to Azure after scanning the code in the current directory.
  • The Aspire project description file (appst) helps in understanding the application’s dependencies during deployment.

“With the Azure Developer CLI, developers can easily deploy Aspire projects to Azure, leveraging the project description file to ensure accurate deployment of dependencies.”