TypeScript & WebAssembly
TypeScript & WebAssembly
WASM
(module
(func (param $lhs i32) (param $rhs i32) (result i32)
local.get $lhs
local.get $rhs
i32.add))
function computeSum(arr: i32[]): i32 {
var sum = 0
arr.forEach(value => {
sum += value // fails
})
return sum
}
var sum: i32 // becomes a WebAssembly Global
function computeSum(arr: i32[]): i32 {
sum = 0
arr.forEach(value => {
sum += value // works
})
return sum
}
//..................
function computeSum(arr: i32[]): i32 {
var sum = 0
for (let i = 0, k = arr.length; i < k; ++i) {
sum += arr[i] // works
}
return sum
}
npm
$ npm init
$ npm i @assemblyscript/loader
$ npm i -D assemblyscript
$ npx asinit .
$ npm run asbuild
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<p class="title">Web Assembly Example</p>
<script>
WebAssembly.instantiateStreaming(fetch("./build/optimized.wasm"), {
main: {
sayHello() {
console.log("Hello from WebAssembly!");
}
},
env: {
abort(_msg, _file, line, column) {
console.error("abort called at main.ts:" + line + ":" + column);
}
},
}).then(result => {
const exports = result.instance.exports;
document.getElementById("container").textContent = "Result: " + exports.add(19, 23);
}).catch(console.error);
</script>
<p id="container"></p>
</body>
</html>
refs
https://blog.bitsrc.io/typescript-to-webassembly-the-what-the-how-and-the-why-3916a2561d37
https://www.assemblyscript.org/
https://github.com/teambit/bit
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！
TypeScript & WebAssembly的更多相关文章
- WebAssembly学习(三)：AssemblyScript - TypeScript到WebAssembly的编译
虽然说只要高级语言能转换成 LLVM IR,就能被编译成 WebAssembly 字节码,官方也推荐c/c++的方式,但是让一个前端工程师去熟练使用c/c++显然是有点困难,那么TypeScript ...
- WebAssembly完全入门——了解wasm的前世今身
前言 接触WebAssembly之后,在google上看了很多资料.感觉对WebAssembly的使用.介绍.意义都说的比较模糊和笼统.感觉看了之后收获没有达到预期,要么是文章中的例子自己去实操不能成 ...
- 初探WebAssembly
1.前言 参加完2018年上海的QCon大会,想到了会议中来自Microsoft的朱力旻大佬讲的WebAssembly,感触颇深. 我之前完全没有了解过WebAssembly,之前没有了解的原因也很简 ...
- JavaScript是如何工作的：深入类和继承内部原理 + Babel和TypeScript 之间转换
这是专门探索 JavaScript 及其所构建的组件的系列文章的第 15 篇. 如果你错过了前面的章节,可以在这里找到它们: JavaScript 是如何工作的:引擎,运行时和调用堆栈的概述! Jav ...
- 使用Typescript实现依赖注入（DI）
前言DI总是和ico相辅相成的,如果想对DI有更多的了解,可以移步我的另一篇文章 依赖注入(DI)和控制反转(IOC),再次我就不多做赘述了. 前几天看见一道面试题,今天借这个话题想跟大家分享一下: ...
- WebAssembly是解决JavaScript 痼疾的银弹？
写在前面 <没有银弹>是 Fred Brooks 在 1987 年所发表的一篇关于软件工程的经典论文.该论文的主要论点是,没有任何一项技术或方法可以能让软件工程的生产力在十年内提高十倍. ...
- webassembly
为什么需要 WebAssembly 自从 JavaScript 诞生起到现在已经变成最流行的编程语言,这背后正是 Web 的发展所推动的.Web 应用变得更多更复杂,但这也渐渐暴露出了 JavaScr ...
- 微软下一代Web前端技术Blazor(C#编译为WebAssembly)
W3C Web标准化机构在制定下一代的网页技术WebAssembly.目前版本是1.0,主流浏览器的最新版本都已经支持.其特点是浏览器可以执行编译后的二进制程序,不需要像之前的程序,浏览器下载Java ...
- 翻译：WebAssembly简介：我们为什么要关心这个技术？
原文: https://tomassetti.me/introduction-to-webassembly/ WebAssembly简介:我们为什么要关心这个技术? 在对抗js的伟大战斗中有 ...
随机推荐
- 路由协议-RIP协议
一.路由协议的发展历程和分类 距离矢量路由协议--听信"谣言",使用跳数作为度量值,最大16(0-15)跳:RIP 链路状态路由协议--"地图"路由协议:OSP ...
- Linux下运行java报错:Error: Could not find or load main class SocketIOPropertites
[root@node01 testfileio]# javac SocketIOPropertites.java && java Soc ketIOPropertitesError: ...
- Bitter.Core系列二：Bitter ORM NETCORE ORM 全网最粗暴简单易用高性能的 NETCore ORM 之数据库连接
Bitter.Core NETCore 相当的简单易用,下面附上使用示例: 数据中连接:请在你的NETCORE 项目中 创建:Bitter.json 配置文件,然后追加如下配置内容: MSSQL 连接 ...
- 【题解】洛谷P3119 Grass Cownoisseur G
题面:洛谷P3119 Grass Cownoisseur G 本人最近在熟悉Tarjan的题,刷了几道蓝题后,我飘了 趾高气扬地点开这道紫题,我一瞅: 哎呦!这不是分层图吗? 突然就更飘了~~~ 用时 ...
- Java 执行过程中的内存模型
一.前言 本文的主要工作:尝试以时间顺序追踪一遍 Java 执行的整个过程,以及展示 JVM 中内存模型的相应变化. 本文的主要目的:希望能够通过 Java 执行过程的冰山一角,增进对编程语言工作原理 ...
- 基于粒子群算法的分组背包MATLAB实现
抽空看了一段时间的粒子群算法,这里仅针对其应用于动态规划中的背包问题的情况做下总结归纳,其他应用可以之后想到了再添加. 一:分组背包问题简介 假设有3个组,每组有2个物品,每种物品有3种属性,价值.体 ...
- Language Guide (proto3) | proto3 语言指南（八）未知字段和任意类型
未知字段和任意类型篇幅较少,因此将他们合并到本文进行描述. Unknown Fields - 未知字段 未知字段是格式良好的协议缓冲区序列化数据,表示解析器无法识别的字段.例如,当一个旧二进制代码解析 ...
- 十三：SpringBoot-基于Yml配置方式，实现文件上传逻辑
SpringBoot-基于Yml配置方式,实现文件上传逻辑 1.文件上传 2.搭建文件上传界面 2.1 引入页面模板Jar包 2.2 编写简单的上传页面 2.3 配置页面入口 3.SpringBoot ...
- 第2层交换和生成树协议(STP)__散知识点
1.交换式服务 网桥是基于软件的,而交换机使用专用集成电路(ASIC)来创建并维护其过滤表.2层交换机和网桥转发数据的速度比路由器快一些,因为它们不查看网络层报头的信息,不对数据包做任何修改.相反,在 ...
- MySQL特殊字符的转义处理
出现问题以及问题分析 这条语句会把user_name不为空的所有记录查询出来 select * from user where user_name like concat('%','_','%') 分 ...