Skip to content

Commit

Permalink
Markdown conversion for ru - Cleanup - WebAssembly section (#8590)
Browse files Browse the repository at this point in the history 
Fix md conversion report
  • Loading branch information
@SphinxKnight
SphinxKnight authored Sep 19, 2022
1 parent c664795 commit 3c92f06
Show file tree
Hide file tree
Showing 6 changed files with 39 additions and 43 deletions.
2 changes: 1 addition & 1 deletion files/ru/webassembly/exported_functions/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ <h2 id="Пример">Пример</h2>

<p>Чтобы доказать это, мы получаем ссылки на функции из таблицы <code>otherTable</code> и вызываем их. При выводе в консоль они дают такие же результаты.</p>

<h2 id="Они_являются_настоящими_функциями"><font><font>Они являются настоящими функциями</font></font></h2>
<h2 id="Они_являются_настоящими_функциями">Они являются настоящими функциями</h2>

<p>В предыдущем примере возвращаемое значение каждого вызова <code><a href="/en-US/docs/WebAssembly/API/Table/get">Table.prototype.get()</a></code> является экспортированной функцией WebAssembly — это именно то, о чем мы говорили.</p>

Expand Down
2 changes: 1 addition & 1 deletion files/ru/webassembly/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ <h2 dir="ltr" id="Примеры">Примеры</h2>

<h2 id="Спецификация">Спецификация</h2>

<table class="table table-striped">
<table>
<thead>
<tr>
<th>Specification</th>
Expand Down
34 changes: 17 additions & 17 deletions files/ru/webassembly/loading_and_running/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,26 +15,26 @@

<h2 id="Какие_есть_варианты">Какие есть варианты?</h2>

<p><span class="tlid-translation translation" lang="ru"><span title="">WebAssembly ещё не интегрирована с </span></span> <code>&lt;script type='module'&gt;</code> <span class="tlid-translation translation" lang="ru"><span title="">или ES2015 </span><span class="alt-edited" title="">оператором</span></span> <code>import</code>, <span class="tlid-translation translation" lang="ru"><span title="">поэтому не существует пути, позволяющего использовать модули загрузки браузера для использования импорта.</span></span></p>
<p>WebAssembly ещё не интегрирована с <code>&lt;script type='module'&gt;</code> или ES2015 оператором <code>import</code>, поэтому не существует пути, позволяющего использовать модули загрузки браузера для использования импорта.</p>

<p><span class="tlid-translation translation" lang="ru"><span title="">Старые методы</span></span> {{jsxref("WebAssembly.compile")}}/{{jsxref("WebAssembly.instantiate")}} <span class="tlid-translation translation" lang="ru"><span title="">требуют создания </span></span>{{domxref("ArrayBuffer")}}, <span class="tlid-translation translation" lang="ru"><span title="">содержащего двоичный файл модуля WebAssembly после загрузки необработанных байтов, а затем скомпилировать/создать его экземпляр.</span></span> <span class="tlid-translation translation" lang="ru"><span title="">Это аналог</span></span> <code>new Function(string)</code>,<span class="tlid-translation translation" lang="ru"><span title=""> за исключением того, что мы заменяем строку символов (исходный код JavaScript) буфером байтов массива (исходный код WebAssembly).</span></span></p>
<p>Старые методы {{jsxref("WebAssembly.compile")}}/{{jsxref("WebAssembly.instantiate")}} требуют создания {{domxref("ArrayBuffer")}}, содержащего двоичный файл модуля WebAssembly после загрузки необработанных байтов, а затем скомпилировать/создать его экземпляр. Это аналог <code>new Function(string)</code>, за исключением того, что мы заменяем строку символов (исходный код JavaScript) буфером байтов массива (исходный код WebAssembly).</p>

<p><span class="tlid-translation translation" lang="ru"><span title="">Более новые методы </span></span>{{jsxref("WebAssembly.compileStreaming")}}/{{jsxref("WebAssembly.instantiateStreaming")}} <span class="tlid-translation translation" lang="ru"><span title="">намного эффективнее - они выполняют свои действия непосредственно с необработанным потоком байтов, поступающих из сети,</span> <span title="">избавление от необходимости шага </span></span>{{domxref("ArrayBuffer")}}.</p>
<p>Более новые методы {{jsxref("WebAssembly.compileStreaming")}}/{{jsxref("WebAssembly.instantiateStreaming")}} намного эффективнее - они выполняют свои действия непосредственно с необработанным потоком байтов, поступающих из сети, избавление от необходимости шага {{domxref("ArrayBuffer")}}.</p>

<p>Итак, как мы можем получить эти байты в буфер массива и скомпилировать? Следующие разделы объясняют.</p>

<h2 id="Используя_Fetch">Используя Fetch</h2>

<p><a href="/en-US/docs/Web/API/Fetch_API">Fetch</a><span class="tlid-translation translation" lang="ru"><span title=""> - это удобный современный API для извлечения сетевых ресурсов.</span></span></p>
<p><a href="/en-US/docs/Web/API/Fetch_API">Fetch</a> - это удобный современный API для извлечения сетевых ресурсов.</p>

<p><span class="tlid-translation translation" lang="ru"><span title="">Самый быстрый и эффективный способ получить модуль wasm - использовать более новый метод </span></span>{{jsxref("WebAssembly.instantiateStreaming()")}}, <span class="tlid-translation translation" lang="ru"><span title="">который может принять вызов </span></span><code>fetch()</code> <span class="tlid-translation translation" lang="ru"><span title="">в качестве первого аргумента и будет обрабатывать загрузку, компиляцию</span> <span title="">и создание экземпляра модуля за один шаг, получая доступ к необработанному байтовому коду при его потоковой передаче с сервера:</span></span></p>
<p>Самый быстрый и эффективный способ получить модуль wasm - использовать более новый метод {{jsxref("WebAssembly.instantiateStreaming()")}}, который может принять вызов <code>fetch()</code> в качестве первого аргумента и будет обрабатывать загрузку, компиляцию и создание экземпляра модуля за один шаг, получая доступ к необработанному байтовому коду при его потоковой передаче с сервера:</p>

<pre class="brush: js">WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject)
.then(results =&gt; {
// Do something with the results!
});</pre>

<p><span class="tlid-translation translation" lang="ru"><span title="">Если бы мы использовали более старый метод</span></span> {{jsxref("WebAssembly.instantiate()")}}, <span class="tlid-translation translation" lang="ru"><span title="">который не работает в прямом потоке, нам потребовался бы дополнительный шаг преобразования преобразованного байт-кода в </span></span>{{domxref("ArrayBuffer")}}, <span class="tlid-translation translation" lang="ru"><span title="">вот так:</span></span></p>
<p>Если бы мы использовали более старый метод {{jsxref("WebAssembly.instantiate()")}}, который не работает в прямом потоке, нам потребовался бы дополнительный шаг преобразования преобразованного байт-кода в {{domxref("ArrayBuffer")}}, вот так:</p>

<pre class="brush: js">fetch('module.wasm').then(response =&gt;
response.arrayBuffer()
Expand All @@ -46,26 +46,26 @@ <h2 id="Используя_Fetch">Используя Fetch</h2>

<p> </p>

<h3 id="Помимо_перегрузок_instantiate()"><span class="tlid-translation translation" lang="ru"><span title="">Помимо перегрузок instantiate()</span></span></h3>
<h3 id="Помимо_перегрузок_instantiate()">Помимо перегрузок instantiate()</h3>

<p><span class="tlid-translation translation" lang="ru"><span title="">Функция</span></span> {{jsxref("WebAssembly.instantiate()")}}<span class="tlid-translation translation" lang="ru"><span title=""> имеет две формы перегрузки - та, что показана выше, принимает байт-код для компиляции в качестве аргумента и возвращает </span></span><code>Promise</code><span class="tlid-translation translation" lang="ru"><span title="">, которое разрешается для объекта, содержащего оба объекта скомпилированного модуля,</span> <span title="">и экземпляр этого.</span> <span title="">Объект выглядит так:</span></span></p>
<p>Функция {{jsxref("WebAssembly.instantiate()")}} имеет две формы перегрузки - та, что показана выше, принимает байт-код для компиляции в качестве аргумента и возвращает <code>Promise</code>, которое разрешается для объекта, содержащего оба объекта скомпилированного модуля, и экземпляр этого. Объект выглядит так:</p>

<pre class="brush: js">{
module : Module // The newly compiled WebAssembly.Module object,
instance : Instance // A new WebAssembly.Instance of the module object
}</pre>

<div class="note">
<p><strong>Примечание</strong>: <span class="tlid-translation translation" lang="ru"><span title="">Обычно мы заботимся только об экземпляре, но полезно иметь модуль на тот случай, если мы хотим его кешировать, поделиться им с другим работником или окном через</span></span> <code><a href="/en-US/docs/Web/API/MessagePort/postMessage">postMessage()</a></code>, <span class="tlid-translation translation" lang="ru"><span title="">или просто создать больше экземпляров.</span></span></p>
<p><strong>Примечание</strong>: Обычно мы заботимся только об экземпляре, но полезно иметь модуль на тот случай, если мы хотим его кешировать, поделиться им с другим работником или окном через <code><a href="/en-US/docs/Web/API/MessagePort/postMessage">postMessage()</a></code>, или просто создать больше экземпляров.</p>
</div>

<div class="note">
<p><strong>Примечание</strong>: <span class="tlid-translation translation" lang="ru"><span title="">Вторая форма перегрузки принимает в качестве аргумента объект </span></span>{{jsxref("WebAssembly.Module")}} <span class="tlid-translation translation" lang="ru"><span title="">и возвращает </span></span><code>Promise</code><span class="tlid-translation translation" lang="ru"><span title="">, непосредственно содержащее объект экземпляра, в качестве результата.</span> <span title="">См. <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiate#Second_overload_example">Второй пример перегрузки</a>.</span></span></p>
<p><strong>Примечание</strong>: Вторая форма перегрузки принимает в качестве аргумента объект {{jsxref("WebAssembly.Module")}} и возвращает <code>Promise</code>, непосредственно содержащее объект экземпляра, в качестве результата. См. <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiate#Second_overload_example">Второй пример перегрузки</a>.</p>
</div>

<h3 id="Выполнение_вашего_кода_WebAssembly">Выполнение вашего кода WebAssembly</h3>

<p><span class="tlid-translation translation" lang="ru"><span title="">Когда у вас есть экземпляр WebAssembly, доступный в вашем JavaScript, вы можете начать использовать его возможности, которые были экспортированы через свойство </span></span>{{jsxref("WebAssembly.Instance/exports", "WebAssembly.Instance.exports")}}. <span class="tlid-translation translation" lang="ru"><span title="">Ваш код может выглядеть примерно так:</span></span></p>
<p>Когда у вас есть экземпляр WebAssembly, доступный в вашем JavaScript, вы можете начать использовать его возможности, которые были экспортированы через свойство {{jsxref("WebAssembly.Instance/exports", "WebAssembly.Instance.exports")}}. Ваш код может выглядеть примерно так:</p>

<pre class="brush: js">WebAssembly.instantiateStreaming(fetch('myModule.wasm'), importObject)
.then(obj =&gt; {
Expand All @@ -81,18 +81,18 @@ <h3 id="Выполнение_вашего_кода_WebAssembly">Выполнен
})</pre>

<div class="note">
<p><strong>Примечание</strong>: <span class="tlid-translation translation" lang="ru"><span title="">Для получения дополнительной информации о том, как работает экспорт из модуля WebAssembly, ознакомьтесь с разделами</span></span> <a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Использование JavaScript API WebAssembly</a>, и <a href="/en-US/docs/WebAssembly/Understanding_the_text_format">Понимание текстового формата WebAssembly</a>.</p>
<p><strong>Примечание</strong>: Для получения дополнительной информации о том, как работает экспорт из модуля WebAssembly, ознакомьтесь с разделами <a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Использование JavaScript API WebAssembly</a>, и <a href="/en-US/docs/WebAssembly/Understanding_the_text_format">Понимание текстового формата WebAssembly</a>.</p>
</div>

<h2 id="Используя_XMLHttpRequest">Используя XMLHttpRequest</h2>

<p><code><a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> <span class="tlid-translation translation" lang="ru"><span title="">несколько старше, чем</span></span> Fetch, <span class="tlid-translation translation" lang="ru"><span title="">но всё же может успешно использоваться для получения типизированного массива.</span> <span title="">Опять же, если предположить, что наш модуль называется </span></span><code>simple.wasm</code>:</p>
<p><code><a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> несколько старше, чем Fetch, но всё же может успешно использоваться для получения типизированного массива. Опять же, если предположить, что наш модуль называется <code>simple.wasm</code>:</p>

<ol>
<li><span class="tlid-translation translation" lang="ru"><span title="">Создайте новый экземпляр </span></span>{{domxref("XMLHttpRequest()")}} <span class="tlid-translation translation" lang="ru"><span title="">и используйте его метод </span></span>{{domxref("XMLHttpRequest.open","open()")}} <span class="tlid-translation translation" lang="ru"><span title="">для открытия запроса, задав для метода запроса значение </span></span> <code>GET</code> <span class="tlid-translation translation" lang="ru"><span title="">и указав путь к файлу, который мы хотим получить.</span></span></li>
<li><span class="tlid-translation translation" lang="ru"><span title="">Ключевой частью этого является установка типа ответа </span></span> <code>'arraybuffer'</code> <span class="tlid-translation translation" lang="ru"><span title="">с помощью свойства </span></span>{{domxref("XMLHttpRequest.responseType","responseType")}}.</li>
<li><span class="tlid-translation translation" lang="ru"><span title="">Затем отправьте запрос с помощью </span></span>{{domxref("XMLHttpRequest.send()")}}.</li>
<li><span class="tlid-translation translation" lang="ru"><span title="">Затем мы используем обработчик событий </span></span>{{domxref("XMLHttpRequest.onload", "onload")}} <span class="tlid-translation translation" lang="ru"><span title="">для вызова функции после завершения загрузки ответа - в этой функции мы получаем буфер массива из</span></span> {{domxref("XMLHttpRequest.response", "response")}} <span class="tlid-translation translation" lang="ru"><span title="">и затем передайте это в наш метод</span></span> {{jsxref("WebAssembly.instantiate()")}}, <span class="tlid-translation translation" lang="ru"><span title="">как мы это делали с Fetch.</span></span></li>
<li>Создайте новый экземпляр {{domxref("XMLHttpRequest()")}} и используйте его метод {{domxref("XMLHttpRequest.open","open()")}} для открытия запроса, задав для метода запроса значение <code>GET</code> и указав путь к файлу, который мы хотим получить.</li>
<li>Ключевой частью этого является установка типа ответа <code>'arraybuffer'</code> с помощью свойства {{domxref("XMLHttpRequest.responseType","responseType")}}.</li>
<li>Затем отправьте запрос с помощью {{domxref("XMLHttpRequest.send()")}}.</li>
<li>Затем мы используем обработчик событий {{domxref("XMLHttpRequest.onload", "onload")}} для вызова функции после завершения загрузки ответа - в этой функции мы получаем буфер массива из {{domxref("XMLHttpRequest.response", "response")}} и затем передайте это в наш метод {{jsxref("WebAssembly.instantiate()")}}, как мы это делали с Fetch.</li>
</ol>

<p>Финальный код выглядит так:</p>
Expand Down
Loading

0 comments on commit 3c92f06

Please sign in to comment.