Sissejuhatus veebitöötajate JavaScript API-sse

Veebitöötajad on JavaScript API, mis võimaldab teil käivitage skriptid peamisest eraldi lõngast. See võib osutuda kasulikuks, kui te ei soovi põhiskriptide teostamisel mingeid takistusi taustaprogrammide tõttu.

Veebitöötajate API on toetatud peaaegu kõigis brauserites, Täpsema teabe saamiseks vaadake CanIUse'i dokumente. Enne koodi sattumist näeme paar stsenaariumi, kus võiksite seda API-d kasutada, et saaksite ettekujutuse sellest, mida ma mõtlen taustapõhised skriptid.

Kasutage juhtumeid

Oletame, et seal on skript tõmbab ja töötleb faili. Kui fail on oluliselt suur see võtab kaua aega tööd! Mis võib takistada teisi skripte, mida hiljem hukati.

Kui aga failitöötlus viiakse taustalõngale, tuntud kui töötaja niit, teisi sündmusi ei blokeerita enne, kui esimene on lõppenud.

Skript teostatakse töötaja taustal on tuntud kui töötaja skript või lihtsalt töötaja.

Teise näitena kujutage ette, et on suur vorm, mis on paigutatud sakkidesse. See on skriptitud viisil, mis uuendab juhtnuppe ühes vahekaardis mõjutab mõningaid kontrollkäike teistes.

Kui teiste kaartide värskendus võtab kasutaja aega ei saa aktiivset vahekaarti pidevalt kasutada ilma selle sündmuste pidamiseta. See võib kasutajaliidese külge külmutada kasutaja ärevust.

Kuna kasutaja ei näe teisi vahelehti praeguse täitmisel, saate seda teha värskendage taustalõnga teiste vahekaartide juhtelemente. Sel moel saab kasutaja jätkata praeguse vahekaardi kasutamist, mida ta täidab, ilma et mõni selle skripte blokeeriks teiste vahekaartide juhtimisseadmete värskendusprotsess.

Samuti, kui leiate stsenaariumi, kus skript on olemas võib kasutaja kasutajaliidese kasutamise blokeerida kuni selle teostamiseni võite kaaluda selle teisaldamist töötaja niidile, nii et seda saaks teostada taustal.

Töötajate ulatus ja liigid

Veebitöötajate API on tõenäoliselt üks lihtsamaid API-sid. Sellel on üsna lihtsad meetodid luua töötajate niidid ja suhelda nendega põhiskriptist.

Töötajate niidi ülemaailmne ulatus on peakeermest erinevas kontekstis. Sina ei pääse juurde meetoditele ja omadustele aken objekti nagu näiteks hoiatus () töötaja niidi sees. Sina samuti ei saa DOM-i vahetada töötaja lõngast.

Kuid sina saab kasutage palju API-sid, mis kuuluvad aken, näiteks Lubadus ja Tõmba, teie töötajate lõimes (vt täielikku nimekirja).

Sul võib olla ka sisestatud töötaja niidid: teisest töötaja niidist loodud lõime. Teise töötaja loodud töötaja on a alltöövõtja.

On ka palju tüübid töötajaid. Kaks peamist neist on pühendunud ja jagatud töötajad.

Pühendunud töötajad kuuluvad samasse sirvimise konteksti et nende peamine niit kuulub. Jagatud töötajad on aga esinevad erinevas sirvimise kontekstis (näiteks iframes) põhiskriptist. Mõlemal juhul peamine skript ja töötajad peavad olema samas domeenis.

Selles juhendis on näiteks pühendunud töötaja kohta, mis on kõige levinum tüüp.

API meetodid

Vaadake allolevat diagrammi a kohta kiire ülevaade kõigist peamistest meetoditest mis moodustavad veebitöötajate API.

The Töötaja () konstruktor loob spetsiaalse töötaja niidi ja tagastab oma võrdlusobjekti. Seejärel kasutame seda objekti konkreetse töötajaga suhtlemiseks.

The postMessage () meetodit kasutatakse nii põhi- kui ka töötajate skriptides saata üksteisele andmeid. Seejärel saadetakse saadetud andmed teiselt poolt onmessage sündmuste käitleja.

The lõpetage () meetod lõpetab põhiskripti töötaja niidi. See lõpetamine on kohe: mis tahes praegune skriptide täitmine ja pooleliolevad skriptid tühistatakse. The Sulge() meetod teeb sama, aga see on kutsus ennast sulgev töötaja niit.

Näide kood

Vaatame nüüd proovi koodi. The index.html lehel on põhiskript sees

Alustame töötaja lõime loomine põhiskriptist.

 w = uus töötaja ('worker.js'); 

 w = uus töötaja ('worker.js'); w.onmessage = (e) => console.log („Vastuvõetud töötajalt: $ e.data”);  

 document.querySelector ('nupp') onclick = () => w.postMessage ('john');  

 console.info („loodud töötaja”); onmessage = (e) => postMessage ('Hi $ e.data');