一般来说在.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. EF Core助力信创国产数据库

    前言 国产数据库作为国产化替代的重要环节,在我国信创产业政策的指引下实现加速发展,我们国产数据库已进入百花齐放的快速发展期,相信接触到涉及到政府类等项目的童鞋尤为了解,与此同时我们有一部分也在使用各种 ...

  2. 【1】从零玩转OSS阿里云存储服务之阿里云平台等操作-1-cong-ling-wan-zhuan-oss-a-li-yun-cun-chu-fu-wu-zhi-a-li-yun-ping-tai-deng-cao-zuo

    title: [1]从零玩转OSS阿里云存储服务之阿里云平台等操作 date: 2021-06-09 17:21:12.037 updated: 2021-12-26 17:43:18.92 url: ...

  3. Python——第四章：迭代器（Iterators）

    迭代器iterator: 提到迭代器,最典型的就是for循环 for 变量 in 可迭代: pass 可迭代对象iterable: 是指可以使用 for 循环进行遍历的对象.除了字符串 (str).列 ...

  4. Java反序列化漏洞-CC6链分析

    CC6利用链分析 经过之前对CC1链和URLDNS链的分析,现在已经对反序列化利用链有了初步的认识,这次来分析一个最好用的CC利用链--CC6. 为什么CC6是最好用的CC利用链,因为CC6不限制jd ...

  5. springmvc内嵌tomcat、tomcat整合springmvc、自研国产web中间件

    springmvc内嵌tomcat.tomcat整合springmvc.自研国产web中间件 这是由于公司老项目转化springboot存在太多坑,特别是hibernate事务一条就坑到跑路,你又不想 ...

  6. just_audio音频播放器

    代码 import 'package:flutter/material.dart'; import 'package:just_audio/just_audio.dart'; void main() ...

  7. MySQL进阶篇：详解索引概述

    2.1 MySQL进阶篇:第二章_二.一_索引概述 2.1.1 介绍 索引(index)是帮助MySQL高效获取数据的数据结构(有序).在数据之外,数据库系统还维护着满足 特定查找算法的数据结构,这些 ...

  8. Navicat 携手华为云GaussDB，联合打造便捷高效的数据库开发和建模工具方案

    本文分享自华为云社区<Navicat 携手华为云GaussDB,联合打造便捷高效的数据库开发和建模工具方案>,作者: GaussDB 数据库 . 近日, Navicat Premium顺利 ...

  9. 保姆级教程：带你体验华为云测试计划CodeArts TestPlan

    摘要:华为云测试计划(CodeArts TestPlan)是面向软件开发者提供的一站式云端测试平台,覆盖测试管理.接口测试,融入DevOps敏捷测试理念,帮助您高效管理测试活动,保障产品高质量交付. ...

  10. 云小课 | 守护网络安全不是问题，iptables的四表五链为你开启“八卦阵”

    摘要:担心网络基本安全?iptables八卦阵为您守护!本文带您一起了解iptables的相关知识. 网络世界就和现实世界一样,总是会有些不怀好意的"人"出现,扫扫你的端口啊,探测 ...