Quicklink
Integra la biblioteca Quicklink de Google Chrome Labs para precargar enlaces visibles durante el tiempo de inactividad, mejorando el rendimiento percibido de carga de páginas.
quicklink
Install
composer require 'drupal/quicklink:^2.0'
Overview
El módulo Quicklink integra la biblioteca JavaScript Quicklink desarrollada por Google Chrome Labs en Drupal. Quicklink utiliza la API Intersection Observer para detectar enlaces que están dentro del viewport del usuario y los precarga durante el tiempo de inactividad del navegador. Esta técnica de precarga mejora significativamente el rendimiento percibido de carga de páginas al tener los recursos de la siguiente página listos antes de que el usuario haga clic.
El módulo proporciona una interfaz administrativa completa para configurar qué enlaces deben precargarse, cuándo debe cargarse la biblioteca y varias opciones de limitación para controlar el uso de recursos. Maneja de manera inteligente casos especiales como rutas de administración, enlaces AJAX, enlaces con hash y descargas de archivos para evitar precargas innecesarias.
Por defecto, el módulo está configurado para un rendimiento óptimo con usuarios anónimos, ignorando automáticamente rutas de administración, enlaces AJAX, fragmentos hash y extensiones de archivo. El módulo puede cargar la biblioteca Quicklink desde un CDN o desde una copia alojada localmente para mejor rendimiento.
Features
- Precarga automática de enlaces visibles usando la API Intersection Observer
- Patrones de exclusión configurables para URLs, selectores, rutas de administración, enlaces AJAX, fragmentos hash y extensiones de archivo
- Control por tipo de contenido sobre la carga de la biblioteca
- Precarga consciente de sesión que puede deshabilitarse durante sesiones PHP activas
- Controles de limitación incluyendo límites de solicitudes, límites de concurrencia, retraso de viewport y configuración de tiempo de espera inactivo
- Soporte para precarga solo de rutas específicas que anula todas las demás configuraciones
- Soporte de precarga entre dominios con dominios permitidos configurables
- Soporte de polyfill para Intersection Observer para navegadores antiguos (IE11)
- Modo de depuración con indicadores visuales y registro en consola para desarrollo
- Fallback automático a CDN cuando la biblioteca local no está disponible
Use Cases
Sitios de contenido con alto tráfico
Habilite Quicklink solo para usuarios anónimos en un sitio de noticias o blog para mejorar significativamente los tiempos de carga percibidos mientras los lectores navegan entre artículos. La biblioteca precarga los enlaces de artículos visibles en el viewport, haciendo que las navegaciones subsiguientes se sientan instantáneas.
Catálogos de productos de comercio electrónico
Configure Quicklink con el reconocimiento de sesión deshabilitado para sitios de compras. Cuando se combina con la opción 'No precargar durante sesiones', el módulo evita precargar cuando los usuarios tienen artículos en su carrito, previniendo carga innecesaria del servidor.
Páginas de destino con navegación limitada
Use la función 'Precargar solo estas rutas' para especificar exactamente qué páginas deben precargarse desde una página de destino, asegurando que solo las páginas críticas para la conversión se precarguen mientras se ignora otra navegación del sitio.
Instalaciones de Drupal multi-dominio
Configure la opción 'Anular dominios permitidos' para habilitar la precarga entre dominios a través de múltiples dominios servidos por la misma instalación de Drupal, mejorando la navegación entre sitios relacionados.
Optimización móvil consciente del ancho de banda
Use las opciones de limitación para restringir las solicitudes concurrentes y el conteo total de precargas, reduciendo el uso de datos para visitantes móviles mientras aún proporciona beneficios de rendimiento.
Desarrollo y depuración
Habilite el modo de depuración para identificar visualmente qué enlaces están siendo ignorados y por qué. Los enlaces ignorados se marcan con un emoji 🚫 y al pasar el cursor se muestra la regla coincidente. El registro en consola proporciona información detallada de configuración e ignorados.
Tips
- Siempre ignore las rutas de administración y los enlaces AJAX en producción para prevenir precargas innecesarias y posibles efectos secundarios
- Use el modo de depuración durante el desarrollo para entender qué enlaces están siendo precargados y por qué otros son ignorados
- Para el mejor rendimiento, aloje la biblioteca Quicklink localmente en lugar de usar el CDN
- Considere usar las opciones de límite de solicitudes y limitación de concurrencia en páginas con muchos enlaces para evitar sobrecargar el servidor
- El parámetro URL 'noprefetch' o el hash '#noprefetch' puede agregarse a cualquier URL para deshabilitar temporalmente Quicklink para depuración
- Los enlaces con los atributos HTML 'noprefetch' o 'download' son automáticamente ignorados
- Combine con estrategias de cache de navegador y CDN para máximos beneficios de rendimiento
Technical Details
Admin Pages 1
/admin/config/development/performance/quicklink
Configure cómo la biblioteca Quicklink precarga enlaces en su sitio. Esta página proporciona opciones completas para controlar qué enlaces se precargan, cuándo se carga la biblioteca y varias configuraciones de limitación de rendimiento.
Hooks 2
hook_library_info_build
Construye dinámicamente la definición de la biblioteca quicklink, verificando la existencia del archivo local y usando CDN como fallback si no se encuentra.
hook_preprocess_html
Adjunta las bibliotecas y configuración de Quicklink a la página basándose en la configuración actual, estado de autenticación del usuario, estado de sesión y tipo de contenido.
Troubleshooting 7
Verifique que la biblioteca local exista en /libraries/quicklink/dist/quicklink.umd.js o que el CDN (unpkg.com) sea accesible. La página de informe de estado mostrará advertencias sobre la ubicación de la biblioteca.
Descargue la versión correcta (2.3.0) de la biblioteca Quicklink desde https://unpkg.com/quicklink@2.3.0/dist/quicklink.umd.js y colóquela en /libraries/quicklink/dist/quicklink.umd.js
Verifique la configuración 'Precargar solo para usuarios anónimos'. Por defecto, la biblioteca solo se carga para usuarios anónimos.
Habilite el modo de depuración para ver qué reglas están coincidiendo. Agregue patrones de URL o selectores CSS específicos a las listas de ignorados.
Verifique las casillas 'No cargar biblioteca en estos tipos de contenido' para asegurar que el tipo de contenido no esté excluido.
Asegúrese de estar ejecutando la versión 2.x de la biblioteca Quicklink. La versión 1.x tiene una API diferente y no es compatible.
Habilite la opción 'No precargar durante sesiones' para deshabilitar la precarga cuando una sesión PHP está activa.
Security Notes 4
- El enlace de cierre de sesión (/user/logout) siempre se ignora para prevenir la terminación accidental de sesión
- Las rutas de administración se ignoran por defecto para prevenir la precarga de acciones administrativas
- La precarga entre dominios está deshabilitada por defecto y debe configurarse explícitamente
- La precarga consciente de sesión ayuda a proteger contra la precarga de contenido sensible específico del usuario