Blazor v1.1
•Als PPTX, PDF herunterladen•
1 gefällt mir•3,152 views
Microsoft dotnet C# runing in Browser with web assembly using Blazor
Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (20)
Ähnlich wie Blazor v1.1
Ähnlich wie Blazor v1.1 (20)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
Blazor v1.1
- 1. Juan Luis Guerrero Minero @juanluelguerre http://elguerre.com
- 2. Agenda JavaScript Web Assemly Blazor Next Steps
- 3. JavaScript one of the most popular languages
- 5. Easy to learn: • King of the web • Dynamic typing • We have to know one more language • Ambiguous syntax • NOT PREDICTIBLE PERFORMANCE ! but….
- 8. What is Web Assembly (a.k.a WASM)?
- 9. https://webassembly.org/ • Announced in 17 June 2015 • Supported by major Browsers • Developed by WebAssembly Working Group (W3C) • Draft specific published 15 Feb 2018
- 10. WASM is a build target “for Browsers”
- 12. Debugging Testing Experimenting OptimizingLearning Teaching Write programs by hand Textual representation of the wasm binary format S-Expression
- 15. Compact bytecode Optimised for mínimum download sizes Optimised for maximun execution speed Regular assembly (x86/x64 or similar) Do what JavaScript can do No plugings So, Web Assembly (WASM):
- 17. Usage Scenarios in Web • Write faster versión of the specific application • Using existing C libraries in browser • Reuse algorithm from service side • Distribute whole application as wasm
- 19. Video editor: https://d2jta7o2zej4pf.cloudfront.net/ Game (Unity): http://webassembly.org/demo/Tanks/ Garden (Unreal Engine): https://s3.amazonaws.com/mozilla- games/ZenGarden/EpicZenGarden.html WebSight: https://websightjs.com AutoCAD: https://web.autocad.com Samples
- 21. Web Assembly Resources Articles: https://hacks.mozilla.org/category/webassembly Site: http://webassembly.org Github: https://github.com/WebAssembly Twitter: @WasmWeekly – WebAssemblyWeekly Specification: https://webassembly.github.io/spec/core/_download/WebAssembly.p df
- 23. Before anything… • Razor MVC • Razor Pages • Similar to ASP.NET ViewComponents. • Is more an MVVM framework • Enables two-way data binding • Useful for SPA apps.
- 24. Running .NET in the browser “The first step to building a .NET-based SPA framework is to have a way of running .NET code inside web browsers. We can at last do this based on open standards, supporting any web browser (without any plugins), thanks to WebAssembly.”
- 27. How it works Interpreter AOT Mono aims to run under WebAssembly in two modes:
- 28. So, Wich one is better? AOT Production Environments Interpreter Development Time Currently: Interpreter, is on (enabled) by default and AOT mode is not ready to be tried yet
- 29. Infrastructure • Layout • Component • App.cshtml • Routing • Dependency Injection • Main component (root) • Index.html
- 30. Blazor & JavaScript Interactions 1. Call JavaScript from Blazor (Interop JavaScript) 2. Call Blazor for JavaScript https://github.com/aspnet/Blazor.Docs/issues/59 https://learn-blazor.com/architecture/interop 1 2
- 32. Blazor on Mac ! dotnet new -i Microsoft.AspNetCore.Blazor.Templates dotnet new blazorhosted
- 34. Will WebAssembly replace JavaScript? Yes No now !
- 35. References • Introducción a Blazor • Getting Started • Learn Blazor • https://blazor.net/ • Gitter (aspnet/Blazor) • Blazor Backlog ! • Elguerre.com (blazor) @svqdotnet • Microsoft Build 2018: https://www.youtube.com/watch?v=KAIJ3ezQb3c&feature=youtu.be&t=4436 • https://codedaze.io/what-is-blazor-and-why-is-it-so-exciting/
- 37. Uno
- 39. Gracias
Hinweis der Redaktion
- https://elguerre.com/2018/04/11/javascript-ha-muerto-net-web-assembly-con-blazor/ Gracias a @alSkachkov
- https://octoverse.github.com/
- Since 1995 there are severals alternatives to get a better performance…
- https://webassembly.org/docs/faq/
- https://webassembly.org/ Works for: Firefox Chorme Safari Edge Opera (Just in a Desktop. At 2018/06/26). No Works for: IE Brower Compatibility: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly
- https://webassembly.org/docs/faq/
- To enable WebAssembly to be read and edited by humans, there is a textual representation of the wasm binary format: https://developer.mozilla.org/en-US/docs/WebAssembly/Understanding_the_text_format
- It’s a compact bytecode format optimised for minimum download sizes and maximum execution speed. Despite what a lot of developers first assume, it does not introduce new security concerns, because it isn’t regular assembly code (e.g., x86/x64 or similar) - that can only do what JavaScript can do. it’s a new bytecode format
- Brower Compatibility: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly
- https://wasdk.github.io/wasmcodeexplorer/
- https://blazor.net/ References: - http://blog.stevensanderson.com/2018/02/06/blazor-intro/
- http://www.mono-project.com/news/2018/01/16/mono-static-webassembly-compilation/ MVC: Razor Pages: It’s similar to ASP.NET ViewComponents. Is more an MVVM framework. It enables two-way data binding. Useful for SPA apps.
- http://www.mono-project.com/ http://www.mono-project.com/news/2018/01/16/mono-static-webassembly-compilation/
- http://blog.stevensanderson.com/2018/02/06/blazor-intro/ Interpreter: The Mono runtime itself is compiled to WebAssembly, but your .NET assembly files are not. The browser can then load and execute the Mono runtime, which in turn can load and execute standard .NET assemblies (regular .NET .dll files) built by the normal .NET compilation toolchain. This is similar to how, for the desktop CLR, the core internals of the CLR are distributed precompiled to native code, which then loads and executes .NET assembly files. One key difference is that the desktop CLR uses just-in-time (JIT) compilation extensively to make execution faster, whereas Mono on WebAssembly is closer to a pure interpretation model. Ahead-of-time (AOT) compiled mode In AOT mode, your application’s .NET assemblies are transformed to pure WebAssembly binaries at build time. At runtime, there’s no interpretation: your code just executes directly as regular WebAssembly code. It’s still necessary to load part of the Mono runtime (e.g., parts for low-level .NET services like garbage collection), but not all of it (e.g., parts for parsing .NET assemblies). This is similar to how the ngen tool has historically allowed AOT compilation of .NET binaries to native machine code, or more recently, CoreRT provides a complete native AOT .NET runtime.
- Interpreter: Faster AOT: Smaller and compression-friendly compared with AOT-compiled assemblies
- Backlog A component model for building composable UI Routing Layouts Forms and validation Dependency injection JavaScript interop Live reloading in the browser during development Server-side rendering Full .NET debugging both in browsers and in the IDE Rich IntelliSense and tooling Ability to run on older (non-WebAssembly) browsers via asm.js Publishing and app size trimming
- Blazr -> JS : https://learn-blazor.com/architecture/interop/ JS -> Blazor: https://github.com/aspnet/Blazor.Docs/issues/59
- Demos: Estructura de Proyecto Ejecutando y depurando (F12) …
- http://blog.stevensanderson.com/2018/02/06/blazor-intro/ https://www.jerriepelser.com/blog/getting-started-with-blazor/ https://learn-blazor.com/ https://elguerre.com/2018/04/11/javascript-ha-muerto-net-web-assembly-con-blazor/
- https://www.codeproject.com/Articles/1241210/WebAssembly-with-Blazor
- http://platform.uno/ https://github.com/nventive/Uno https://gitter.im/uno-platform/
- Practically any portable C or C++ codebase can be compiled into JavaScript using Emscripten !!! List of portable language: https://github.com/kripken/emscripten/wiki/Porting-Examples-and-Demos http://kripken.github.io/emscripten-site/ https://github.com/WebAssembly/design/issues/1087
- http://asmjs.org/ https://en.wikipedia.org/wiki/Asm.js