El sistema de caché completa de CloudFlare, también conocido como APO, es una funcionalidad de pago de esta CDN con la que servir todos los recursos de tu web desde la caché de CloudFlare, tanto los recursos propios como de terceros.
Normalmente, en la versión gratuita de CloudFlare solo puedes servir cacheados los recursos propios, pero activando el servicio APO de pago puedes además servir en caché recursos de terceros, acelerando aún más la carga de tus páginas.
Pues bien, como ya expliqué qué era eso de APO de CloudFlare y cómo activarlo para WordPress, por el módico precio de 5$ al mes, hoy vamos a ver un modo alternativo de conseguir lo mismo, pero totalmente gratis.
Activa tu sitio en CloudFlare
El primer paso es dar de alta tu sitio en CloudFlare, algo más sencillo de lo que puedas imaginar, que conlleva solo estos pasos:
- Darte de alta en CloudFlare.com
- Añadir tu dominio al plan gratuito
- Cambiar las DNS para usar las de CloudFlare
El proceso, en detalle y con capturas, lo tienes en esta guía…
Acelera WordPress sirviendo tu contenido desde CloudFlare CDN
Crea un token personalizado de la API de CloudFlare
Ve a la página de tokens de la API de CloudFlare, en este enlace, y crea un nuevo token. Vas a ver muchas capturas de pantalla pero en realidad es muy sencillo y no se tarda casi nada en hacerlo.
A continuación se mostrará una lista de tokens disponibles, elige crear un token personalizado.
En la siguiente pantalla tienes que rellenar algunos campos y añadir las reglas del token. Hazlo como en la siguiente captura:
Lo resumo aquí:
- Nombre del token: Ponle un nombre que lo distinga del resto y describa su función.
- Permisos:
- Cuenta -> Configuración de la cuenta -> Leer
- Cuenta -> Scripts de Workers -> Editar
- Zona -> Purga de caché -> Purgar
- Zona -> Reglas de página -> Editar
- Zona -> Configuración de zona -> Editar
- Zona -> Zona -> Editar
- Zona -> Rutas de Workers -> Editar
- Recursos de cuenta:
- Incluir -> Elige en el desplegable la cuenta que quieres cachear totalmente.
- Recursos de zona:
- Incluir -> Zona específica -> Elige en el desplegable el dominio de la cuenta que qu ieres cachear totalmente.
El resto de ajustes de la parte inferior no hace falta poner nada, así que pulsa el botón de «Ir al resumen».
En la siguiente pantalla revisa la configuración y, si todo está correcto, pulsa en el botón de «Crear token».
Ya hemos terminado, ahora tendrás una pantalla con el token de la API para copiarlo y usarlo más adelante.
Instala el plugin de super caché de CloudFlare
Ahora vamos al paso fundamental, y es instalar un plugin que consiga la caché completa de CloudFlare sin tener que pagar por ella.
Se llama WP CloudFlare Super Page Cache, es gratuito y se instala como cualquier otro plugin WordPress.
Una vez activo creará un nuevo menú de ajustes en Ajustes > WP Cloud Super Page Cache.
Añade tu token personalizado a los ajustes del plugin
En la página de ajustes vamos a configurar la conexión de nuestro sitio WordPress con la API de CloudFlare mediante nuestro recién creado token.
Como ves en la captura anterior, hay 3 datos fundamentales que debes configurar:
- Authentication mode: API Token
- Cloudflare e-mail: El correo con el que accedes a esta cuenta de CloudFlare.
- CloudFlare API Token: Pega aquí el token que creamos en el primer paso
El nombre de dominio lo completa el plugin automáticamente.
Si te fijas en la parte superior del plugin, se muestran los pasos para crear el token de la API que vimos antes, que ya hemos realizado llegados a este punto ¿verdad?
Bueno, guarda los ajustes pulsando en el botón de «Update Settings», que no se te olvide.
Activa la caché de página
Nada más guardar los cambios el plugin te mostrará el siguiente paso: activar la caché de página total de CloudFlare.
Ya estás tardando en pulsar el botón, no tiene pérdida, es grande, de color verde chillón y se llama «ENABLE PAGE CACHING NOW».
El resultado, tras unos brevísimos segundos, es el esperado: caché de página activa.
Revisa los ajustes del plugin
Nunca está de más comprobar que la caché está funcionando, y para eso encontrarás un botón para probarla.
A partir de aquí es importante que revises los muchos ajustes del plugin porque tiene configuraciones específicas de vaciado de caché, por ejemplo, que son muy importantes para tiendas online o sitios de membresía.
También encontrarás ajustes de compatibilidad con los principales plugins de caché, AMP y más. Conviene revisar en detalle los ajustes y hacer pruebas, como con cualquier plugin, de que todo funciona correctamente.
La caché completa de página puede ser muy agresiva, en el sentido de que tus visitantes no vean los nuevos comentarios, valoraciones, cambios de inventario o precios en productos, etc, así que es importante revisar bien los ajustes.
Por otra parte, la caché de página completa de CloudFlare es fantástica, mejora mucho los tiempos de carga de WordPress.
¿Funciona?
Pues sí, de hecho es el mejor modo de aprovechar CloudFlare, usar la caché de página completa, ya sea de pago con APO o gratis con los pasos que hemos visto en esta guía.
De hecho, gracias a las muchas configuraciones posibles que ofrece el plugin, los resultados de este método gratuito pueden ser mucho mejores que con
Los resultados de mejora de rendimiento son inmediatos…
Además es importante remarcar que el rendimiento de la caché completa de página de CloudFlare es muy consistente, ofreciendo muy buenos resultados en casi cualquier parte cubierta por los servidores de la CDN.
¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!
Hola, me ha parecido muy interesante el post, tendria dos preguntas. Por un lado manejo dos webs, ambas en siteground, en una de ellas uso el plugin de cache Swift perfomance (no se si lo conoce) pero si lo conoce valdria con configurar el token api en la opcion que tiene dicho plugin para evitar el instalar el plugin wp cloudflare…? Funcionaria igualmente o abria que instalar tambien el wp cloudflare?
En la otra tengo el plugin de sg optimizer del mismo siteground. Hace unos meses agregaron para activar una cache mejorada o nose ahora mismo como la nombra. Con esa opción seria igual que todo lo anterior o no tiene nada que ver, y aun con esa opcion es recomendable activar y personalizar todo. Gracias
Hola Ángel,
No tiene nada que ver, ni el Swift Performance ni la caché de SiteGround, esto añade unas reglas específicas a la caché de CloudFlare
Entonces es compatible con el plugin de SG, entiendo? Gracias Fer.
Claro, del todo, incluso tiene un ajuste de integración
Funciona de maravilla. Ahora mi web carga un poco más rápido y además no tiene casi variaciones en los testeos de velocidad. Gracias!
Hola:
¡Muchas gracias por compartir la información!
Consulta: ¿Cuál es la ventaja de usar el plugin y al API Token que mencionas en comparación de crear una «Page Rule» en Cloudflare con «Cache Everything».
Saludos,
Alvin
Pues que el plugin añade reglas a Apache y Nginx si es necesario, interactúa con otros plugins de caché, de optimización, aporta muchas ventajas
Que tal si uso Wp Rocket recomiendas alguna modificación?
El mismo plugin tiene una sección de preguntas y respuestas con recomendaciones exclusivas para cada plugin. Lo he traducido casi al completo, luego lo termino
Hola, Fernando
Gracias por el artículo.
Acabo de instalar el caché completo de cloudFlare en mi blog apismielera.com. Debería eliminar el plugin que tengo instalado Litespeed?
Un saludo.
No, son complementarios, lee la sección de FAQ del plugin 😉
Hola Fernando,
pues me quitas de encima tener que tomar la decisión de tener que eliminar Litespeed, recomendado po wp y de muy buen funcionamiento o el caché de CloudFlare.
CloudFlare lo instalé el día 1 de este mes y me sorprendió ver el montón de visitas que tengo por el mundo, casi 6000 al día.
A todo esto, estoy buscando el modo de monetizar el blog, hecho por mi y mis experiencias de apicultor.
¿Algún consejo?
A todo esto te comento que yo soy de Bilbao de nacimiento aunque ahora vivo en Polientes, Cantabria.
Estudié en el Instituto Central de Bilbao, Miguel de Unamuno hasta los 18 años. Luego la vida me llevó por otros derroteros y después de vivir en Brasil 10 años, dónde me casé, en 2016 regresé a Polientes.
Bueno, que no te quiero aburrir con mis batallitas.
Venga, pues un gusto leerte y saber de ti.
Un abrazo
Lo de monetizar el blog, mientras no tengas mucho tráfico o autoridad no te merece la pena ni intentarlo, es mucho esfuerzo para nada, decepcionante.
Promociónate primero con tutos en vídeo, conferencias, en medios tradicionales, lo que sea, luego monetiza.
Saludos de otro bilbaíno de nacimiento 😉
Gracias… Al leer que de esta forma Clouflare sirve una versión html completa del sitio, he eliminado la versión html creada mediante el pluging WP2Static… pero el tiempo de carga ha aumentado en 4 o 5 segundos… Probablemente se me escapa algo, pero no parece que Cloudflare este sirviendo una versión html completa…
Gracias de nuevo…
Tanto WP2Static como la caché completa de CF hacen lo mismo, crear un HTML que sirven, pero CF necesita que haya visitas para generar los HTML, salvo que uses el precargador de este plugin, que simula visitas para generar el HTML
Hola Fernando, muy interesante el post y los consejos que ofreces.
Tengo el site alojado en SiteGround active CloudFlare desde su web o sea no desde SG ya que me obliga a utilizar WWW cosa que no requiero, mi pregunta este plugin de CF no interfiere con el Optimizer de SG?
Nada,sin problema, yo lo tengo igual
Gracias por tu respuesta Fernando;
Te comento con el SG Optimizer no tengo problemas pero cuando intento activar la caché completa a través del Plugin «WP Cloudflare Super Page Cache», siguiendo las pautas que das y hago la prueba de caché me arroja este error:
CITO:
Error on dynamic page (https://xxxxxxx.com): Parece que tu web no está en CloudFlare. Si has activado recientemente la caché o si es tu primera prueba, espera unos 30 segundos e inténtalo de nuevo, porque los cambios tardan unos pocos segundos en que CloudFlare los propague en la web. Si persiste el error solicita soporte para conseguir una prueba detallada.
(si esta en CloudFlare).
Error on static resource (https://tecnoprogramas.com/ifomodak/wp-cloudflare-page-cache/assets/testcache.html): Parece que tu web no está en CloudFlare. Si has activado recientemente la caché o si es tu primera prueba, espera unos 30 segundos e inténtalo de nuevo, porque los cambios tardan unos pocos segundos en que CloudFlare los propague en la web. Si persiste el error solicita soporte para conseguir una prueba detallada.
FIN DE CITA
Alguna idea sobre que puede estar pasando?
Gracias
Hola, Fernando. Feliz Año. Muchísimas gracias por la labor de este blog y de este artículo. He configurado e instalado todo en mi sitio web leganex.es y me surge una pregunta: ¿recomiendas activar la caché de página de reserva y añadir reglas de caché del navegador? Me pide tener el archivo wp-config en modo escritura y me da un poco de miedo, ya que DINAHOSTING lo mantiene en solo lectura. ¡Mil gracias!
Si no tienes aplicadas reglas de rewrite por otro plugin sí es recomendable la caché de reserva, totalmente, que añade una serie de reglas a .htaccess
Hola Fernando,
Excelente blog, felicidades.
Funciona para subdominios?
Gracias