一般来说在.net core使用WebAssembly 都是Blazor ，但是Blazor渲染界面，.net core也提供单纯的WebAssembly这篇博客我将讲解如何使用单纯的WebAssembly

安装WebAssembly模板

dotnet new install Microsoft.NET.Runtime.WebAssembly.Templates

安装完成以后在vs的新建项目的时候会出现如图的模板

然后我们下一步创建一个WebAssembly的项目,WebAssembly的项目很单纯,项目结构如下图：

我们可以看到项目及其简单，分别查看文件代码

Program.cs

using System;

using System.Runtime.InteropServices.JavaScript;

Console.WriteLine("Hello, Browser!");

public partial class MyClass

{

    [JSExport]

    internal static string Greeting()

    {

        var text = $"Hello, World! Greetings from {GetHRef()}";

        Console.WriteLine(text);

        return text;

    }

    [JSImport("window.location.href", "main.js")]

    internal static partial string GetHRef();

}

main.js

// Licensed to the .NET Foundation under one or more agreements.

// The .NET Foundation licenses this file to you under the MIT license.

import { dotnet } from './dotnet.js'

const { setModuleImports, getAssemblyExports, getConfig } = await dotnet

    .withDiagnosticTracing(false)

    .withApplicationArgumentsFromQuery()

    .create();

setModuleImports('main.js', {

    window: {

        location: {

            href: () => globalThis.window.location.href

        }

    }

});

const config = getConfig();

const exports = await getAssemblyExports(config.mainAssemblyName);

const text = exports.MyClass.Greeting();

console.log(text);

document.getElementById('out').innerHTML = text;

await dotnet.run();

index.html

<!DOCTYPE html>

<!--  Licensed to the .NET Foundation under one or more agreements. -->

<!-- The .NET Foundation licenses this file to you under the MIT license. -->

<html>

<head>

  <title>WebAssemblyDemo</title>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <link rel="modulepreload" href="./main.js" />

  <link rel="modulepreload" href="./dotnet.js" />

</head>

<body>

  <span id="out"></span>

  <script type='module' src="./main.js"></script>

</body>

</html>

这些代码及其简单，如果在遇到js性能瓶颈的时候就可以使用当前这种模式，使用单纯的WebAssembly去提高我们的产品性能

试试看执行一下程序，效果如下图：

如何使用单纯的`WebAssembly`的更多相关文章

  1. WebAssembly是解决JavaScript 痼疾的银弹？

    写在前面 <没有银弹>是 Fred Brooks 在 1987 年所发表的一篇关于软件工程的经典论文.该论文的主要论点是,没有任何一项技术或方法可以能让软件工程的生产力在十年内提高十倍. ...

  2. 思考----拒绝单纯copy

    工作4个多月以来感触最深的是: 做事情的时候遇到不会的可以上网查或者问别人,但是获取到的知识不能只是单纯的copy过来使用达到要求就ok, 更重要的是事后等有空了一定要仔细研究学习,使知识网络完整,这 ...

  3. 关于java sort的几种实现方式（单纯排序，按照bean的某一个字段，按照bean的多个字段）

    最近的开发过程中遇到了,按照bean类中的多个字段进行排序的情况,借此机会把相关的排序做法,简单整理备份一下. 1.list的单纯排序 2.list元素为bean的情况,按照bean的某一个属性进行排 ...

  4. 解决springmvc在单纯返回一个字符串对象时所出现的乱码情况(极速版)

    使用springmvc框架开发了这么长时间,之前都是直接返回jsp页面,乱码情况都是通过配置和手动编解码来解决,但是今天突然返回一段单纯的字符串时,发现中文乱码情况解决不了了,下面就给各位分享一下如何 ...

  5. WebAssembly：随风潜入夜

    What? WebAssembly 是一种二进制格式的类汇编代码,可以被浏览器加载和并进一步编译成可执行的机器码,从而在客户端运行.它还可以作为高级语言的编译目标,理论上任何语言都可以编译为 WebA ...

  6. EOS 新增的 WebAssembly 解释器，是什么鬼？

    Daniel Larimer 在最近的博客中透露,EOS 新增了官方的 WebAssembly 解释器,用来解释执行 WebAssembly 智能合约,加上之前的编译执行,EOS 智能合约有了两种执行 ...

  7. emscripten、 WebAssembly，传递字符串给c函数

    下面看具体的实例. 下面的代码是一个C函数,实现简单的字符串拼接,然后返回拼接的字符串. #include <stdio.h> #include <string>  char* ...

  8. SQL反模式学习笔记3 单纯的树

    2014-10-11 在树形结构中,实例被称为节点.每个节点都有多个子节点与一个父节点. 最上层的节点叫做根(root)节点,它没有父节点. 最底层的没有子节点的节点叫做叶(leaf). 中间的节点简 ...

  9. WebAssembly让你的Javascript计算性能提升70%

    现在的JavaScript代码要进行性能优化,通常使用一些常规手段,如:延迟执行.预处理.setTimeout等异步方式避免处理主线程,高大上一点的会使用WebWorker.即使对于WebWorker ...

  10. WebAssembly完全入门——了解wasm的前世今身

    前言 接触WebAssembly之后,在google上看了很多资料.感觉对WebAssembly的使用.介绍.意义都说的比较模糊和笼统.感觉看了之后收获没有达到预期,要么是文章中的例子自己去实操不能成 ...

随机推荐

  1. BeanCurrentlyInCreationException解决当前容器创建异常、循环依赖问题

    BeanCurrentlyInCreationException解决当前容器创建异常.循环依赖问题 一.什么是循环依赖呢? 类A依赖类B,类B也依赖类A,这种情况就会出现循环依赖. Bean A → ...

  2. 踩坑ffmpeg录制的mp4无法在浏览器上播放

    前言 使用ffmpeg编译好的程序在电脑上进行音视频转换,可以参考这篇:<windows电脑FFmpeg安装教程手把手详解_windows安装ffmpeg>,而我们要做的是在游戏引擎中集成 ...

  3. Luogu P4592 [TJOI2018]异或 做题记录

    随机跳的. 树上维护序列,显然树剖.维护异或,显然 01trie. 01trie 维护区间异或,显然可持久化一下. 看到时限很大,显然可以双 log. 于是跑一边树剖,再根据 id 暴力建一个 可持久 ...

  4. JavaImprove--Lesson01--枚举类，泛型

    一.枚举 认识枚举类 枚举是一种特殊的类 枚举的格式: 修饰符  enmu   枚举类名{ 名称1,名称2: 其它成员 } //枚举类 public enum A { //枚举类的第一列必须是罗列枚举 ...

  5. 花了1块钱体验一把最近很火的ChatGPT

    前言 最近 OpenAI 发布了 ChatGPT,一经发布就在科技圈火得不行. ChatGPT是什么呢? 简单得说,ChatGPT,是一种基于对话的 AI 聊天工具.我们来看看ChatGPT自己得回答 ...

  6. API安全技术

    自己在日常工作中会涉及到些安全的概念,但是没有成体系,因此最近研读了<API安全技术与实战>一书,在此做些文章记录. API安全是从安全的角度关注API领域的安全问题和这些问题的解决方案, ...

  7. Java 如何在PPT中设置形状组合、取消组合、编辑组合形状

    PPT中支持插入多达9种不同类型的形状,每种类型下又包含数十种形状样式.针对如此多种类型的形状,为页面元素设计需要.方便形状操作管理的目的,可通过形状"组合"的方式来固定多个形状的 ...

  8. 云小课｜MRS基础操作之集群健康检查

    本文分享自华为云社区<云小课|MRS基础操作之集群健康检查>,作者:阅识风云. 阅识风云是华为云信息大咖,擅长将复杂信息多元化呈现,其出品的一张图(云图说).深入浅出的博文(云小课)或短视 ...

  9. 云原生2.0时代下，DevOps实践如何才能更加高效敏捷？

    当前全球的数字化浪潮逐步加深,云计算成为当今信息化发展的重要基础设施,云原生(Cloud Native)在数字化浪潮中的角色逐步提升,成为近几年云计算领域炙手可热的话题. 首先我们来看看一张图,看看云 ...

  10. 如何使用 Node.js Stream API 减少服务器端内存消耗？

    摘要:让我们看一个示例,展示在内存消耗方面,采用流的编程思路带来的巨大优越性. 本文分享自华为云社区<使用 Node.js Stream API 减少服务器端内存消耗的一个具体例子>,作者 ...