Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Web Workers

Web Workers

Mariano Alvarez

April 20, 2020
Tweet

More Decks by Mariano Alvarez

Other Decks in Programming

Transcript

  1. @malvarezcr ¿Quién soy? Web Practice Lead Co-Organizador de Angular Costa

    Rica Fan de JS, TS, NG, Web Techs, Pizza, Emojis Mariano Álvarez
  2. @malvarezcr ¿Cómo funciona Javascript? Conceptos • Heap • Stack Importante:

    First In - Last Out • Web API • Callback queue Importante: First In - First Out Referencia https://medium.com/@Rahulx1/understanding-event-loop-call-stack-event-job-queue-in-javascript-63dcd2c71ecd
  3. @malvarezcr ¿Qué es un Web Worker? Es una especificación que

    define un API para poder correr tareas en un segundo plano
  4. @malvarezcr ¿Qué es un Web Worker? Conceptos • Existen 2

    tipos: Dedicated y Shared Workers • OnMessage y postMessage son funciones que permiten la comunicación Shared se comunican igual pero deben usar el port object • Soportan importScripts • Un worker puede llamar otros workers • Los objetos son serializados y deserializados • No se puede manipular el DOM • Debe estar en el mismo dominio en el que se va utilizar
  5. @malvarezcr Consejos • Utilizarlos solo en tareas muy intensas. En

    pequeñas tareas no se ve la mejora de rendimiento • Siempre validen que el navegador / NodeJS lo soporte • Tareas comunes en los que se usan: revision de ortografia, caching de assets, prefetching
  6. @malvarezcr Links de referencia • Ejemplo Web Worker https://github.com/mahcr/simple-web-worker •

    Javascript concurrency https://developer.mozilla.org/en-US/docs/Web/ API/Web_Workers_API/Using_web_workers • Twitter: @malvarezcr / Medium: @mahcr Mariano Álvarez