Web worker
Unweb worker,come definito dalWorld Wide Web Consortium(W3C) e dalWeb Hypertext Application Technology Working Group(WHATWG), è unoscript JavaScriptche viene eseguito inbackgroundin una paginaHTMLindipendentemente dagli script dell'interfaccia utente.[1]I Web worker sono spesso in grado di utilizzare leCPU multi-corein modo più efficiente.[2]
Il W3C e WHATWG considerano i web worker come script a esecuzione prolungata che non vengono interrotti dagli script dell'interfaccia utente (che rispondono ai clic o ad altre interazioni dell'utente). Il fatto di impedire a tali worker di essere interrotti dalle attività utente dovrebbe consentire alle pagine Web di rimanere reattive mentre eseguono attività lunghe in background.
Il W3C e il WHATWG sono attualmente nel processo di sviluppo della definizione diAPIper i web worker.[1]
Panoramica
[modifica|modifica wikitesto]Come concepiti da WHATWG, i web worker sono relativamente pesanti. Sono intesi per essere longevi, con un costo elevato in termini di prestazioni di avvio e un costo elevato di memoria per istanza.[1]Di conseguenza non dovrebbero essere utilizzati in grandi quantità, in quanto potrebbero monopolizzare le risorse di sistema.
I web worker consentono l'esecuzione deithreaddel browser inconcorrenzaa uno o più thread JavaScript in esecuzione in background. Normalmente il browser, che segue un singolo thread di esecuzione, deve attendere il completamento dell'esecuzione dei programmi JavaScript prima di procedere e ciò potrebbe richiedere del tempo significativo che il programmatore potrebbe voler nascondere all'utente. I web worker permettono al browser di continuare con le normali operazioni durante l'esecuzione in background dello script.
La specifica web worker è separata dalla specifica HTML5[3]e può essere utilizzata con HTML5.
Esistono due tipi di web worker:[1]dedicati e condivisi.
Quando i web worker sono eseguiti in background non hanno accesso diretto al DOM ma comunicano con il documento tramitescambio di messaggi.Ciò consente l'esecuzione multi-thread dei programmi JavaScript.
Caratteristiche
[modifica|modifica wikitesto]I Web worker interagiscono con il documento principale tramite il passaggio di messaggi. Il codice seguente crea un worker che eseguirà il codice JavaScript nel file specificato.
varworker=newWorker("worker_script.js");
Per inviare un messaggio al worker si usa il metodopostMessagedell'oggetto worker, come mostrato nell'esempio successivo.
worker.postMessage("Hello World!");
La proprietàonmessageusa un event handler per recuperare informazioni da un worker.
worker.onmessage=function(event){
alert("Received message"+event.data);
doSomething();
}
functiondoSomething(){
//do work
worker.postMessage("Work done!");
}
worker.terminate();
Una volta che un worker è terminato diventa fuori portata e la variabile che fa riferimento diventa undefined; a questo punto è necessario creare un nuovo worker, se necessario.
Esempio
[modifica|modifica wikitesto]L'uso più semplice dei web worker è eseguire task computazionalmente costosi senza interrompere l'interfaccia utente.
In questo esempio, il documento principale crea un web worker per computare numeri primi e li mostra progressivamente l'ultimo numero primo trovato.
La pagina principale come segue:
<!DOCTYPE html>
<html>
<head>
<title>Worker example: One-core computation</title>
</head>
<body>
<p>il più grande numero primo calcolato fin ora è:<outputid="result"></output></p>
<script>
varworker=newWorker('worker.js');
worker.onmessage=function(event){
document.getElementById('result').textContent=event.data;
};
</script>
</body>
</html>
La chiamata al costruttoreWorker()crea un web worker e ritorna un oggettoworker,il quale è usato per comunicare con il web worker. L'event handleronmessagedell'oggetto permette al codice di ricevere messaggi dal web worker.
Il codice del Web worker, contenuto nel fileworker.js,è il seguente:
varn=1;
varend_value=10**7;
search:while(n<=end_value){
n++;
for(vari=2;i<=Math.sqrt(n);i++)
if(n%i==0)
continuesearch;
// trovato un numero primo!
postMessage(n);
}
Per mandare un messaggio alla pagina quando un nuovo numero primo è stato trovato si utilizza il metodopostMessage().
Supporto
[modifica|modifica wikitesto]Il supporto dei browser per i web worker può essere controllato attraverso la proprietà Worker sull'oggetto globale window,[4]la quale sarà undefined se il browser non li supporta.
Il seguente codice di esempio controlla il supporto dei web worker su un browser:
functionbrowserSupportsWebWorkers(){
returntypeofwindow.Worker==="function";
}
I web worker sono attualmente supportati daChrome,Opera,Internet Explorer(versione 10),Mozilla FirefoxeSafari.[3][5]Mobile Safari per iOS supporta i web worker daiOS5. Il browserAndroidha iniziato a supportarli in Android 2.1, ma il supporto è stato rimosso nelle versioni Android 2.2-4.3 prima di essere ripristinato in Android 4.4.[6][7]
Note
[modifica|modifica wikitesto]- ^abcdWeb Workers,WHATWG.URL consultato il 3 giugno 2010.
- ^HTML Living Standard,suHtml.spec.whatwg.org,30 gennaio 2017.URL consultato il 31 gennaio 2017.
- ^ab"Introducing HTML5", Lawson, B. and Sharp, R., 2011.
- ^"HTML5 Up and Running" Mark Pilgrim. O'Reilly/Google Press. August 2010
- ^"HTML5 and CSS3" Brian P. Hogan. The Pragmatic Programmers, LLC 2010.
- ^Archived copy,suisogenicengine.com.URL consultato il 10 luglio 2011(archiviato dall'url originaleil 19 ottobre 2013).
- ^Can I use... Support tables for HTML5, CSS3, etc,sucaniuse.com.URL consultato il 10 giugno 2017.
Collegamenti esterni
[modifica|modifica wikitesto]- Web Workers – W3CArchiviatoil 7 giugno 2015 inInternet Archive.
- Web Workers – WHATWG
- Using Web WorkersArchiviatoil 7 maggio 2012 inInternet Archive.– Mozilla Developer Network
