diff options
Diffstat (limited to 'files/de/web/javascript/reference/global_objects/webassembly')
3 files changed, 289 insertions, 0 deletions
diff --git a/files/de/web/javascript/reference/global_objects/webassembly/compile/index.html b/files/de/web/javascript/reference/global_objects/webassembly/compile/index.html new file mode 100644 index 0000000000..a18c69da30 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/webassembly/compile/index.html @@ -0,0 +1,91 @@ +--- +title: WebAssembly.compile() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/compile +tags: + - API + - JavaScript + - Method + - Object + - Reference + - WebAssembly + - compile +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compile +--- +<div>{{JSRef}}</div> + +<p>Die <strong><code>WebAssembly.compile()</code></strong> Funktion kompiliert ein {{jsxref("WebAssembly.Module")}} aus WebAssembly Binärcode. Hilfreich ist diese Funktion, um ein Modul zu kompilieren, bevor es instanziiert werden kann (Andernfalls sollte die {{jsxref("WebAssembly.instantiate()")}} Funktion verwendet werden).</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">Promise<WebAssembly.Module> WebAssembly.compile(bufferSource);</pre> + +<h3 id="Parameter">Parameter</h3> + +<dl> + <dt><em>bufferSource</em></dt> + <dd>Ein <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typisiertes Array</a> oder <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">ArrayBuffer</a>, das den Binärcode des zu kompilierenden .wasm Moduls enthält.</dd> +</dl> + +<h3 id="Rückgabewert">Rückgabewert</h3> + +<p>Ein <code>Promise</code>, das sich in ein {{jsxref("WebAssembly.Module")}} kompiliertes Objekt auflöst.</p> + +<h3 id="Fehlerbehandlung">Fehlerbehandlung</h3> + +<ul> + <li>Wenn <code>bufferSource</code> kein <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typisiertes Array</a> ist, wird ein {{jsxref("TypeError")}} geworfen.</li> + <li>Wenn die Kompilierung fehlschlägt, wird das Promise mit einem {{jsxref("WebAssembly.CompileError")}} verworfen.</li> +</ul> + +<h2 id="Beispiele">Beispiele</h2> + +<p>Das folgende Beispiel kompiliert den geladenen simple.wasm Bytecode unter Verwendung der <span style="font-size: 1rem; letter-spacing: -0.00278rem;"> </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">compile()</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> Funktion und sendet ihn an einen </span><a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API" style="font-size: 1rem; letter-spacing: -0.00278rem;">Web Worker</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> mittels </span><a href="/en-US/docs/Web/API/Worker/postMessage" style="font-size: 1rem; letter-spacing: -0.00278rem;">postMessage()</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span></p> + +<pre class="brush: js">var worker = new Worker("wasm_worker.js"); + +fetch('simple.wasm').then(response => + response.arrayBuffer() +).then(bytes => + WebAssembly.compile(bytes) +).then(mod => + worker.postMessage(mod) +);</pre> + +<div class="note"> +<p><strong>Hinweis</strong>: Du wirst wahrscheinlich in den meisten Fällen {{jsxref("WebAssembly.compileStreaming()")}} verwenden wollen, da es effizienter als <code>compile()</code> arbeitet.</p> +</div> + +<h2 id="Spezifikationen">Spezifikationen</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spezifikation</th> + <th scope="col">Status</th> + <th scope="col">Kommentar</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblycompile', 'compile()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browserkompatibilität</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.compile")}}</p> +</div> + +<h2 id="Siehe_auch">Siehe auch</h2> + +<ul> + <li><a href="/de-DE/docs/WebAssembly">WebAssembly</a> Übersichtsseite</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/de/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html b/files/de/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html new file mode 100644 index 0000000000..13cbbdeef4 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html @@ -0,0 +1,87 @@ +--- +title: WebAssembly.compileStreaming() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStreaming +tags: + - API + - JavaScript + - Method + - Object + - Reference + - WebAssembly + - compile + - compileStreaming + - streaming +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStreaming +--- +<div>{{JSRef}}</div> + +<p>Die <strong><code>WebAssembly.compileStreaming()</code></strong> Funktion kompiliert ein {{jsxref("WebAssembly.Module")}} direkt aus einer zugrunde liegenden Quelle. Nützlich ist diese Funktion wenn ein Modul kompiliert werden muss, bevor es instanziiert werden kann. (ansonsten sollte die {{jsxref("WebAssembly.instantiateStreaming()")}} Funktion verwendet werden).</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">Promise<WebAssembly.Module> WebAssembly.compileStreaming(<em>source</em>);</pre> + +<h3 id="Parameter">Parameter</h3> + +<dl> + <dt><em>source</em></dt> + <dd>Ein {{domxref("Response")}} Objekt oder ein Promise das sich zu einem solchen auflöst. Es stellt die zugrunde liegende Quelle eines .wasm Moduls dar, die gestreamt und kompiliert werden soll.</dd> +</dl> + +<h3 id="Rückgabewert">Rückgabewert</h3> + +<p>Ein <code>Promise</code> das sich in ein {{jsxref("WebAssembly.Module")}} Objekt auflöst, welche das kompilierte Modul darstellt.</p> + +<h3 id="Ausnahmen">Ausnahmen</h3> + +<ul> + <li>Wenn <code>bufferSource</code> kein <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typisiertes Array<font color="#001000"> </font></a>ist, wird ein {{jsxref("TypeError")}} geworfen.</li> + <li>Schlägt die Kompilierung fehl, wird das Promise mit einem {{jsxref("WebAssembly.CompileError")}} verworfen.</li> +</ul> + +<h2 id="Beispiele">Beispiele</h2> + +<p>Das folgende Beispiel (siehe unsere <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/compile-streaming.html">compile-streaming.html</a> Demo auf GitHub, und <a href="https://mdn.github.io/webassembly-examples/js-api-examples/compile-streaming.html">siehe das live Beispiel</a>) streamt ein .wasm Modul direkt aus der zugrunde liegenden Quelle und kompiliert es in ein {{jsxref("WebAssembly.Module")}} Objekt. Weil die <code>compileStreaming()</code> Funktion ein Promise für ein {{domxref("Response")}} Objekt annimmt, kann ihr direkt ein {{domxref("WindowOrWorkerGlobalScope.fetch()")}} Aufruf durchgereicht werden, woraufhin es die Antwort in diese Funktion abgibt, sobald das Promise sich erfüllt.</p> + +<pre class="brush: js">var importObject = { imports: { imported_func: arg => console.log(arg) } }; + +WebAssembly.compileStreaming(fetch('simple.wasm')) +.then(module => WebAssembly.instantiate(module, importObject)) +.then(instance => instance.exports.exported_func());</pre> + +<p>Das resultierende Modul wird dann mittels {{jsxref("WebAssembly.instantiate()")}} instanziiert und die bereitgestellte Funktion wird aufgerufen.</p> + +<h2 id="Spezifikationen">Spezifikationen</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spezifikationen</th> + <th scope="col">Status</th> + <th scope="col">Kommentar</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly Embedding', '#webassemblycompilestreaming', 'compileStreaming()')}}</td> + <td>{{Spec2('WebAssembly Embedding')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browserkompatibilität</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.compileStreaming")}}</p> +</div> + +<h2 id="Siehe_auch">Siehe auch</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> Übersichtsseite</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/de/web/javascript/reference/global_objects/webassembly/index.html b/files/de/web/javascript/reference/global_objects/webassembly/index.html new file mode 100644 index 0000000000..4681f473fd --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/webassembly/index.html @@ -0,0 +1,111 @@ +--- +title: WebAssembly +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly +tags: + - API + - JavaScript + - Objekt + - Referenz + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly +--- +<div>{{JSRef}}</div> + +<p>Das <strong><code>WebAssembly</code></strong> JavaScript Objekt existiert als Namensraum für alle <a href="/en-US/docs/WebAssembly">WebAssembly</a>-bezogenen Funktionalitäten.</p> + +<p>Anders als die meisten anderen globalen Objekte, ist <code>WebAssembly</code> kein Konstruktor (es ist kein Funktionsobjekt). Es kann mit {{jsxref("Math")}} verglichen werden, welches ebenfalls einen Namensraum für mathematische Konstanten und Funktionen bildet. Oder mit {{jsxref("Intl")}}, welches den Namensraum für die Internationalisierunges API mit sprachabhängigen Funktionen bildet. </p> + +<h2 id="Beschreibung">Beschreibung</h2> + +<p>Die primäre Verwendung des <code>WebAssembly</code> Objekts sind:</p> + +<ul> + <li>Laden von WebAssembly Code, verwenden der {{jsxref("WebAssembly.instantiate()")}} Funktion.</li> + <li>Neue Speicher- und Tabelleninstanzen mittels der {{jsxref("WebAssembly.Memory()")}}/{{jsxref("WebAssembly.Table()")}} Konstruktoren.</li> + <li>Bereitstellen von Einrichtungen zur Fehlerbehandlung, die in WebAssembly auftreten, mittels der {{jsxref("WebAssembly.CompileError()")}}/{{jsxref("WebAssembly.LinkError()")}}/{{jsxref("WebAssembly.RuntimeError()")}} Konstruktoren.</li> +</ul> + +<h2 id="Methoden">Methoden</h2> + +<dl> + <dt>{{jsxref("WebAssembly.instantiate()")}}</dt> + <dd>Die primäre API für das Kompilieren und Instanziieren des WebAssembly Codes. Der Rückgabewert als <code>Promise</code> ergibt ein <code>Module</code> als auch die erste <code>Instance</code>.</dd> + <dt>{{jsxref("WebAssembly.instantiateStreaming()")}}</dt> + <dd>Kompiliert und instanziiert ein WebAssembly-Modul direkt aus einer Streamingquelle, mit dem Rückgabewert als <code>Promise</code> ergibt sich ein <code>Module</code> als auch die erste <code>Instance</code>.</dd> + <dt>{{jsxref("WebAssembly.compile()")}}</dt> + <dd>Kompiliert ein {{jsxref("WebAssembly.Module")}} aus dem WebAssembly Binärcode, wodurch die Instanziierung als separater Schritt durchgeführt werden kann.</dd> + <dt>{{jsxref("WebAssembly.compileStreaming()")}}</dt> + <dd>Kompiliert ein {{jsxref("WebAssembly.Module")}} direkt aus einer Streamingquelle, wodurch die Instanziierung als separater Schritt durchgeführt werden kann.</dd> + <dt>{{jsxref("WebAssembly.validate()")}}</dt> + <dd>Validiert das gegebene, typisierte Array eines WebAssembly Binärcodes. Gibt zurück, ob die Bytes validen WebAssembly Code darstellen (<code>true</code>) oder nicht (<code>false</code>).</dd> +</dl> + +<h2 id="Konstruktoren">Konstruktoren</h2> + +<dl> + <dt>{{jsxref("WebAssembly.Global()")}}</dt> + <dd>Erzeugt ein neues WebAssembly <code>Global</code> Objekt.</dd> + <dt>{{jsxref("WebAssembly.Module()")}}</dt> + <dd>Erzeugt ein neues WebAssembly <code>Module</code> Objekt.</dd> + <dt>{{jsxref("WebAssembly.Instance()")}}</dt> + <dd>Erzeugt ein neues WebAssembly <code>Instance</code> Objekt.</dd> + <dt>{{jsxref("WebAssembly.Memory()")}}</dt> + <dd>Erzeugt ein neues WebAssembly <code>Memory</code> Objekt.</dd> + <dt>{{jsxref("WebAssembly.Table()")}}</dt> + <dd>Erzeugt ein neues WebAssembly <code>Table</code> Objekt.</dd> + <dt>{{jsxref("WebAssembly.CompileError()")}}</dt> + <dd>Erzeugt ein neues WebAssembly <code>CompileError</code> Objekt.</dd> + <dt>{{jsxref("WebAssembly.LinkError()")}}</dt> + <dd>Erzeugt ein neues WebAssembly <code>LinkError</code> Objekt.</dd> + <dt>{{jsxref("WebAssembly.RuntimeError()")}}</dt> + <dd>Erzeugt ein neues WebAssembly <code>RuntimeError</code> Objekt.</dd> +</dl> + +<h2 id="Beispiele">Beispiele</h2> + +<p>Das folgende Beispiel (siehe <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/instantiate-streaming.html">instantiate-streaming.html</a> Demo auf GitHub, <a href="https://mdn.github.io/webassembly-examples/js-api-examples/instantiate-streaming.html">siehe auch live</a>) streamt ein .wasm Modul direkt aus einer zugrunde liegenden Quelle, um es dann zu kompilieren und zu instanziieren. Das Promise erfüllt sich mit einem <code>ResultObject</code>. Weil die <code>instantiateStreaming()</code> Funktion ein Promise für ein {{domxref("Response")}} akzeptiert, kann ihr ein {{domxref("WindowOrWorkerGlobalScope.fetch()")}} direkt übergeben werden, welches die Antwort an die Funktion weitergibt, sobald das Promise sich erfüllt.</p> + +<pre class="brush: js">var importObject = { imports: { imported_func: arg => console.log(arg) } }; + +WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject) +.then(obj => obj.instance.exports.exported_func()); +</pre> + +<p>Auf die <code>ResultObject</code> Instanz wird damit zugegriffen und die beinhaltete, exportierte Funktion aufgerufen.</p> + +<h2 id="Spezifikationen">Spezifikationen</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', '#the-webassembly-object', 'WebAssembly')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browserkompatibilität</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly")}}</p> +</div> + +<h2 id="Siehe_auch">Siehe auch</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> Übersicht</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> + +<section id="Quick_Links"> </section> |