Acelera tu Sitio WordPress: Cómo Cargar Plugins y Scripts Selectivamente

En sitios WordPress, especialmente en aquellos que integran WooCommerce, es común utilizar una gran cantidad de plugins y scripts que añaden funcionalidades específicas, como métodos de pago, integraciones o herramientas de conversión de moneda. Sin embargo, muchos de estos elementos solo se requieren en ciertas secciones, como la tienda o el checkout. Si se cargan innecesariamente en otras páginas (como el blog o la página de inicio), pueden ralentizar el sitio.

Por ejemplo, plugins como WooCommerce MercadoPago o WooCommerce MiCuentaWeb (son pasarelas de pago) solo necesitan estar activos en las páginas de productos, carrito y checkout, donde los usuarios interactúan directamente con el proceso de compra. Cargar estos plugins en todas las páginas solo consume recursos, afecta el rendimiento y puede incluso impactar la experiencia de usuario.

Solución Nativa: El Hook option_active_plugins para Desactivar Plugins Condicionalmente

Con el filtro option_active_plugins, podemos condicionar la carga de ciertos plugins en función de la página actual. Este método optimiza WordPress eliminando del proceso de carga los plugins innecesarios en ciertas páginas.

¿Por qué estas páginas en WooCommerce?

WooCommerce proporciona funciones condicionales para determinar si una página pertenece al proceso de compra:

• is_product(): Solo necesita plugins específicos cuando se está en la página de un producto.
• is_cart(): Cargar plugins relacionados con métodos de pago en la página de carrito ayuda a prever y ajustar datos relacionados con el total y métodos de pago.
• is_checkout(): La página de checkout es donde los plugins de pago, impuestos y validaciones de datos son más críticos para completar una compra.

Implementación en el Tema

Para implementar esta optimización, puedes añadir el siguiente código en el archivo functions.php de tu tema activo o en un plugin personalizado.

Ejemplo de Código: Control de Plugins con Condiciones en WooCommerce

// Filtro para desactivar plugins en páginas específicas de WordPress
add_filter('option_active_plugins', 'conditional_plugin_loader');

/**
 * Desactiva plugins específicos fuera de las páginas de WooCommerce donde se requieren.
 *
 * @param array $plugins Lista de plugins activos.
 * @return array Lista de plugins filtrada según la página actual.
 */
function conditional_plugin_loader($plugins) {
    // Definir las funciones condicionales para las páginas donde se requieren plugins de WooCommerce
    $allowed_pages = [
        'is_product',    // Página de productos
        'is_cart',       // Página del carrito
        'is_checkout'    // Página de checkout
    ];

    // Verificación de la página actual
    $is_allowed = false;
    foreach ($allowed_pages as $allowed_page) {
        if (function_exists($allowed_page) && $allowed_page()) {
            $is_allowed = true;
            break;
        }
    }

    // Si no estamos en una de las páginas permitidas, desactivar los plugins específicos
    if (!$is_allowed) {
        $plugins_to_disable = [
            'woocommerce-mercadopago/woocommerce-mercadopago.php', // Plugin de pago MercadoPago
            'woo-currency-switcher/woo-currency-switcher.php', // Plugin de cambio de moneda
            'woo-payment-gateway/woo-payment-gateway.php' // Plugin de otro gateway de pago
        ];

        foreach ($plugins_to_disable as $plugin) {
            $key = array_search($plugin, $plugins);
            if ($key !== false) {
                unset($plugins[$key]);
            }
        }
    }

    return $plugins;
}

Explicación del Código

• Estructura del Array $allowed_pages: Al definir is_product, is_cart, e is_checkout como las páginas en $allowed_pages, indicamos que estos plugins solo se cargarán en páginas donde el usuario necesita interactuar con el carrito, productos o el proceso de pago.
• Desactivación de Plugins Específicos: $plugins_to_disable incluye los archivos principales de cada plugin, como woocommerce-mercadopago/woocommerce-mercadopago.php, que es la ruta relativa al archivo principal del plugin. Este archivo es el que WordPress utiliza para cargar el plugin. Desactivar los plugins aquí permite que solo se carguen cuando realmente son necesarios.

Carga Selectiva de Scripts con wp_enqueue_script

Así como desactivar plugins en páginas específicas puede mejorar el rendimiento, cargar scripts selectivamente es igual de beneficioso. WordPress proporciona la función wp_enqueue_script, que nos permite condicionar la carga de scripts solo en las páginas donde se necesitan.

Ejemplo de Implementación de wp_enqueue_script

Supongamos que tienes un script de JavaScript que solo se necesita en la página del carrito. En lugar de cargarlo en todo el sitio, puedes usar el siguiente código:

add_action('wp_enqueue_scripts', 'load_cart_scripts');

/**
 * Encola scripts solo en la página del carrito para mejorar el rendimiento.
 */
function load_cart_scripts() {
    // Solo encolar el script en la página del carrito de WooCommerce
    if (is_cart()) {
        wp_enqueue_script('cart-custom-script', get_template_directory_uri() . '/js/cart-custom.js', array('jquery'), '1.0', true);
    }
}

Explicación del Ejemplo de Scripts

• wp_enqueue_script: Aquí cargamos el script cart-custom.js solo en la página de carrito de WooCommerce (usando is_cart()).
• Dependencia de jQuery: Al especificar array('jquery'), indicamos que este script depende de jQuery.
• Ubicación en el Tema: La función get_template_directory_uri() apunta al directorio del tema activo, donde puedes almacenar el archivo cart-custom.js en la carpeta js.

Este método reduce la carga de scripts innecesarios en el resto del sitio, optimizando aún más el rendimiento.

Ejemplo Completo para Implementar en functions.php

A continuación, un ejemplo de cómo implementar tanto la carga condicional de plugins como la de scripts en el archivo functions.php de tu tema.

// Desactivar plugins en páginas específicas de WooCommerce
add_filter('option_active_plugins', 'conditional_plugin_loader');
function conditional_plugin_loader($plugins) {
    $allowed_pages = ['is_product', 'is_cart', 'is_checkout'];
    $is_allowed = false;
    foreach ($allowed_pages as $allowed_page) {
        if (function_exists($allowed_page) && $allowed_page()) {
            $is_allowed = true;
            break;
        }
    }
    if (!$is_allowed) {
        $plugins_to_disable = [
            'woocommerce-mercadopago/woocommerce-mercadopago.php',
            'woo-currency-switcher/woo-currency-switcher.php'
        ];
        foreach ($plugins_to_disable as $plugin) {
            $key = array_search($plugin, $plugins);
            if ($key !== false) {
                unset($plugins[$key]);
            }
        }
    }
    return $plugins;
}

// Cargar scripts selectivamente en la página del carrito
add_action('wp_enqueue_scripts', 'load_cart_scripts');
function load_cart_scripts() {
    if (is_cart()) {
        wp_enqueue_script('cart-custom-script', get_template_directory_uri() . '/js/cart-custom.js', array('jquery'), '1.0', true);
    }
}

---

🚨🚨 Usalo con Preaución 🚨🚨

Este método puede causar problemas si el plugin en cuestión tiene dependencias o interacciones que se esperan en todas las páginas.

Consideraciones

• Compatibilidad: Cargar o desactivar plugins condicionalmente puede afectar la estabilidad y el rendimiento del sitio, ya que muchos plugins no están diseñados para cargarse parcialmente.
• Pruebas: Es importante probar exhaustivamente en el entorno de desarrollo para asegurarse de que el sitio no tenga errores debido a la carga selectiva de plugins.
• Alternativas: Considera separar las funcionalidades necesarias en funciones específicas que puedas incluir condicionalmente en vez de cargar o desactivar un plugin entero.

---

Conclusión

Implementar la carga condicional de plugins y scripts en WordPress permite optimizar el rendimiento del sitio, reducir el tiempo de carga y mejorar la experiencia del usuario. La estrategia de desactivar plugins y cargar scripts solo en las páginas donde se necesitan es especialmente útil en proyectos WooCommerce, donde ciertas funcionalidades solo se requieren en el proceso de compra o endpoints específicos. Con estas técnicas, puedes mejorar el rendimiento y hacer un uso más eficiente de los recursos del servidor, proporcionando una experiencia de navegación más rápida y fluida para tus usuarios.

Etiquetas

• develoment
• wordpress