.

Aplazar

¿Qué significa "defer" y cómo se utiliza?

En desarrollo web, el término "defer" se refiere a un atributo de la etiqueta <script> que retrasa la ejecución de JavaScript hasta que todo el documento HTML esté completamente cargado. Esto permite optimizar el proceso de carga de una página web descargando el script pero ejecutándolo sólo después de que el documento haya sido analizado por completo.

 

¿Tiene su sitio web problemas con el GDPR? ¡Compruébelo ahora gratis!

¿Qué riesgo de multa corre 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 el atributo defer?

El atributo defer se utiliza para mejorar los tiempos de carga de las páginas web y optimizar la experiencia del usuario. En lugar de bloquear la renderización de la página mientras se ejecuta un script, defer garantiza que el contenido de la página web pueda mostrarse más rápidamente. Esto resulta especialmente útil cuando el script realiza manipulaciones del DOM que sólo son relevantes una vez que el documento se ha cargado por completo.

¿Cuáles son las ventajas de utilizar Defer?

  • Tiempos de carga mejorados:
    Al retrasar la ejecución del script, la página puede cargarse más rápido, mejorando la experiencia del usuario.
  • Optimización del render izado: los scripts de
    que manipulan el DOM sólo se ejecutan cuando el documento está completamente cargado, lo que optimiza el renderizado de la página.
  • Mantenimiento del orden:
    A diferencia de los scripts asíncronos(async), en los que el orden de ejecución es impredecible, defer mantiene el orden de ejecución de los scripts.

¿Existe algún problema al utilizar defer?

  • Compatibilidad con navegadores:
    Aunque los navegadores modernos son totalmente compatibles con el atributo defer, hay navegadores más antiguos que pueden no entender este atributo. Los desarrolladores deben asegurarse de que los sitios web también funcionan correctamente en navegadores antiguos.
  • Dependencia de scripts:
    Si un script depende de otro script que debe ejecutarse primero, el uso de defer puede provocar problemas si el orden de ejecución no se gestiona correctamente.

¿Cómo se utiliza defer en la práctica?

Un ejemplo típico de uso del atributo defer es el siguiente:

  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Página de ejemplo</title>
  6. <script src="script1.js" defer></script>
  7. <script src="script2.js" defer></script>
  8. </head>
  9. <body>
  10. <h1>Bienvenido a mi sitio web</h1>
  11. <p>Esta es una página de ejemplo.
  12. </p>
  13. </body>
  14. </html>

 

En este ejemplo, los scripts script1.js y script2.js sólo se ejecutan después de que el documento HTML se haya cargado completamente, por lo que se conserva el orden de ejecución.

Nota sobre el uso de CCM19

El script CCM19 no debe estar provisto del atributo defer, ya que esto puede perjudicar la funcionalidad del Gestor de Consentimiento. CCM19 debe ejecutarse lo antes posible para garantizar que los scripts que requieren consentimiento puedan bloquearse primero. Esto es crucial para la correcta gestión de los consentimientos de los usuarios y el cumplimiento de la normativa de protección de datos.

 

¿Tiene su sitio web problemas con el GDPR? ¡Compruébelo ahora gratis!

¿Qué riesgo de multa corre su sitio web? Introduzca ahora la dirección de su sitio web y descubra qué cookies y servicios de terceros suponen un riesgo