Ce sunt lucrătorii web?
Acest articol se referă la folosirea lucrătorilor web și la importanța acestora în motorul de script HTML5.Java construit cu un singur fir și nu există un proces concomitent în spatele lor (Niciun alt proces nu este executat până când primul proces este terminat). Deoarece javascript rulează în prim-plan și face ca pagina web să dureze mult timp. Prin urmare, pentru a evita această problemă grea, HTML5 a venit cu o nouă tehnologie numită lucrători Web. Este un script de fundal mic, care face calcul la sarcini scumpe, fără a interveni în interfața de utilizator sau performanța paginii web. Acest fir izolat este relativ ușor și este acceptat în toate browserele web. Acest lucru face ca HTML să pornească thread-uri suplimentare.
Tipuri de lucrători web în HTML5
Lucrătorii web sunt, de asemenea, denumiți „lucrători dedicați”. Au primit un model separat de memorie partajată. Cu alte cuvinte, putem spune că un întreg domeniu javascript s-a întâmplat să fie rulat pe un singur fir. În timp ce lucram într-un browser web, am întâlnit un mesaj de dialog al pistei din cauza procesării grele a paginii. Pentru a oferi o soluție bună, API-ul HTML browser-ului Web a creat calcule diferite, în același timp.
Mai jos sunt prezentate trei tipuri importante de lucrători:
1. Lucrător Web partajat
Acest tip folosește API și fiecare unitate de lucrător are mai multe conexiuni în timp ce trimite un mesaj (mai multe scripturi) cu condiția ca fiecare context să fie de la aceeași origine. Asistența browserului pentru acest lucrător este limitată. Acestea sunt numite folosind constructorul de lucru () muncitor ().
2. Lucrător web dedicat
Crearea unui fișier este foarte simplă doar apelând un constructor cu calea sursă. Ei folosesc metoda de comunicare a mesajelor numită post message () în timpul transferului de mesaje. Chiar și gestionatorii de evenimente sunt folosiți când are loc un ascultător. Handler onmessage () este folosit pentru a primi un mesaj.
3. lucrător de servicii
Acest lucrător nu interacționează direct cu pagina web și rulează în fundal. Se pot restabili ori de câte ori este necesar și pot acționa ca un proxy, pot fi accesate de mai multe fire.
Cum se creează un fișier pentru lucrătorii web?
Nu au suport pentru unele caracteristici, cum ar fi obiectul de fereastră, DOM, obiectul părinte. Toate funcțiile sunt realizate prin trecerea unei replici a acestora.
Pasul 1: Pentru a crea un constructor importator de fișiere Worker () Un fișier este creat folosind un obiect nou, iar scriptul arată.
var worker = new Worker(sample.js);
Pasul 2: Crearea mesajului post (). Fișierele de lucru create apelează automat metoda mesajului (). Metodele de postare () direcționează mesajul care trece către firul principal. Și în mod similar, putem trimite un mesaj de la firul principal la firul lucrătorului. De aici muncitorul începe.
worker. postMessage();
Pasul 3: Următor pentru a arunca gestionatorul de evenimente, pentru a permite mesajul de la lucrătorul web.
worker. onmessage = function(event)
De acum am văzut cum să trimitem și să primim mesaje, Acum să vedem cum să terminăm lucrătorul în mijlocul procesului.
Pasul 4: Pentru a opri procesul.
worker.terminate()
Pasul 5: Pentru a implementa un scenariu de gestionare a erorilor, utilizatorul îl folosește.
Worker.onerror();
Top 9 caracteristici ale HTML5 Web Workers
- Lucrătorii web fiind protocoale asincrone, aceștia erau cei mai potriviți pentru efectuarea sarcinilor de calcul și erau considerate a fi caracteristicile profesionale ale Javascript.
- Lucrătorii web plătesc o platformă de execuție strictă pentru ferestrele mobile și desktop, permițând să ruleze pagina web fără a îngheța pagina web în browsere.
- Avantajul principal este că putem rula procese costisitoare într-un singur fir individual care nu întrerupe thread-ul principal care rulează.
- Lucrătorii web sunt mici fire ușoare care trăiesc în mod individual, care intercalează interfața utilizatorului.
- Lucrătorii web care sunt fire orientate pentru kernel ajută la atingerea performanțelor înalte ale paginii browsere.
- Lucrătorii web ajută la crearea programării paralele și efectuează acțiuni multithreading.
- Lucrătorii web îmbunătățesc viteza pentru aplicația JScript Java.
- Web-lucrătorul este considerat a fi un script de partea clientului și utilizat mai sus în aplicația de jocuri.
- Firele de lucrători web comunică între ele folosind metoda de apelare înapoi a mesajului ().
Exemple de HTML5 Web Workers
Lucrătorii web au acces la navigator, Cerere XMLHTTP, Navigator datorită activităților lor de procesare multiplă. Exemplul de mai jos se concentrează pe tipuri de lucrători dedicați de demonstrat.
Exemplul # 1
Arată fișierul Sample Worker care demonstrează funcționarea browserului.
Cod:
Web Worker Demo
Validating the browser compatibility of Web Browsers
Submit
function worker_demo()
(
if(typeof(Worker)!=="undefined")(
document.getElementById("yes").innerHTML=" Browser Supports";
)
else
(
document.getElementById("NO").innerHTML="Browser Not Supporting the workers";)
)
Web Worker Demo
Validating the browser compatibility of Web Browsers
Submit
function worker_demo()
(
if(typeof(Worker)!=="undefined")(
document.getElementById("yes").innerHTML=" Browser Supports";
)
else
(
document.getElementById("NO").innerHTML="Browser Not Supporting the workers";)
)
Web Worker Demo
Validating the browser compatibility of Web Browsers
Submit
function worker_demo()
(
if(typeof(Worker)!=="undefined")(
document.getElementById("yes").innerHTML=" Browser Supports";
)
else
(
document.getElementById("NO").innerHTML="Browser Not Supporting the workers";)
)
Web Worker Demo
Validating the browser compatibility of Web Browsers
Submit
function worker_demo()
(
if(typeof(Worker)!=="undefined")(
document.getElementById("yes").innerHTML=" Browser Supports";
)
else
(
document.getElementById("NO").innerHTML="Browser Not Supporting the workers";)
)
ieşire:
Exemplul # 2
Următorul exemplu arată modul în care sarcinile lucrătorului se execută în spatele sarcinii folosind clasa și numărarea se face pentru sarcinile lucrătorului. Sarcinile lucrătorului actualizează automat pagina web pe fiecare buclă până când se încheie bucla. Pentru a încheia execuția lucrătorului, terminarea () a fost utilizată aici.
Locul de muncă depus de fundal de către lucrătorul web:
Cod:
wrk.html
Web Workers Demo
body (padding-top:18px;)
.output-cont (margin-left:12%; margin-top:28px;)
.output-cont h2 (width:150px; height:95%;)
.output-cont button (padding:3px 7px; font-size:1.3rem; font-family:sans-serif; )
start worker terminate
start blocking thread
test responsiveness
var worker;
function testWork() (
if (typeof(Worker) !== "undefined") (
if (typeof(worker) == "undefined") (
worker = new Worker("demo.js");
)
worker.onmessage = function(event) (
document.getElementById("wOutput").innerHTML = event.data;
);
) else (
document.getElementById("wOutput").innerHTML = "Web Workers are unsupported";
)
)
function stopWorker() (
worker.terminate();
worker = undefined;
)
function test() (
for (var j = 0; j < 20000; j++) (
document.getElementById("mainThreadOutput").innerHTML = "Main Thread Counter: " + j;
)
)
Next creating an separate external javascript file demo.js and the code comes as shown.
demo.js
j = 0;
while (j < 200000)
( postMessage("Web Worker Counter: " + j);
j++;
)
Web Workers Demo
body (padding-top:18px;)
.output-cont (margin-left:12%; margin-top:28px;)
.output-cont h2 (width:150px; height:95%;)
.output-cont button (padding:3px 7px; font-size:1.3rem; font-family:sans-serif; )
start worker terminate
start blocking thread
test responsiveness
var worker;
function testWork() (
if (typeof(Worker) !== "undefined") (
if (typeof(worker) == "undefined") (
worker = new Worker("demo.js");
)
worker.onmessage = function(event) (
document.getElementById("wOutput").innerHTML = event.data;
);
) else (
document.getElementById("wOutput").innerHTML = "Web Workers are unsupported";
)
)
function stopWorker() (
worker.terminate();
worker = undefined;
)
function test() (
for (var j = 0; j < 20000; j++) (
document.getElementById("mainThreadOutput").innerHTML = "Main Thread Counter: " + j;
)
)
Next creating an separate external javascript file demo.js and the code comes as shown.
demo.js
j = 0;
while (j < 200000)
( postMessage("Web Worker Counter: " + j);
j++;
)
Web Workers Demo
body (padding-top:18px;)
.output-cont (margin-left:12%; margin-top:28px;)
.output-cont h2 (width:150px; height:95%;)
.output-cont button (padding:3px 7px; font-size:1.3rem; font-family:sans-serif; )
start worker terminate
start blocking thread
test responsiveness
var worker;
function testWork() (
if (typeof(Worker) !== "undefined") (
if (typeof(worker) == "undefined") (
worker = new Worker("demo.js");
)
worker.onmessage = function(event) (
document.getElementById("wOutput").innerHTML = event.data;
);
) else (
document.getElementById("wOutput").innerHTML = "Web Workers are unsupported";
)
)
function stopWorker() (
worker.terminate();
worker = undefined;
)
function test() (
for (var j = 0; j < 20000; j++) (
document.getElementById("mainThreadOutput").innerHTML = "Main Thread Counter: " + j;
)
)
Next creating an separate external javascript file demo.js and the code comes as shown.
demo.js
j = 0;
while (j < 200000)
( postMessage("Web Worker Counter: " + j);
j++;
)
ieşire:
Concluzie
Până la sfârșit, am văzut cum lucrătorii web funcționează independent de firul principal care ajută organizațiile web să creeze aplicații solicitante. Și este recomandat să folosiți lucrătorii web în javascript pentru sarcini grele. Se sugerează că atunci când browserul web nu mai este în uz ar trebui să fie închis pentru a consuma resursele sistemului.
Articol recomandat
Acesta este un ghid pentru HTML5 Web Workers. Aici discutăm cele mai bune 9 caracteristici ale HTML5 Web Workers și exemplele sale cu Implementarea Codului. De asemenea, puteți parcurge articolele noastre sugerate pentru a afla mai multe -
- Html5 Elemente noi | Top 10
- Rame HTML cu sintaxă
- Introducere în avantajele HTML
- Top 10 întrebări și răspunsuri la interviu HTML5