2 Up and Running with JS Flashcards
¿Cuándo debe escribirse JS en el HTML Doc?
Se escribe JS en el HTML cuando es una pequeña porción de JS que está muy relacionado con la parte a la que está adherida.
¿Cómo se aplica JS a varias partes del HTML Doc y cómo se referencia al HTML Doc?
Para escribir JS que se aplique a varias partes del documento HTML, la mejor práctica es escribirlo de forma externa al HTML en su propio archivo y referenciarlo cuando se quiera hacer uso del JS en el HTML con la etiqueta script.
Recomendaciones sobre la interacción del JS con el HTML Doc:
- Hay que tener cuidado con qué parte del documento interactúa el JS.
- Si el JS interactúa con varias partes del documento, es mejor dividir el JS en varios documentos para que la renderización sea más eficiente en cada punto y no salten unknown typerrors.
DEFAULT BROWSER BEHAVIOR:
Comportamiento por defecto de la renderización de código por parte del navegador:
- 1# El navegador analiza el código HTML.
- 2# El navegador detiene su análisis del HTML cuando encuentra la referencia hacia un JScript y descarga el archivo .JS
- 3# Ejecuta el archivo .JS y luego vuelve al análisis del código HTML.
Nota: a esto se le conoce como content or render blocking porque este proceso bloquea la renderización del contenido en la página; este problema hace que la página se cargue más lenta y provoca otros tipos de problemas.
ASYNC
- El comportamiento de renderización cambia significativamente.
- Mediante este método, el navegador sigue analizando (parsing) el documento HTML, mientras descarga el código JScript.
1# Se analiza el código HTML.
2# Cuando se encuentra la referencia a un archivo .JS se sigue analizando el HTML hasta que se haya descargado el archivo .JS
3# Cuando se ha descargado el archivo JScript detiene el análisis del HTML, ejecuta el JSscript.
4# Al terminar con la ejecución del Js, continúa analizando el HTML.
Nota: este método cambia, dramáticamente, el tiempo que el navegador toma para interpretar todo y no crea un gran problema de render blocking; este método es mejor para cierto propósitos, especialmente para cuando se necesite que el JS se ejecute lo más rápido posible y no te importa el render blocking.
DEFER
En algunas circunstancias, necesitamos que el navegador ejecute el JS, solo después de que el documento esté completo. Para eso tenemos el DEFER keyword.
Este método le dice al navegador: analiza tu HTML y si encuentras JS, cárgalo mientras analizas el HTML. Cuando el análisis HTML está completo, ejecuta cualquier JS que tengas.
¿Cuáles deben ser las formas estandar de cargar JS hoy en día y cuando debo usar Render Blocking?
Async y Defer, deben ser la forma estándar de cargar el JS hoy en día. Solo debo usar render blocking (default way to parse) si tengo razones específicas para hacerlo.
¿En qué parte del HTML Doc debe cargarse siempre el JS?
Cargar JS debe siempre cargarse en el y entonces usarse Async o defer para controlar cuando se ejecutará ese JS en el documento.
¿Qué es un módulo JS y para qué sirve?
Son segmentos de código JS creados debido a que los archivos JS pueden volverse extensos y eso hace algo complicado trabajar en ellos.
Los módulos JS nos permite dividir el JS en partes para ponerlas en archivos separados y luego importarlas devuelta en el archivo original.
Import ________ from “./.js”;
¿Dónde y cuándo deben cargarse los módulos JS?
Los módulos deben cargarse igual que el archivo original en el con el atributo “module”
antes de que todo funcione apropiadamente.
¿Para qué sirve el atributo Type?
Como los módulos tienen interdependencia, el atributo type asigna prioridad a que todos los módulos se carguen después de que todo lo demás se haya cargado, para asegurar que el navegador tiene todos los módulos disponibles antes de la renderización.
¿Qué pasa con los módulos en la consola web?
Cuando tengo módulos, esos módulos ya no estarán a mi alcance para modificarlos a través de la consola web.
