Async
¿Qué significa async y cómo se utiliza?
El término "async" (abreviatura de "asynchronous", asíncrono) se utiliza en desarrollo web para describir un atributo de la etiqueta <script> que permite ejecutar scripts JavaScript de forma asíncrona.
Esto significa que el script se descarga y ejecuta independientemente del documento HTML que se esté cargando. A diferencia de los scripts convencionales, que bloquean la carga y renderización de la página, un script asíncrono se ejecuta en paralelo con la carga de la página.
Escáner gratuito de riesgo de cookies, GDPR y TDDDG
¿Cuál es el riesgo de multas para su sitio web? Introduzca ahora la dirección de su sitio web y descubra qué cookies y servicios de terceros suponen un riesgo.
¿Por qué se utiliza async?
El atributo async se utiliza para mejorar el rendimiento de los sitios web. Como los scripts asíncronos no bloquean la carga de la página, el contenido se muestra más rápido, lo que mejora significativamente la experiencia del usuario.
Esto es especialmente importante para los sitios web que utilizan muchos scripts externos, como códigos de seguimiento o anuncios.
¿Cuáles son las ventajas de utilizar Async?
- Tiempos de carga de página acelerados:
Los scripts asíncronos se cargan y ejecutan en paralelo con el resto de la página, lo que se traduce en tiempos de carga más rápidos. - Ejecución independiente:
Como los scripts se ejecutan independientemente unos de otros, la carga de un recurso no puede bloquear a los demás, lo que resulta en una experiencia de carga más fluida y eficiente. - Optimización para sitios de contenido:
Los sitios web que dependen en gran medida de recursos externos pueden utilizar async para mejorar sus tiempos de carga y la experiencia del usuario.
¿Existe algún problema al utilizar async?
- Orden de ejecución impredecible:
Como los scripts async se ejecutan en el orden en que se cargan, esto puede provocar problemas si el orden de los scripts es importante. Esto puede dar lugar a errores, especialmente si un script depende de otro. - Compatibilidad con navegadores antiguos:
Aunque async es compatible con la mayoría de los navegadores modernos, puede causar problemas en navegadores antiguos.
¿Cómo se utiliza async en la práctica?
Un ejemplo típico de uso del atributo async es el siguiente:
- <!DOCTYPE html>
- <html lang="es">
- <head>
- <meta charset="UTF-8">
- <title>Página de ejemplo</title>
- <script src="script1.js" async></script>
- <script src="script2.js" async></script>
- </head>
- <body>
- <h1>Bienvenido a mi página web</h1>
- <p>Esta es una página de ejemplo.
- </p></body></html>
En este ejemplo, los scripts script1.js y script2.js se cargan y ejecutan de forma asíncrona, independientemente del orden en el que aparezcan en el documento o de cuándo estén completamente cargados.
Nota sobre el uso de CCM19
El script CCM19 no debe proporcionarse con el atributo async, ya que esto puede perjudicar la funcionalidad del Gestor de Consentimiento. CCM19 debe garantizar que se obtienen todos los consentimientos necesarios antes de cargar otros scripts. Por tanto, debe ejecutarse pronto y en el orden correcto para aplicar correctamente la normativa de protección de datos.
