blob: b1975ab866e40dd1ed334973540663f2d2c7fe31 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
|
---
title: WebAssembly
slug: WebAssembly
tags:
- WebAssembly
- wasm
translation_of: WebAssembly
---
<div>{{WebAssemblySidebar}}</div>
<p class="summary" dir="ltr" id="docs-internal-guid-22bb55aa-d69e-e8ef-cbc6-aafea272f684">WebAssembly是一种新的编码方式,可以在现代的网络浏览器中运行 - 它是一种低级的类汇编语言,具有紧凑的二进制格式,可以接近原生的性能运行,并为诸如C / C ++等语言提供一个编译目标,以便它们可以在Web上运行。它也被设计为可以与JavaScript共存,允许两者一起工作。</p>
<h2 dir="ltr" id="简而言之">简而言之</h2>
<p dir="ltr">对于网络平台而言,WebAssembly具有巨大的意义——它提供了一条途径,以使得以各种语言编写的代码都可以以接近原生的速度在Web中运行。在这种情况下,以前无法以此方式运行的客户端软件都将可以运行在Web中。</p>
<p dir="ltr">WebAssembly被设计为可以和JavaScript一起协同工作——通过使用WebAssembly的JavaScript API,你可以把WebAssembly模块加载到一个JavaScript应用中并且在两者之间共享功能。这允许你在同一个应用中利用WebAssembly的性能和威力以及JavaScript的表达力和灵活性,即使你可能并不知道如何编写WebAssembly代码。</p>
<p dir="ltr">而且,更棒的是,这是通过<a href="https://www.w3.org/community/webassembly/">W3C WebAssembly Community Group</a>开发的一项网络标准,并得到了来自各大主要浏览器厂商的积极参与。</p>
<div class="row topicpage-table">
<div class="section">
<h2 dir="ltr" id="指南">指南</h2>
<dl>
<dt><a href="/zh-CN/docs/WebAssembly/Concepts">WebAssembly概念</a></dt>
<dd>通过阅读WebAssembly后面的高层概念开始——也就是说,它为什么如此有用,它是如何适应网络平台的(以及其他)和如何使用它。</dd>
<dt><a href="/zh-CN/docs/WebAssembly/C_to_wasm">从C/C++编译为WebAssembly</a></dt>
<dd>当你使用C/C++编写了代码后,你可以使用诸如Emscripten的工具把它编译为.wasm文件。让我们看看这是如何工作的。</dd>
<dt><a href="/zh-CN/docs/WebAssembly/Loading_and_running">加载运行WebAssembly代码</a></dt>
<dd>本文介绍如何通过把<a href="/en-US/docs/Web/API/Fetch_API">Fetch</a>或者<a href="/en-US/docs/Web/API/XMLHttpRequest">XHR</a> API与<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly">WebAssembly JavaScript </a>API结合在一起来获取、编译和实例化.wasm文件。</dd>
<dt><a href="/zh-CN/docs/WebAssembly/Caching_modules">缓存编译后的WebAssembly模块</a></dt>
<dd>就提升应用启动速度而言,在客户端缓存大的WebAssembly模块是有用的。本文解释了如何使用<a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a>来实现这一点。</dd>
<dt><a href="/zh-CN/docs/WebAssembly/Using_the_JavaScript_API">使用WebAssembly的JavaScript API</a></dt>
<dd>当加载了一个.wasm模块之后,你就想要使用它。在本文中,我们向你展示了如何通过WebAssembly的JavaScript API来使用WebAssembly。</dd>
<dt><a href="/zh-CN/docs/WebAssembly/Exported_functions">导出的WebAssembly函数</a></dt>
<dd>导出的WebAssembly函数是WebAssembly函数的JavaScript表现形式,并且允许从JavaScript中调用WebAssembly代码。本文描述它们。</dd>
<dt><a href="/zh-CN/docs/WebAssembly/Understanding_the_text_format">理解WebAssembly的文本格式</a></dt>
<dd>本文介绍了wasm的文本格式。这是在进行调试的时候浏览器开发者工具中展现出来的.wasm模块的一种低级文本表示。</dd>
<dt><a href="/zh-CN/docs/WebAssembly/Text_format_to_wasm">把WebAssembly文本格式转换为wasm</a></dt>
<dd>本文提供了一个如何把编写的文本格式的WebAssembly模块转换为 wasm二进制的指南。</dd>
</dl>
</div>
<div class="section">
<h2 dir="ltr" id="API参考">API参考</h2>
<dl>
<dt>{{jsxref("Global_objects/WebAssembly", "WebAssembly")}}</dt>
<dd>本对象是所有与WebAssembly相关功能的命名空间。</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Module", "WebAssembly.Module")}}</dt>
<dd>一个<code>WebAssembly.Module</code>对象包括了无状态的WebAssembly代码。该代码已经被浏览器编译并且能够<a href="/en-US/docs/Web/API/Worker/postMessage">通过Workers高效地共享</a>,<a href="/en-US/docs/WebAssembly/Caching_modules">缓存到IndexedDB中</a>以及多次实例化。</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Instance", "WebAssembly.Instance")}}</dt>
<dd>一个<code>WebAssembly.Instance</code>对象是一个有状态的、可执行的模块的实例。实例对象包含所有的能够从JavaScript调用到WebAssembly代码的<a href="/en-US/docs/WebAssembly/Exported_functions">导出的WebAssembly函数</a>。</dd>
<dt>{{jsxref("Global_objects/WebAssembly/instantiate", "WebAssembly.instantiate()")}}</dt>
<dd><code>WebAssembly.instantiate()</code> 函数是编译和实例化WebAssembly代码的主要的API,它返回一个<code>Module</code>及其第一个实例。</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Memory", "WebAssembly.Memory()")}}</dt>
<dd>一个<code>WebAssembly.Memory</code> 对象是一个可变长的{{jsxref("Global_objects/ArrayBuffer", "ArrayBuffer")}}。它拥有能够被实例存取的原始字节内存。</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Table", "WebAssembly.Table()")}}</dt>
<dd><code>WebAssembly.Table</code>对象是一个可变长类型数组。它存储诸如函数引用之类的不透明值并且能够被实例存取。</dd>
<dt>{{jsxref("WebAssembly.CompileError()")}}</dt>
<dd>创建一个新的WebAssembly <code>CompileError</code>对象。</dd>
<dt>{{jsxref("WebAssembly.LinkError()")}}</dt>
<dd>创建一个新的WebAssembly <code>LinkError</code>对象。</dd>
<dt>{{jsxref("WebAssembly.RuntimeError()")}}</dt>
<dd>创建一个新的WebAssembly <code>RuntimeError</code>对象。</dd>
</dl>
</div>
</div>
<h2 dir="ltr" id="示例">示例</h2>
<ul dir="ltr">
<li><a href="https://github.com/JasonWeathersby/WASMSobel">WASMSobel</a></li>
<li>参考我们的<a href="https://github.com/mdn/webassembly-examples/">WebAssembly示例</a>库来获取一些其他的例子。</li>
</ul>
<h2 id="规范">规范</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('WebAssembly JS')}}</td>
<td>{{Spec2('WebAssembly JS')}}</td>
<td>Initial draft definition of the JavaScript API.</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2>
<div>
<p>{{Compat("javascript.builtins.WebAssembly")}}</p>
</div>
<h2 id="参见">参见</h2>
<ul dir="ltr">
<li><a href="https://research.mozilla.org/webassembly/">WebAssembly on Mozilla Research</a></li>
<li><a href="http://webassembly.org/">webassembly.org</a></li>
<li><a href="https://hacks.mozilla.org/category/webassembly/">WebAssembly articles on Mozilla Hacks blog</a></li>
<li><a href="https://www.w3.org/community/webassembly/">W3C WebAssembly Community Group</a></li>
<li><a href="/en-US/docs/Web/HTTP/Headers/Large-Allocation">Large-Allocation HTTP header</a></li>
</ul>
|