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
114
115
116
117
|
---
title: WebAssembly
slug: WebAssembly
tags:
- Landing
- WebAssembly
- wasm
translation_of: WebAssembly
---
<div>{{WebAssemblySidebar}}</div>
<div>WebAssembly, modern web tarayıcılarda çalıştırılabilen yeni bir kod türüdür — yerel performansa yakın bir performansla çalışan ve C/C++, C# ve Rust gibi dillerle kompakt bir ikili biçime sahip düşük seviyeli bir dildir. Web üzerinde çalışabilmeleri için bir derleme hedefi ile JavaScript ile birlikte çalışabilecek şekilde tasarlanmıştır.</div>
<h2 dir="ltr" id="In_a_Nutshell">In a Nutshell</h2>
<p dir="ltr">WebAssembly has huge implications for the web platform — it provides a way to run code written in multiple languages on the web at near native speed, with client apps running on the web that previously couldn’t have done so.</p>
<p dir="ltr">WebAssembly is designed to complement and run alongside JavaScript — using the WebAssembly JavaScript APIs, you can load WebAssembly modules into a JavaScript app and share functionality between the two. This allows you to take advantage of WebAssembly's performance and power and JavaScript's expressiveness and flexibility in the same apps, even if you don't know how to write WebAssembly code.</p>
<p dir="ltr">And what's even better is that it is being developed as a web standard via the <a href="https://www.w3.org/wasm/">W3C WebAssembly Working Group</a> and <a href="https://www.w3.org/community/webassembly/">Community Group</a> with active participation from all major browser vendors.</p>
<div class="row topicpage-table">
<div class="section">
<h2 dir="ltr" id="Guides">Guides</h2>
<dl>
<dt><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></dt>
<dd>Get started by reading the high-level concepts behind WebAssembly — what it is, why it is so useful, how it fits into the web platform (and beyond), and how to use it.</dd>
<dt><a href="/en-US/docs/WebAssembly/C_to_wasm">Compiling a New C/C++ Module to WebAssembly</a></dt>
<dd>When you’ve written code in C/C++, you can then compile it into .wasm using a tool like <a href="/en-US/docs/Mozilla/Projects/Emscripten/">Emscripten</a>. Let’s look at how it works.</dd>
<dt><a href="/en-US/docs/WebAssembly/existing_C_to_wasm">Compiling an Existing C Module to WebAssembly</a></dt>
<dd>A core use-case for WebAssembly is to take the existing ecosystem of C libraries and allow developers to use them on the web.</dd>
<dt><a href="/en-US/docs/WebAssembly/rust_to_wasm">Compiling from Rust to WebAssembly</a></dt>
<dd>If you've written some Rust code, you can compile it into WebAssembly! This tutorial takes you through all you need to know to compile a Rust project to wasm and use it in an existing web app.</dd>
<dt><a href="/en-US/docs/WebAssembly/Loading_and_running">Loading and running WebAssembly code</a></dt>
<dd>After you have a .wasm, this article covers how to fetch, compile and instantiate it, combining the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly">WebAssembly JavaScript</a> API with the <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a> or <a href="/en-US/docs/Web/API/XMLHttpRequest">XHR</a> APIs.</dd>
<dt><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></dt>
<dd>Once you've loaded a .wasm module, you'll want to use it. In this article we show you how to use WebAssembly via the WebAssembly JavaScript API.</dd>
<dt><a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly functions</a></dt>
<dd>Exported WebAssembly functions are the JavaScript reflections of WebAssembly functions which allow calling WebAssembly code from JavaScript. This article describes what they are.</dd>
<dt><a href="/en-US/docs/WebAssembly/Understanding_the_text_format">Understanding WebAssembly text format</a></dt>
<dd>This article explains the wasm text format. This is the low-level textual representation of a .wasm module shown in browser developer tools when debugging.</dd>
<dt><a href="/en-US/docs/WebAssembly/Text_format_to_wasm">Converting WebAssembly text format to wasm</a></dt>
<dd>This article provides a guide on how to convert a WebAssembly module written in the text format into a .wasm binary.</dd>
</dl>
</div>
<div class="section">
<h2 dir="ltr" id="API_reference">API reference</h2>
<dl>
<dt>{{jsxref("Global_objects/WebAssembly", "WebAssembly")}}</dt>
<dd>This object acts as the namespace for all WebAssembly related functionality.</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Global", "WebAssembly.Global()")}}</dt>
<dd>A <code>WebAssembly.Global</code> object represents a global variable instance, accessible from both JavaScript and importable/exportable across one or more {{jsxref("WebAssembly.Module")}} instances. This allows dynamic linking of multiple modules.</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Module", "WebAssembly.Module()")}}</dt>
<dd>A <code>WebAssembly.Module</code> object contains stateless WebAssembly code that has already been compiled by the browser and can be efficiently <a href="/en-US/docs/Web/API/Worker/postMessage">shared with Workers</a>, and instantiated multiple times.</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Instance", "WebAssembly.Instance()")}}</dt>
<dd>A <code>WebAssembly.Instance</code> object is a stateful, executable instance of a <code>Module</code>. <code>Instance</code> objects contain all the <a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly functions</a> that allow calling into WebAssembly code from JavaScript.</dd>
<dt>{{jsxref("Global_objects/WebAssembly/instantiateStreaming", "WebAssembly.instantiateStreaming()")}}</dt>
<dd>The <code>WebAssembly.instantiateStreaming()</code> function is the primary API for compiling and instantiating WebAssembly code, returning both a <code>Module</code> and its first <code>Instance</code>.</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Memory", "WebAssembly.Memory()")}}</dt>
<dd>A <code>WebAssembly.Memory</code> object is a resizable {{jsxref("Global_objects/ArrayBuffer", "ArrayBuffer")}} that holds the raw bytes of memory accessed by an <code>Instance</code>.</dd>
<dt>{{jsxref("Global_objects/WebAssembly/Table", "WebAssembly.Table()")}}</dt>
<dd>A <code>WebAssembly.Table</code> object is a resizable typed array of opaque values, like function references, that are accessed by an <code>Instance</code>.</dd>
<dt>{{jsxref("WebAssembly.CompileError()")}}</dt>
<dd>Creates a new WebAssembly <code>CompileError</code> object.</dd>
<dt>{{jsxref("WebAssembly.LinkError()")}}</dt>
<dd>Creates a new WebAssembly <code>LinkError</code> object.</dd>
<dt>{{jsxref("WebAssembly.RuntimeError()")}}</dt>
<dd>Creates a new WebAssembly <code>RuntimeError</code> object.</dd>
</dl>
</div>
</div>
<h2 dir="ltr" id="Examples">Examples</h2>
<ul dir="ltr">
<li><a href="https://github.com/JasonWeathersby/WASMSobel">WASMSobel</a></li>
<li>See our <a href="https://github.com/mdn/webassembly-examples/">webassembly-examples</a> repo for a number of other examples.</li>
</ul>
<h2 id="Specifications">Specifications</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">Browser compatibility</h2>
<p>{{Compat("javascript.builtins.WebAssembly")}}</p>
<h2 id="See_also">See also</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>
<li><a href="https://developers.google.com/web/updates/2018/03/emscripting-a-c-library">Emscripting a C Library to Wasm</a></li>
</ul>
|
