HTML5: Introducción a los Web Workers 2

En la entrada anterior vimos una introducción a los web workers. En ella vimos como crearlos y como comunicarnos desde la página web con el web worker y viceversa. Pese a que con lo visto puede ser más que suficiente en muchísimos casos se nos quedaron algunas cosas en el aire y que veremos a continuación.

Gestión de errores
Puede que para algunos procesos simples no nos tengamos que preocupar de la gestión de errores (aunque creo que nunca está de más), pero en otras ocasiones puede que se imprescindible. Para comunicar un error desde nuestro worker usaremos el evento error, así que lo que haremos será suscribirnos al evento error del worker desde nuestra página web.

worker.addEventListener('error', _error, false);

function _error(e) {
    var output = document.querySelector('#output');
    output.innerHTML = 'ERROR: Line ' + e.lineno + ' in ' + e.filename + ': ' + e.message;
}

Y en el worker usaremos el siguiente código para simular un error (lanzaremos un error en caso que el número pasado sea cero)

// Procesamos el mensaje recibido
function _message(e) {
    // Simulamos un error
    if (e.data == 0)
        throw new Error(0, "Por favor, introduce un número mayor o igual a uno");

    var primes = _getPrimes(e.data);
    self.postMessage(primes);
}

Detener el web worker
En el caso que queramos detener un worker, lo podemos hacer de dos maneras. La primera de ellas desde el código del propio worker. En ese caso debemos usar el método close. Para probar esté método pondremos el siguiente código en el método _message de nuestro worker (finalizamos la ejecución del worker en caso que intentemos calcular los números primos de un número negativo).

// Simulamos la detención del worker
if (e.data < 0) 
    self.close();    

En caso que queramos acabar con el worker desde la página web debemos usar el método terminate. En nuestro ejemplo usaremos un botón para detener la ejecución del worker

<input type="button" id="btnTerminate" value="Terminar" onclick="_terminate()"/>

Y este es el código del método onclick

function _terminate() {
    worker.terminate();
}

Y con esto acabamos la introducción básica a los web workers. Espero que les sea de utilidad.

Happy coding!