1

Instituto Tecnológico de Parral

Aplicación Web Worker
Beatriz Ivonne Davila Garcia – 10410169
Paulina Montes Seañez - 10410165
2

Agenda:
Antes de los web worker.
Web worker.
Marco conceptual.
¿Cómo funciona?.
¿Cómo se clasifican?.
Worker dedicados.
Worker compartidos.
Características.
Métodos.
Utilidad y beneficios.
Ejemplos.
Conclusiones.
Actividad.
Bibliografía
3

Antes de los Web Workers
4

Web Workers
5

Marco conceptual:
• Los Web Workers son una aplicación para
ejecutar JavaScript en segundo plano de forma
independiente a la ejecución de la UI.
6

¿Cómo funciona?
7

¿Cómo se clasifican?
8

Web Workers Dedicados:
Estos están vinculados con el origen del
script que los creó. Por ejemplo si en
esta pagina se crea un worker
dedicado, solo los script incluidos en
esta pagina podrán acceder a ese
worker.
9

Web Worker compartidos:
A diferencia de el anterior podemos inicializar un
worker desde cualquier pagina ajena a la que
utilicen.
10

Características:
Ejecutan un subproceso independiente de la
interfaz de usuario.
Son útiles para la descarga de tareas complejas o
de larga ejecución.
La interfaz de comunicación Web Workers
también permite marco de errores
11

Para saber si la aplicación Web Workers es soportada por
el navegador se utiliza la siguiente función:
var webworkers_support = !!window.Worker;
O bien:
• if(typeof(Worker)!==”undefined”)
{
// Tu navegador soporta Web Worker
• // Codigo a ejecutar
}
else
{
//Tu navegador soporta no Web Worker
• }
12

 
 
 
 

• También están soportados en IE 10, Firefox
(desde la versión 3.6), Safari (desde la 4.0),
Chrome y Opera 11.
13

Si la aplicación web Workers no es soportada por
el navegador, en particular tendrá que acabar
con ejecutar su código con un hilo principal en
Java Script y trato con los retrasos que pueda
provocar.
14

Tiempos de espera e intervalos:
SetTimeOut
SetInterval
ClearTimeOut
ClearInterval
15

Gestión de errores
Message.-Un mensaje de error legible para el ojo
humano.
Filename.- El nombre del archivo de script en el
que se produjo el error.
Lineno.-El número de línea del archivo de script
en el que se produjo el error
worker.onerror = function (evt) {
alert(evt.data); }
16

Acceder al objeto navegador
appName
appVersion
platform
userAgent
17

Utilidad y beneficios:
Son útiles para la descarga de tareas complejas.
Puede generar otros trabajadores, también
eliminarlos y la instancia de los mismos.
Procesamiento de imágenes
Análisis de Texto
Accesos simultáneos a BD
Manipulación de grandes cantidades de datos
18

Cómo crear un web worker:
worker var = new Worker(‘ejemplo.js');
worker.postMessage("Información para el
worker");
worker.onmessage = function (evt) {
// evt.data es el valor devuelto por el Worker
alert(evt.data);
}
19

Terminar un worker:
myWorker.terminate();
Se pueden cerrar también con el método:
nsIWorkerScope.close().
20
21

Declaración del objeto

Archivo Script
22
23
24

• De manera general podemos decir que esta API es un
elemento indispensable en aplicaciones que requieran
un mayor consumo de recursos, además de brindar una
forma mas sencilla de trabajar a la par los archivos
script.
• Contratiempos. No se presentaron.
• Dificultad de la actividad - tiempo. No hubo dificultades
grandes durante la elaboración ni en el tiempo
proporcionado para la entrega del trabajo.
25

Actividad.- Web Workers
• Objetivo: Conocer el funcionamiento de los
trabajadores web, mediante el desarrollo de una
aplicación.
• Elaborar una página web que guarde su
“Nombre – No Control” en un archivo .js y
posteriormente se imprima mediante un archivo
html.
• Formato individual, archivo comprimido
26

Bibliografía

https://developer.mozilla.org/es/docs/Usar_web_w
http://noeliafranco.wordpress.com/2012/10/05/web

Web workers

  • 1.
    1 Instituto Tecnológico deParral Aplicación Web Worker Beatriz Ivonne Davila Garcia – 10410169 Paulina Montes Seañez - 10410165
  • 2.
    2 Agenda: Antes de losweb worker. Web worker. Marco conceptual. ¿Cómo funciona?. ¿Cómo se clasifican?. Worker dedicados. Worker compartidos. Características. Métodos. Utilidad y beneficios. Ejemplos. Conclusiones. Actividad. Bibliografía
  • 3.
    3 Antes de losWeb Workers
  • 4.
  • 5.
    5 Marco conceptual: • LosWeb Workers son una aplicación para ejecutar JavaScript en segundo plano de forma independiente a la ejecución de la UI.
  • 6.
  • 7.
  • 8.
    8 Web Workers Dedicados: Estosestán vinculados con el origen del script que los creó. Por ejemplo si en esta pagina se crea un worker dedicado, solo los script incluidos en esta pagina podrán acceder a ese worker.
  • 9.
    9 Web Worker compartidos: Adiferencia de el anterior podemos inicializar un worker desde cualquier pagina ajena a la que utilicen.
  • 10.
    10 Características: Ejecutan un subprocesoindependiente de la interfaz de usuario. Son útiles para la descarga de tareas complejas o de larga ejecución. La interfaz de comunicación Web Workers también permite marco de errores
  • 11.
    11 Para saber sila aplicación Web Workers es soportada por el navegador se utiliza la siguiente función: var webworkers_support = !!window.Worker; O bien: • if(typeof(Worker)!==”undefined”) { // Tu navegador soporta Web Worker • // Codigo a ejecutar } else { //Tu navegador soporta no Web Worker • }
  • 12.
    12         • También estánsoportados en IE 10, Firefox (desde la versión 3.6), Safari (desde la 4.0), Chrome y Opera 11.
  • 13.
    13 Si la aplicaciónweb Workers no es soportada por el navegador, en particular tendrá que acabar con ejecutar su código con un hilo principal en Java Script y trato con los retrasos que pueda provocar.
  • 14.
    14 Tiempos de esperae intervalos: SetTimeOut SetInterval ClearTimeOut ClearInterval
  • 15.
    15 Gestión de errores Message.-Unmensaje de error legible para el ojo humano. Filename.- El nombre del archivo de script en el que se produjo el error. Lineno.-El número de línea del archivo de script en el que se produjo el error worker.onerror = function (evt) { alert(evt.data); }
  • 16.
    16 Acceder al objetonavegador appName appVersion platform userAgent
  • 17.
    17 Utilidad y beneficios: Sonútiles para la descarga de tareas complejas. Puede generar otros trabajadores, también eliminarlos y la instancia de los mismos. Procesamiento de imágenes Análisis de Texto Accesos simultáneos a BD Manipulación de grandes cantidades de datos
  • 18.
    18 Cómo crear unweb worker: worker var = new Worker(‘ejemplo.js'); worker.postMessage("Información para el worker"); worker.onmessage = function (evt) { // evt.data es el valor devuelto por el Worker alert(evt.data); }
  • 19.
    19 Terminar un worker: myWorker.terminate(); Sepueden cerrar también con el método: nsIWorkerScope.close().
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
    24 • De manerageneral podemos decir que esta API es un elemento indispensable en aplicaciones que requieran un mayor consumo de recursos, además de brindar una forma mas sencilla de trabajar a la par los archivos script. • Contratiempos. No se presentaron. • Dificultad de la actividad - tiempo. No hubo dificultades grandes durante la elaboración ni en el tiempo proporcionado para la entrega del trabajo.
  • 25.
    25 Actividad.- Web Workers •Objetivo: Conocer el funcionamiento de los trabajadores web, mediante el desarrollo de una aplicación. • Elaborar una página web que guarde su “Nombre – No Control” en un archivo .js y posteriormente se imprima mediante un archivo html. • Formato individual, archivo comprimido
  • 26.

Notas del editor

  • #13 No obstante, las versiones de móviles de estos navegadores no los soportan.