Excluye los archivos de JavaScript del aplazamiento de Jetpack Boost

Este artículo explica cómo evitar que Jetpack Boost aplace archivos específicos de JavaScript o páginas enteras. Puedes excluir scripts individuales por su identificador y añadir el data-jetpack-boost="ignore" atributo a una etiqueta de script, o evitar el aplazamiento de JavaScript en páginas completas que coincidan con un patrón de URL. Usa estas exclusiones cuando aplazar JavaScript cause problemas de diseño o interrumpa la funcionalidad de la página.

Cuándo excluir JavaScript del aplazamiento

Si experimentas un comportamiento no deseado en tu sitio web al aplazar JavaScript (JS) con Jetpack Boost, la funcionalidad afectada podría depender de que los archivos de JavaScript estén en un orden determinado o estén disponibles para la página lo antes posible.

Jetpack Boost te ofrece dos formas de gestionar esta situación. Puedes excluir scripts individuales para que el resto de la página siga beneficiándose del aplazamiento, o excluir una página entera cuando el aplazamiento cause problemas en toda la página.

  • Exclusiones a nivel de script evitan que Jetpack Boost aplace un script específico mientras sigue aplazando los demás scripts de la página. Utiliza este método cuando un script deba cargarse inmediatamente o en un orden determinado.
  • Exclusiones a nivel de página evitan que Jetpack Boost aplace cualquier archivo de JavaScript en páginas que coincidan con un patrón de URL. Utiliza este método cuando el aplazamiento cause problemas de diseño o de ejecución de JavaScript en toda una página, como una página de pago o una galería.

Excluir un script individual del aplazamiento

Puedes indicar a Jetpack Boost que no aplace un archivo específico añadiendo el atributo data-jetpack-boost="ignore" a la etiqueta de script. El método que utilices depende de si la etiqueta de script está codificada directamente o se ha añadido a la cola con wp_enqueue_script.

Si la etiqueta de script está codificada directamente, añade el atributo a la etiqueta:

<script data-jetpack-boost="ignore">

Excluir del aplazamiento un script añadido a la cola con wp_enqueue_script

Si la etiqueta de script se ha añadido a la cola con wp_enqueue_script como en el siguiente ejemplo:

function wpdemo_enqueue_scripts() {
    wp_enqueue_script( 'wpdemo', get_template_directory_uri().'/js/wpdemo.js' );
}
add_action( 'wp_enqueue_scripts', 'wpdemo_enqueue_scripts' );

Puedes usar el fragmento de ejemplo siguiente y añadirlo al archivo functions.php de tu tema:

function add_data_jetpack_boost_tag( $src, $handle ) {
    if ( $handle !== 'wpdemo') {
        return $src;
    }
    return str_replace( ' src', ' data-jetpack-boost="ignore" src', $src );
}
add_filter( 'script_loader_tag', 'add_data_jetpack_boost_tag', 10, 2 );

Recuerda sustituir wpdemo por el identificador del archivo de script que quieras excluir.

Excluir una página entera del aplazamiento

A partir de Jetpack Boost 4.6.2, la función Aplazar JavaScript no esencial incluye una lista de exclusión de patrones de URL por página. Esta lista evita que Jetpack Boost aplace cualquier JavaScript en las páginas cuya URL coincida con un patrón que introduzcas, sin desactivar la función Aplazar JS en todo el sitio.

Para añadir una exclusión a nivel de página, sigue estos pasos:

  1. Ve a Jetpack → Boost y abre el panel de ajustes de Jetpack Boost.
  2. Busca la función Aplazar JavaScript no esencial.
  3. Introduce uno o varios patrones de URL en la lista de exclusión. El panel muestra un ejemplo integrado del formato esperado.
  4. Guarda los cambios.

Sintaxis de patrones de URL

La sintaxis de patrones de URL para las exclusiones a nivel de página coincide con la sintaxis utilizada para las exclusiones de la caché de página. Puedes introducir un fragmento de texto simple, como checkout, o un patrón con un comodín, como gallery/(.*). Cualquier página cuya URL coincida con un patrón de la lista queda excluida del aplazamiento de JS.

Para obtener más información sobre cómo funciona la coincidencia de patrones, consulta Excluir partes específicas del sitio de la caché.

Still need help?

Please contact support. We’re happy to advise.