diff options
Diffstat (limited to 'files/uk/web/api/web_workers_api/index.html')
| -rw-r--r-- | files/uk/web/api/web_workers_api/index.html | 215 |
1 files changed, 215 insertions, 0 deletions
diff --git a/files/uk/web/api/web_workers_api/index.html b/files/uk/web/api/web_workers_api/index.html new file mode 100644 index 0000000000..a22a63cd93 --- /dev/null +++ b/files/uk/web/api/web_workers_api/index.html @@ -0,0 +1,215 @@ +--- +title: Web Workers API +slug: Web/API/Web_Workers_API +translation_of: Web/API/Web_Workers_API +--- +<p>{{DefaultAPISidebar("Web Workers API")}}</p> + +<p class="summary"><strong>Web Workers</strong> це механізм, який дозволяє запускати скрипові операції у фоновому потоці, окремо від основного діючого потоку web-додатку. Перевага цього методу в тому, що трудоміські процеси можуть виконуватися в окромому потоці, дозволяючи основному (зазвичай UI) потоку працювати без блокування/сповільнення.</p> + +<h2 id="Концепція_та_використання_Web_Workers">Концепція та використання Web Workers</h2> + +<p>Worker це об'єкт, який створюється з використанням конструктору (e.g. {{domxref("Worker.Worker", "Worker()")}}), який запускає вказаний JavaScript-файл — файл, який містить код, що буде запущений у робочому потоці; workers запускаються у іншому глобальному контексті, який не є поточним {{domxref("window")}}. Цей контекст представляюється об'єктом {{domxref("DedicatedWorkerGlobalScope")}} у разі виділеного workers (стандартний workers, <span class="short_text" id="result_box" lang="uk"><span>які</span> <span>використовуються</span> <span>одним </span><span>сценарієм</span><span>;</span></span> загальні workers використовують {{domxref("SharedWorkerGlobalScope")}}).</p> + +<p>У потоці workers можна запускати будь-який код з невеликкими винятками. Наприклад, не можна напряму маніпулювати DOM з worker або використовувати деякі стандартні методи та властивості об'єкту {{domxref("window")}}, але можна використовувати велику кількість речей, доступних <code>з window</code>, включаючи <a href="/en-US/docs/WebSockets">WebSockets</a>, та механізми зберігання даних, як <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a> та Firefox OS-only <a href="/en-US/docs/Web/API/Data_Store_API">Data Store API</a>. Дивіться <a href="/en-US/docs/Web/API/Worker/Functions_and_classes_available_to_workers">Функції та класи, доступні для workers</a> для більшої детальності.</p> + +<p>Дані передаються між workers та основним потоком за допомогою системи сповіщення — обидві сторони пересилають свої сповіщення, використовуючи методи<code> postMessage()</code>, та відповідаюсь через обробник подій <code>onmessage</code> (повідомлення містится всепредині атрибутів даних {{event("Message")}} ). Дані копіюються, а не поширюються.</p> + +<p>Workers можуть в свою чергу породжувати нові workers, за умови, що ці workers будуть розміщуватися в межах однієї й тієї ж самої сорінки, що й батьківський worker. На додаток, workers можуть використовувати <a class="internal" href="/en-US/docs/Web/API/XMLHttpRequest"><code>XMLHttpRequest</code></a> для мережевого В/В, за винятком того, що <code>responseXML</code> <code>та channel</code> атрибути <code>XMLHttpRequest</code> завжди <code>повертають null</code>.</p> + +<p>Окрім виділених workers, є й інши типи:</p> + +<ul> + <li>Загальні workers - можуть бути використані декількома сценаріями, запускаючись в різних вікнах, IFrames, тощо, якщо вони у одному домені з worker. Вони трохи складніші, ніж виділені workers — скрипти мають спілкуватися через активний порт. Дивіться {{domxref("SharedWorker")}} для більшї детальності.</li> + <li><a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorkers</a> по суті виступають в якості проксі-серверу, знаходячись між web-додатком, браузером й мережею (коли доступна). Вони призначені для того (зокрема іншого), щоб давати змогу створювати ефективний offline-функціонал, перехоплення мережевих запитів та прийняття відповідних заходів, основуючись на тому, чи доступна мережа, та поновювати данні більш переважними з серверу. Вони також дозволяють доступ для додавання сповіщень та фонових синхроних APIs.</li> + <li>Chrome Workers є Firefox-only типом worker, що можна використовуати, якщо розроблюється доповнення та бажано використовувати workers й мати доступ до <a href="https://developer.mozilla.org/en/js-ctypes">js-ctypes</a> у worker. Дивіться {{domxref("ChromeWorker")}} для більшої детальності. </li> + <li><a href="/en-US/docs/Web/API/Web_Audio_API#Audio_Workers">Audio Workers</a> забезпечуюсть можливість направляти сценарії обробки звуку відбуватися у контексті web worker.</li> +</ul> + +<div class="note"> +<p><strong>Примітка</strong>: Згіздно з <a href="https://html.spec.whatwg.org/multipage/workers.html#runtime-script-errors-2">Web workers Spec</a>, події помилок worker не повинні вспливати (дивіться {{bug(1188141)}}. Це було реалізовано у Firefox 42.</p> +</div> + +<h2 id="Інтерфейси_Web_Worker">Інтерфейси Web Worker</h2> + +<dl> + <dt>{{domxref("AbstractWorker")}}</dt> + <dd>Абстрактні властивості та методи, загальні для всіх видів workers ({{domxref("Worker")}} або {{domxref("SharedWorker")}}).</dd> + <dt>{{domxref("Worker")}}</dt> + <dd>Представляє собою діючий поток worker, дозволяючи передавати сповіщення запущеному коду worker.</dd> + <dt>{{domxref("SharedWorker")}}</dt> + <dd>Представляє собою специфічний вид worker, який може бути <em>доступний</em> з декількох контекстів браузерів, будучи декількома вікнами, iframes або іншими workers.</dd> + <dt>{{domxref("WorkerGlobalScope")}}</dt> + <dd>Представляє собою загальний scope будь-якого worker (виконуючи ту ж роботу, що й {{domxref("Window")}} для звичайного контенту web). Різні види worker мають об'єкт scope, який наслідується з цього інерфейсу та додає більше специфічних особливостей.</dd> + <dt>{{domxref("DedicatedWorkerGlobalScope")}}</dt> + <dd>Представляє собою scope виділеного worker, наслудуючись з {{domxref("WorkerGlobalScope")}} та додаючи деякі особливості.</dd> + <dt>{{domxref("SharedWorkerGlobalScope")}}</dt> + <dd>Представляє собою scope загального worker, наслідуючись з {{domxref("WorkerGlobalScope")}} та додаючи деякі особливості.</dd> + <dt>{{domxref("WorkerNavigator")}}</dt> + <dd>Представляє собою ідентифікатор та стан користувача (клієнта):</dd> +</dl> + +<h2 id="Приклади">Приклади</h2> + +<p>Ми створили декілька простих прикладів, щоб показати основне вікористання:</p> + +<ul> + <li><a href="https://github.com/mdn/simple-web-worker">Основні приклади виділеного worker </a>(<a href="http://mdn.github.io/simple-web-worker/">запуск виділеного worker</a>).</li> + <li><a href="https://github.com/mdn/simple-shared-worker">Основні приклади загалного worker </a>(<a href="http://mdn.github.io/simple-shared-worker/">запуск загального worker</a>).</li> +</ul> + +<p>Ви можете знайти більше інформації як працюють ці демо у <a href="/en-US/docs/Web/API/Web_Workers_API/Using_web_workers">Використання web workers</a>.</p> + +<h2 id="Специфікация">Специфікация</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', '#toc-workers')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>No change from {{SpecName("Web Workers")}}.</td> + </tr> + <tr> + <td>{{SpecName('Web Workers')}}</td> + <td>{{Spec2('Web Workers')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Сумісність_з_браузерами">Сумісність з браузерами</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>4</td> + <td>{{CompatGeckoDesktop(1.9.1)}}</td> + <td>10.0</td> + <td>10.6</td> + <td>4</td> + </tr> + <tr> + <td>Shared workers</td> + <td>4</td> + <td>{{CompatGeckoDesktop(29)}}</td> + <td>{{CompatNo}}</td> + <td>10.6</td> + <td>4</td> + </tr> + <tr> + <td>Passing data using structured cloning</td> + <td>13</td> + <td>{{CompatGeckoDesktop(8)}}</td> + <td>10.0</td> + <td>11.5</td> + <td>6</td> + </tr> + <tr> + <td>Passing data using transferable objects</td> + <td>17 {{property_prefix("webkit")}}<br> + 21</td> + <td>{{CompatGeckoDesktop(18)}}</td> + <td>{{CompatNo}}</td> + <td>15</td> + <td>6</td> + </tr> + <tr> + <td>Global {{domxref("window.URL", "URL")}}</td> + <td>10<sup>[1]</sup><br> + 23</td> + <td>{{CompatGeckoDesktop(21)}}</td> + <td>11</td> + <td>15</td> + <td>6<sup>[1]</sup></td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>Firefox OS (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>4.4</td> + <td>4</td> + <td>{{CompatGeckoMobile(1.9.1)}}</td> + <td>1.0.1</td> + <td>10.0</td> + <td>11.5</td> + <td>5.1</td> + </tr> + <tr> + <td>Shared workers</td> + <td>{{CompatNo}}</td> + <td>4</td> + <td>29</td> + <td>1.4</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td>Passing data using structured cloning</td> + <td>{{CompatNo}}</td> + <td>4</td> + <td>8</td> + <td>1.0.1</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td>Passing data using transferable objects</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>18</td> + <td>1.0.1</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] As <code>webkitURL</code>.</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Web_Workers_API/basic_usage">Using Web Workers</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Worker">Worker Interface</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/SharedWorker">SharedWorker interface</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li> + <li><a href="/en-US/docs/Web/API/Worker/Functions_and_classes_available_to_workers">Functions and classes available to workers</a></li> + <li><a href="/en-US/docs/Web/API/Web_Workers_API/Advanced_concepts_and_examples">Advanced concepts and examples</a></li> + <li><a href="/en-US/docs/Web/API/ChromeWorker">ChromeWorker</a>: for using workers in privileged/chrome code</li> +</ul> |