JavaScript Academy · Lección

Casos de uso y limitaciones

Sepa cuándo ayudan los workers y qué no pueden hacer.

Casos de uso y limitaciones es una lección gratuita de JavaScript Academy en CoddyKit. Esta es la lección 4 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de JavaScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de JavaScript Academy incluye 4 lecciones en total.

Para qué son adecuados los workers

Los Web Workers son especialmente útiles cuando tiene trabajo que exige mucho a la CPU y que, de otro modo, congelaría la interfaz:

Procesamiento de imágenes y vídeo
Análisis de archivos grandes (CSV, JSON)
Criptografía y hashing
Física, análisis de datos y simulaciones

Sin acceso al DOM

La mayor limitación es que los workers no pueden acceder al DOM. No existe document ni window. Los workers calculan datos y los envían de vuelta; el hilo principal actualiza la interfaz.

// Inside a worker:
// document.querySelector(...) -> ReferenceError
// Workers have no DOM at all.

Qué SÍ está disponible

Los workers siguen teniendo acceso a muchas API útiles: fetch, setTimeout, WebSocket, IndexedDB, crypto y arrays tipados. Por tanto, la obtención y el almacenamiento de datos funcionan perfectamente en otro hilo.

// Inside a worker this is valid:
// const res = await fetch('/data.json');
// const json = await res.json();
// self.postMessage(json);

Límites de la clonación estructurada

Recuerde que los mensajes se copian mediante clonación estructurada. No puede enviar funciones, nodos DOM ni instancias de clase con métodos; solo sus datos serializables.

// Cannot be sent:
// worker.postMessage(() => {});      // function - fails
// worker.postMessage(document.body); // DOM node - fails

Coste de inicio y comunicación

Crear un worker y serializar mensajes tiene un coste. En tareas muy pequeñas, el coste de la comunicación puede superar el beneficio. Los workers resultan rentables para trabajos importantes y continuos.

Mantener los workers activos

Iniciar un worker nuevo para cada tarea es ineficiente. Reutilice un worker de larga duración y envíele muchos mensajes, o mantenga un grupo pequeño de workers para trabajar en paralelo.

// Reuse one worker for many tasks:
const worker = new Worker('worker.js');
function run(task) {
  worker.postMessage(task);
}
// Avoid: new Worker(...) on every single call.

Grupos de workers

Para usar varios núcleos de la CPU, cree varios workers y distribuya las tareas entre ellos. Lleve un registro de cuáles están inactivos y asigne el trabajo entrante a los que estén libres.

const pool = [];
for (let i = 0; i < 4; i++) {
  pool.push(new Worker('worker.js'));
}
// Round-robin or queue tasks across the pool.

Compartir memoria

En casos avanzados, SharedArrayBuffer permite que los hilos compartan memoria directamente (con Atomics para acceder a ella de forma segura). Requiere encabezados especiales de aislamiento entre orígenes y es fácil usarlo incorrectamente.

// Requires COOP/COEP headers to be enabled.
// const shared = new SharedArrayBuffer(1024);
// Atomics.add(view, 0, 1); // safe concurrent update

Aislamiento de errores

Un error no capturado en un worker no bloquea la página. Se manifiesta como un evento error en el worker, que debe gestionar para registrar el error o reiniciar el worker.

worker.onerror = (e) => {
  console.log('worker failed:', e.message);
  // optionally recreate the worker here
};

Cuándo NO usar workers

No use workers cuando la tarea sea trivial, requiera actualizaciones constantes del DOM o consista principalmente en esperar a la red (el fetch asíncrono ya evita el bloqueo). Úselos para trabajo que realmente dependa de la CPU.

Integración de todos los conceptos

Los Web Workers intercambian el acceso directo al DOM y el uso compartido sencillo de datos por un paralelismo real. Úselos para cálculos pesados, comuníquese mediante mensajes, reutilice los workers y transfiera buffers grandes para mantener la aplicación rápida y fluida.

Comprobación rápida

Compruebe cuánto ha entendido sobre los casos de uso y las limitaciones de los workers.

Repaso

Ha aprendido los casos de uso y las limitaciones de los workers:

Son ideales para trabajos que exigen mucho a la CPU, pero no tienen acceso al DOM.
Muchas API (fetch, IndexedDB, crypto) están disponibles.
Los mensajes se clonan mediante clonación estructurada, por lo que no se pueden enviar funciones ni nodos DOM.
Reutilice workers o grupos de workers para amortizar el coste de inicio.
Los errores quedan aislados en el worker.

Ha terminado la sección sobre Web Workers. A continuación, IndexedDB.

Preguntas frecuentes

¿La lección «Casos de uso y limitaciones» es gratis?

Sí — el texto completo de «Casos de uso y limitaciones» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de JavaScript Academy, actualiza a CoddyKit PRO. El curso de JavaScript Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Casos de uso y limitaciones»?

Sepa cuándo ayudan los workers y qué no pueden hacer. Practicas JavaScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar JavaScript Academy?

No se requiere experiencia previa. JavaScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 4 de 4.

¿Cuánto tiempo toma la lección «Casos de uso y limitaciones»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de JavaScript Academy?

Sí. Cada lección de JavaScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

← Volver a JavaScript Academy