Ingrid Fernanda Banguero Espitia
PreguntaHola, pensé que el script siempre debía ejecutarse luego de que el HTML cargara por completo, ¿en qué casos yo querría colocar mi script antes de que me cargue por completo el HTML?¿en qué casos usaría el async y el defer?
- ++GAScript debería tener un grado de importancia bajo++ ya que no es prioritario para tus usuarios y si falla en cargar o no carga no afectará la visualización de información en tu web.
- ++APIScript debería tener de manera categórica un grado de importancia alto++ ya que es prioritario, de tal manera que si este script falla, tus usuarios no podrán ver los datos de tipo de cambio y los habrás perdido.
Julio César Zaravia Paredes
Hola Ingrid.
Muy buena pregunta. Y, veamos si puedo dar una opinión que quizá te sirva.
Imagina que trabajas en ++una página web de cambio de divisas++, es decir tu página principal estará llena de información sobre tipos de cambio de moneda que posiblemente le sirve a viajeros de todo el mundo.
++En tu web solo funcionan dos scripts.++
++El script de Google Analytics++ (Llamémosle ++GAScript++) que usas para hacer un seguimiento responsable de tu tráfico. Y un script propio que se encarga de ++consumir una API++ de tipos de cambios (llamémosle ++APIScript++) y procesar la data para ser mostrada en tu web.
++Ahora asignemos un grado de importancia:++ bajo, medio y alto a cada script.
Dicho esto.
++¿Qué pasa si colocas ambos antes del cierre de la etiqueta BODY, es decir al final de tu código HTML?++ 🤔
Pasa que estás poniendo en cola a dos scripts de prioridades diferentes y como el ++script fetching (la llamada)++ se ejecuta antes que el ++script execution (la ejecución)++ tendrás que ++esperar todo el tiempo que tarde GAScript, un script de prioridad baja++, en ser llamado antes de poder ejecutar ++APIScript, un script de prioridad alta++.
Y ++¿Qué hacemos?++ 🤔
Lo que se recomienda, es colocar ambos scripts entre las etiquetas del <head>, asignando a ++GAScript el atributo async++ y a ++APIScript el atributo defer++.
De tal manera ++GASCript irá cargando mientras carga la estructura del documento++ sin afectar la visualización ni la carga de APIScript. ++Así estarás salvando a tus viajeros de que les roben en el tipo de cambio++.
Y ++¿Por qué usar defer en APIScript y colocarlo en <head> si es lo mismo ponerlo antes del cierre del BODY?++ 🤔
Eso lo comenté como respuesta a otra pregunta. Aquí te dejo el enlace si te interesa 👉 https://platzi.com/comentario/2125167/
Espero que mi opinión pueda dejarte más claras las cosas. Yo igual soy un aprendiz, si ves que me equivoqué en algo o en todo me lo comentas y así aprendemos los dos.
¡Saludos!
Juan Pablo Ferro Arroyo
es util porque por ejemplo usando defer si hacemos la peticion desde el inicio cuando el documento cargue por completo la ejecucion del script va a ser inmediata, asi el tiempo de espera por la respuesta se consume en paralelo junto con el tiempo de carga de la pagina, es como hacer ambas tareas al mismo tiempo
Jhon Alexander Romero Gonzaga
Hola Ingrid!!! Yo también estube pensando en eso ya que recien me entere de async y defer, pero con el inspector de chrome he observado que en páginas ponen scirpts de reproductor de video justo en medio del HTML, entonces se podria decir que por ahi va. Espero que con esto te ayude un poco mas aunque no es mucho.
