# DataFirefly Speed Pack — Documentación

> DataFirefly Speed Pack reúne en un solo módulo la caché de página completa, el Critical CSS, la minificación y combinación de recursos, el Delay JS, el lazy loading nativo, los…

- Página: <https://www.datafirefly.com/es/documentation/datafirefly-speed-pack/>
- Idioma: es
- Actualizado el: 2026-06-27
- Otros idiomas: [fr](https://www.datafirefly.com/documentation/datafirefly-speed-pack/index.md), [en](https://www.datafirefly.com/en/documentation/datafirefly-speed-pack/index.md), [de](https://www.datafirefly.com/de/documentation/datafirefly-speed-pack/index.md), [it](https://www.datafirefly.com/it/documentation/datafirefly-speed-pack/index.md), [pl](https://www.datafirefly.com/pl/documentation/datafirefly-speed-pack/index.md), [pt](https://www.datafirefly.com/pt/documentation/datafirefly-speed-pack/index.md), [nl](https://www.datafirefly.com/nl/documentation/datafirefly-speed-pack/index.md)
- Índice: <https://www.datafirefly.com/es/documentation/llms.txt>

DataFirefly Speed Pack reúne en un solo módulo la caché de página completa, el Critical CSS, la minificación y combinación de recursos, el Delay JS, el lazy loading nativo, los resource hints, la reescritura CDN, las directivas de servidor y la limpieza de la base de datos. Esta guía cubre la instalación, la puesta en marcha y cada pestaña de configuración.

## Requisitos y compatibilidad

- PrestaShop 8.0 a 9.x
- PHP 7.2 a 8.3
- Acceso de escritura a la carpeta de caché y, para las directivas de servidor, al archivo htaccess raíz
- Multitienda y multilingüe compatibles

Speed Pack es complementario de los módulos DataFirefly Core Web Vitals y WebP AVIF Pro: no duplica ni la conversión de imágenes ni las optimizaciones que esos módulos ya ofrecen.

## Instalación

1. Suba el archivo desde **Módulos > Gestor de módulos > Subir un módulo**, o copie la carpeta `datafireflyspeedpack` en el directorio `modules/`.
2. Haga clic en **Instalar**.
3. Abra la configuración del módulo. Se genera automáticamente un token de precarga, mostrado en la pestaña Panel.

## Puesta en marcha

Para un despliegue seguro, active las opciones en este orden y verifique el renderizado en cada paso:

1. Active solo la **caché de página**. Navegue por una página de categoría en una ventana privada: la primera carga devuelve la cabecera `X-DfSpeedPack-Cache: MISS`, la recarga devuelve `HIT`.
2. Active la **minificación** HTML/CSS/JS y el **defer**.
3. Active el **lazy load** de imágenes (protegiendo la imagen LCP, véase más abajo).
4. Active el **Critical CSS** y luego el **CSS asíncrono**.
5. Active el **Delay JS**.
6. Por último, y solo tras una comprobación visual, active la **combinación** CSS/JS.

En **Parámetros avanzados > Rendimiento**, desactive la optimización CSS/JS nativa (CCC) y deje que Speed Pack gestione la minificación y la combinación. El módulo detecta este conflicto y lo señala en el Panel.

## Caché de página

La caché de página sirve el HTML almacenado muy pronto, mediante el hook `actionDispatcherBefore`, antes de instanciar el controlador y antes de las consultas de productos. La clave de caché varía por tienda, idioma, moneda y dispositivo.

### Alcance

Solo se almacenan en caché las **páginas de invitado con el carrito vacío**. La detección del cliente conectado y del carrito se realiza lo antes posible mediante la cookie. Ninguna página de cliente conectado se sirve jamás desde la caché.

### Controladores cacheables

La lista blanca de controladores (uno por línea) determina las páginas elegibles: por ejemplo `index`, `category`, `product`, `cms`, `manufacturer`. Quite un controlador para excluirlo por completo de la caché.

### Exclusiones

- **URLs**: subcadenas, una por línea.
- **Cookies**: la presencia de alguna de estas cookies desactiva el almacenamiento en caché.
- **User-Agents**: agentes excluidos.
- **Parámetros de URL ignorados**: los parámetros de seguimiento (utm, fbclid, gclid…) se eliminan de la clave para evitar la fragmentación de la caché.

### Duración e invalidación

La duración es configurable (0 = hasta la purga manual). La invalidación es **automática** en cada cambio de producto, categoría, página CMS, fabricante, proveedor o stock. También puede vaciar la caché en cualquier momento desde el botón dedicado.

## CSS

- **Minificación** del CSS inline y combinado.
- **Combinación** de las hojas locales en un único archivo, con reescritura de las rutas relativas en las reglas url().
- **CSS asíncrono**: las hojas se cargan mediante preload y luego onload para eliminar el CSS bloqueante.

### Critical CSS

Pegue su CSS above-the-fold por tipo de página en los campos dedicados. Se inyecta inline en el head, mientras el resto se carga de forma asíncrona. El campo `*` es el repliegue para cualquier página sin regla específica.

Active el CSS asíncrono _junto con_ el Critical CSS para evitar cualquier destello de contenido sin estilo (FOUC).

## JavaScript

- **Minificación** del JS inline y combinado.
- **Combinación** de los archivos JS locales.
- **Defer** automático de los scripts.

### Delay JS

El Delay JS pospone la ejecución de los scripts hasta la primera interacción del usuario (scroll, clic, tecla, movimiento del ratón o toque), con un repliegue temporizado. Es la mayor mejora en TBT y en la puntuación móvil.

- **Incluir solo**: si se rellena, solo se retrasan los scripts que contienen estas palabras clave.
- **Excluir**: palabras clave de los scripts que nunca deben retrasarse (p. ej. jquery, core).
- Añada el atributo `data-df-nodelay` a una etiqueta script para excluirla individualmente.

## Medios

El lazy loading nativo añade los atributos `loading=lazy` y `decoding=async` a las imágenes, y `loading=lazy` a los iframes.

Proteja su imagen LCP (visual hero, primera imagen visible) añadiéndole el atributo `data-no-lazy` o agregándola a las exclusiones. De lo contrario, el lazy load puede degradar el LCP.

## Resource hints

- **Preconnect** y **DNS-prefetch**: una URL por línea, para dominios de terceros (fuentes, analítica, CDN).
- **Preload**: en formato `url|tipo` (p. ej. `/img/hero.webp|image`). Tipos posibles: image, font, style, script. Precargue su imagen LCP y sus fuentes críticas.
- **font-display swap**: inyectado en las reglas de fuentes inline para evitar el texto invisible.

## CDN

La reescritura CDN reemplaza el host local de los recursos estáticos por su dominio CDN. Introduzca la URL del CDN y luego los patrones (expresiones regulares) incluidos y excluidos, uno por línea. Solo se reescriben los recursos locales que coinciden con los patrones incluidos.

## Servidor (htaccess)

Speed Pack puede escribir directivas de servidor entre marcadores dedicados en el archivo htaccess raíz:

- Compresión GZIP / Brotli
- Caché del navegador para los recursos (un año, immutable)
- Connection Keep-Alive

Las directivas se eliminan automáticamente al desinstalar. Si el archivo no tiene permisos de escritura, se muestra un aviso.

Si su servidor ya activa la compresión (por ejemplo mediante la configuración del servidor web), no es necesario duplicarla aquí.

## Base de datos

La limpieza elimina los carritos abandonados (sin pedido, más allá del número de días configurado) y sus filas huérfanas, las conexiones e invitados antiguos, así como las estadísticas de búsqueda y los logs antiguos.

Los pedidos nunca se tocan. Aun así, realice una copia de seguridad de la base de datos antes de la primera limpieza.

## Precalentamiento de la caché

El precalentamiento recopila las URLs de su sitemap y luego precalienta la caché, para que sus visitantes reciban siempre una página en HIT.

### Desde el back-office

Pestaña Panel: haga clic en **Recopilar URLs** y luego en **Precalentar**. Una barra de progreso sigue el avance por lotes.

### Mediante tarea CRON

Automatice la recopilación y el precalentamiento tras cada purga nocturna. El token se muestra en el Panel.

```
curl -s "https://su-tienda/module/datafireflyspeedpack/preload?action=collect&token=SU_TOKEN"
curl -s "https://su-tienda/module/datafireflyspeedpack/preload?action=warm&token=SU_TOKEN"
```

## Atributos de control en el tema

- `data-no-lazy` — desactiva el lazy load en una imagen o iframe (imagen LCP).
- `data-df-nodelay` — excluye una etiqueta script del Delay JS.
- `data-df-nodefer` — excluye una etiqueta script del defer.
- `data-df-nooptim` — excluye un bloque o un enlace de la minificación y la combinación.

## Importación / exportación de ajustes

Desde la pestaña Avanzado, exporte todos los ajustes en formato JSON para replicarlos en otra tienda, o importe un archivo existente.

## Resolución de problemas

### Una página permanece en MISS

Compruebe que navega como invitado (desconectado, carrito vacío), que el controlador está en la lista blanca, que la URL no está excluida y que no hay ninguna cookie de exclusión. Los empleados conectados al back-office nunca reciben una página en caché.

### Un diseño se rompe tras activar la combinación

Desactive la combinación CSS/JS, o añada el archivo problemático a las exclusiones correspondientes. La combinación está desactivada por defecto a propósito.

### Texto sin estilo al cargar (FOUC)

Active o complete el Critical CSS de la página afectada, y asegúrese de que el CSS asíncrono está activado.

### Un script deja de funcionar con el Delay JS

Añada su palabra clave a la lista de exclusión del Delay JS, o el atributo `data-df-nodelay` en la etiqueta.

## Desinstalación

La desinstalación elimina las directivas htaccess, vacía las cachés y borra los ajustes y la pestaña de administración del módulo.
