284 | ¿Qué es el cache? Repaso a fondo de esta tecnología

En el episodio 284 de WordPress semanal hablamos del guardado en caché. Te explico qué es y cómo utilizar esta tecnología desde el punto de vista de la gestión de webs con WordPress. Vamos allá. Hola hola, soy Gonzalo de Gonzalo Navarro es y bienvenidos a WordPress Semanal, el podcast en el que aprendes WordPress de principio a fin. Porque ya lo sabes, no hay mejor inversión que la de aprender a crear y gestionar tus propias webs con WordPress. Y hoy vamos a hablar de un tema un poco técnico pero que como tal necesita de una explicación. Y la primera parte de este episodio va a estar enfocada a definir qué es esto y a por qué tenemos que tenerlo en cuenta cuando gestionamos nuestra propia web con WordPress o en qué términos tenemos que tenerlo en cuenta. Y después te hablaré específicamente de cómo implementar el caché en WordPress, qué opciones tienes que de esto sí tengo mucho más contenido, así que te iré diciendo dependiendo de lo que más te encaje, pues dónde puedes ir a aprender más sobre un plugin en cuestión o lo que sea. Así que por un lado la primera parte, definición y uso del caché en la web y la segunda, el caché en webs con WordPress. Son las dos partes fundamentales de este episodio. Y en un momentito entramos con ellas. Pero antes, como siempre, novedades. ¿Qué está pasando en Gonzalo Navarro es esta semana? Pues por un lado tenemos un nuevo vídeo de la zona código, es el vídeo ya 234 y en él aprendes a añadir campos personalizados al checkout de del plugin Easy Digital Downloads. Ya sabes que este plugin es pues el mejor para vender productos digitales en tu web con WordPress. Básicamente creas un ecommerce, una tienda online de productos digitales. Y tenéis un curso completo que de hecho amplié hace poco con extensiones avanzadas y demás. Y es uno de esos cursos que voy ampliando, al igual que otros, que conforme veo que hay interés pues le añado más clases, clases más avanzadas y también ahora voy a empezar a sacar algunos vídeos. Por cierto, si os gusta y queréis que saque más todavía, me lo comentáis desde vuestra cuenta. Los que seáis suscriptores ya sabéis, me podéis sugerir lo que necesitéis. Y en este vídeo, como digo, te enseño con un poquito de código a añadir un campo personalizado al checkout, es decir, cuando la gente va a poner sus datos para ya registrarse y hacer el pago, pues como en todo, como en todos los servicios de venta online, pues aparecen una serie de campos que tienen que rellenar, el nombre, el correo y demás. Pues si quieres añadir uno extra, uno personalizado, te enseño a hacerlo en este vídeo. Simplemente copias el código, lo pegas como te muestro en el vídeo y lo tienes y además hacemos el proceso completo. Te enseño a hacer el campo obligatorio si así lo quieres, a mostrar un error si no se cumplimenta ese campo, a guardar la información de ese campo que se está rellenando, porque eso es importante, a guardarla en la parte del pago con el resto de información del cliente. Nosotros en el vídeo utilizamos el ejemplo de teléfono, el campo teléfono, que es bastante habitual querer incluirlo. También te enseño a añadir esa información en el ejemplo que estamos siguiendo, el número de teléfono en la página de detalles del pedido y para crear, y también te explico cómo crear una etiqueta para poder mostrar el teléfono si tú quieres, por ejemplo en un email que envíes automáticamente a tu usuario, lo típico que tú pones una etiqueta para recoger de forma automática el nombre del usuario cuando envías un email, lo típico hola, y pones una etiqueta y ahí va recogiendo, dependiendo de a quién se envíe, pues recoge el nombre de usuario o el nombre de la persona. Pues lo mismo pero con el campo teléfono. Te enseño también a dejar esa etiqueta creada por si quieres utilizarla. Sí, pues te voy a dejar este vídeo en la parte de enlaces, al igual que otros enlaces muy muy relacionados con este episodio. Bueno, tienes por supuesto el curso más reciente publicado, también lo tienes en la parte de enlaces de contenido recomendado, que es el curso del editor de Guttenberg, que lo renové hace muy poquito. Y luego como cursos relacionados te dejo el curso de WP Rocket, que es un plugin de caché, que es el tema del que vamos a hablar. Te dejo el curso de velocidad y seguridad en SiteGround, la parte de velocidad, hablamos del caché si utilizas este hosting, el hosting de SiteGround. Y te dejo también un tutorial premium, bueno, es un episodio del podcast en el que te hablo del plugin WP Optimize, que es un plugin también de caché y optimización y tiene un extra al final que es un vídeo para todos los que seáis suscriptores, en el que explico cómo utilizar y configurar este plugin. Todo esto en la parte de enlaces, en la parte de contenido recomendado, a donde podéis ir de forma muy sencilla tecleando en vuestro navegador. Gonzalo Navarro es 284, que es el número de este episodio. Sí, fantástico. Esto en cuanto a las novedades. Después tenemos el plugin de la semana que se llama WooCommerce Country Catalog. Este plugin lo encontré porque un suscriptor me preguntó si era posible mostrar distintos catálogos en WooCommerce, en una tienda online hecha con WooCommerce, dependiendo del país desde el que acceda el cliente en cuestión. Así que estuve haciendo una búsqueda, porque no se me había planteado nunca esta pregunta a través del soporte que tenéis todos los que estáis suscritos, y di con un plugin que hace esto y que está muy bien, que como digo se llama WooCommerce Country Catalogs y puedes crear distintos catálogos y geolocalizarlos de forma que dependiendo de si alguien viene de España, de Portugal, de lo que sea, pues se los muestras diferentes. Esto es muy útil porque muchas veces se envían desde sitios distintos dependiendo de en qué país te lo compren, pues tú tienes un almacén en un sitio, lo tienes en otro, o tienes un acuerdo con alguien que los envía de un sitio o que los envía de otro, o que los precios son diferentes, a lo mejor los precios para un país son más caros porque te cuesta más caro enviarlos y para otros son más baratos porque te cuesta más barato. Así que es un plugin que está bastante bien, apenas está activo en 300 webs con WordPress, es muy específico porque lo que cuesta es una necesidad también muy concreta, entonces tiene sentido, tiene buenas valoraciones y lo mantienen activo regularmente. Así que lo dejo también en la parte de las notas del episodio. Recuerda Gonzalo, es 284. Perfecto, pues ahora sí, vámonos con el tema central de este episodio. Todo lo que hay que saber sobre el guardado en caché enfocado a WordPress. Bien, vamos a empezar con la definición y el uso del caché en la web. ¿Qué es esto del caché? Bueno, el caché dicho de forma llana, lo que hace es recoger datos procesados y almacenarlos para utilizarlos más tarde, o muchas veces escucharás guardado en caché o cacheo, esto es el proceso, el proceso de almacenar información para mostrarla o cargarla después. Y no tiene por qué ser en el navegador, que es lo que escucharás más habitualmente, pero es que en lo que nos centramos, sobre todo cuando hablamos de caché, aunque ahora vamos a ver que este proceso de caché o de guardado en caché se produce en diferentes lugares. Y si bien el caché no es obligatorio que lo uses, yo creo que prácticamente es necesario en la mayoría de aplicaciones webs y por supuesto en la mayoría de páginas web. Y una buena implementación de este sistema de guardado en caché puede hacer que recupere segundos de carga en una aplicación o en este caso más enfocado en en tu página web. Bien, y entrando un poquito más de lleno en esto del caché, en la optimización de páginas web, ¿Por qué se usa? ¿Por qué se habla tanto? Bueno, está claro que la tecnología avanza y cada vez hay ordenadores más potentes, con lo cual cuando hay ordenadores más potentes, se crean aplicaciones más pesadas, más potentes, que pueden hacer más cosas y también se crean webs más pesadas, sobre todo ahora que está muy de moda incluir dentro de una propia web, por ejemplo con WordPress, la posibilidad de que el usuario final tenga herramientas para diseñarla, tenga herramientas para controlar sus funcionalidades. Por ejemplo, en WordPress podemos construir visualmente nuestra web con Wix se puede hacer también con casi cualquier sistema de gestión de contenidos o sistema de creación de webs, el usuario final, ya no el desarrollador que la hace desde el principio, sino el que la va a usar, ya puede hacer muchísimas cosas directamente en la propia aplicación o directamente en la propia web. Con lo cual esto requiere más código, requiere que se carguen más cosas, requiere más tecnología y por lo tanto tenemos webs más pesadas. Pero claro, esto entra en contraposición con que Google, por ejemplo, que es el motor de búsqueda por excelencia, considera la velocidad de carga uno de los factores principales que tiene muchos para rankear una página web. Es decir, la velocidad de carga es importante para el SEO, dicho así a grandes rasgos. Y aquí es donde entra el caché como uno de esos factores o como una de esas herramientas que a nosotros como gestores de una web, nos permite mejorar la velocidad de carga, nos permite lidiar con todo eso que yo te comentaba que hace una web más pesada, pues lo aligera con este sistema que yo te digo que lo que hace es guardar procesos o guardar información que normalmente es repetitiva, que se van a hacer muchas veces y de esa forma, cuando se requiere esa información o cuando se requiere ese proceso, ya está guardado en el lugar donde se tiene que hacer. Por ejemplo, en un navegador. Si ya se guarda en el navegador y información, cuando alguien va a acceder a ese contenido la siguiente vez, pues pum. Ya lo tienes en el navegador. Simplemente tiene que ir del navegador a mostrártelo en pantalla o del navegador a hacer el proceso. Hablo del navegador, ahora veremos que hay más partes de la web que usan caché, pero hablo del navegador porque es lo que yo creo que más fácil se puede entender para nosotros que gestionamos webs, en este caso con WordPress o cualquier otra web, pero como digo, este proceso se hace en otros lugares para que también vaya todo más rápido. Bien, entonces vamos a mencionar antes de seguir, en qué partes de la web se usa el caché. No voy a explicar demasiado estas partes porque creo que puede liar más que otra cosa, pero bueno, si sigues, si quieres empaparte más, pues no tienes más que buscarlo en Google y encontrarás un montón de explicaciones al respecto, pero sí que quiero mencionarlas. Bien, como hemos dicho, el guardado en caché se utiliza en los navegadores. Los navegadores de hecho tienen una característica que se llama caché del navegador y es lo que casi todos conocemos cuando hablamos de caché. Y básicamente lo que hace es almacenar o guardar peticiones recurrentes, peticiones que se hacen muy a menudo en la memoria del navegador, es decir, en el propio navegador, por ejemplo en Google Chrome. De forma que la siguiente vez, es decir, la primera vez que alguien accede a esa web, se guarda en el navegador y la siguiente vez que esa persona accede ya está guardado en el navegador, con lo cual el proceso o la carga la hace súper rápida. Un cuando nosotros accedemos a una página de cualquier web hecha con WordPress, hay un proceso que es ir a la base de datos y ver qué entradas hay, qué entradas de WordPress hay, qué contenidos nuevos hay de la base de datos, se descarga en el navegador, el navegador hace su proceso y te lo muestra en pantalla. Dicho así rápido y seguramente mal, pues eso, si ese proceso ya se guarda previamente, la siguiente vez que alguien llegue va a ser mucho más rápido. Bien, eso es en los navegadores, pero también hay caché, por ejemplo, en los dispositivos. Muchas veces los propios navegadores o las aplicaciones utilizan el espacio que tiene la memoria RAM o la memoria de almacenamiento que tiene tu iPhone, tu ordenador, para guardar también ahí información, es decir, la guardan en el propio dispositivo, no sólo en el navegador. De esa forma, lo mismo cuando se va a acceder la siguiente vez, como ya está guardado de forma local, digamos, se va a cargar mucho más rápido. Las aplicaciones, por ejemplo, también las aplicaciones de tu móvil o las aplicaciones de ordenador también hacen uso del caché y muchas veces se va a fundir con lo que te comento de guardar información en tu propio dispositivo. Servidores, Esto es un poco más complejo, pero hay servidores que utilizan un sistema de caché aparte de lo que traiga el propio servidor. Hay uno que se llama Rediscache, que se usa en WordPress también y es para guardar objetos a nivel de código nativos de WordPress, es decir, que se usan siempre, los guarda en caché, porque como se sabe que se utilizan siempre, no son nuevos, pues se pueden guardar en caché, no hay que hacer todo el proceso de petición, sino que se guarda en caché, queda guardado y después se puede reutilizar. Esto ya es un poco más avanzado, pero bueno, quiero mencionarlos. Y por último, los DNS, el cacheo de los DNS, vamos, esto lo que hace simplemente es guardar información para que todo el proceso de los servidores de dominio vaya más rápido. Tampoco quiero entrar en demasiado detalles en esto. Bien, una vez he cubierto qué partes de la web usan el caché, quiero hacer una parte sobre las CDN, lo que en inglés se llama Content Delivery Network y que he hablado de ello en episodios anteriores. No sé si incluso tengo un episodio al respecto, ahora lo buscaré y si lo encuentro pues lo pongo también en la parte de contenido recomendado, en la parte de enlaces. Pues bueno, a priori puede confundir o puedes pensar que una CDN hace lo mismo que la caché, pero realmente es diferente. Una CDN guarda una web entera, por ejemplo, como archivos estáticos, pero no trabaja directamente con ella como en el caso del guardado en caché. Es como hacer una copia de tu web y almacenarla, pero no es lo mismo que por ejemplo, cuando alguien accede a mi web, si yo tengo un sistema de caché implementado, tú accedes a mi web desde tu casa y en tu navegador pues se guarda cierta información para que la siguiente vez sea más rápido, pero no se hace una copia de mi web en ningún lado. Es diferente. ¿Y por qué la CDN hace esta copia de la web y la guarda en un servidor? Bueno, porque eso está pensado para entregar contenidos más rápidamente a otras partes del mundo, a zonas que están lejos de donde tú tienes tu web en un servidor. Imagínate que yo tengo un hosting contratado con SiteGround y que lo tengo en Europa, pero que luego alguien de América quiere acceder a mis contenidos. Si yo tengo una CDN lo que puedo es tener copias de ese contenido en servidores, por ejemplo en América, de forma que se va a entregar más rápido a mis visitantes de América. Eso es el pensamiento detrás de una CDN. Y de hecho una CDN sigue necesitando de un sistema de caché para que se entregue más rápido, porque aunque se cree una copia de esa web en un servidor en América, si yo encima le tengo un sistema de caché, pues además de entregarse desde América, se va a guardar información en el navegador de esa persona de su casa en América y va a tener una experiencia más rápida. Es decir, incluso utilizando una CDN si es que no todo el mundo tiene que usarla, si tú por ejemplo tienes servidor en Europa y te diriges sólo a gente de Europa o gente de España, no necesitas una CDN. Ahora, si vas a todo el mundo y tu web no está en un servidor o no está en servidores de todo el mundo, sí es buena idea tenerlo para que todo el mundo tenga buena experiencia al recibir tu web. Y como digo, se puede combinar con el caché. De hecho servicios muy populares de CDN como Cloudflare te ofrecen las dos cosas, CDN y caché, para que no solo se entregue desde servidores más cercanos a todo el mundo, sino que encima tenga un sistema de caché implementado. Espero que esto en lugar de liarte te haya aclarado un poco la diferencia. Bien, una vez visto la parte técnica, la parte más compleja, vamos con la aplicación práctica. ¿Qué pasa con el caché en webs con WordPress? Bueno, para usar el caché en WordPress, lo mejor o la mejor opción es hacerlo a nivel de servidor, es decir, que tu hosting, tu servicio de hosting ya ofrezca este servicio de caché o de cacheo. Por ejemplo, muchos hostings ya lo ofrecen, algunos de forma muy avanzada y muy vinculado con lo que es WordPress y entendiendo cómo es WordPress para poder implementar la mejor forma de caché posible. Por ejemplo SiteGround, si tú tienes tu web en SiteGround tienes opciones de caché como vemos en el curso cuando vemos las herramientas de velocidad de SiteGround, una de ellas es el caché, pues ahí tienes opciones para para activarlo a nivel de servidor, a nivel de las opciones del hosting y luego tienes un plugin para todas las partes que a lo mejor no tienen tanto sentido controlarlas a nivel de servidor, las puedas controlar desde el panel de administración de tu web, incluso excluir algunas páginas de que sean cacheadas para evitar errores, como por ejemplo si tienes una página de carrito o de pago, no es recomendable que ahí haya caché, porque recuerda que el caché lo que hace es guardar información o guardar procesos para hacerlos más rápido, pero en una ventana esto no nos conviene o no nos conviene guardar casi nada porque va a ser información nueva, porque van a poner datos de un usuario, porque van a poner datos de la tarjeta de crédito y además no queremos que en la venta pueda ocurrir ningún error de que se muestre información antigua ni nada, pues todo esto es interesante también que lo puedas controlar. Entonces como digo, hostings como SiteGround o Kingsta por ejemplo, que se usa más en América, pero que está entrando poco a poco también en Europa y otros hostings traen opciones de caché muy potentes. Por ejemplo como te digo, SiteGround ya por defecto cuando contratas un plan viene con un sistema de caché ya activado que ellos llaman Engines Direct Delivery para entrega de contenidos más rápido, sobre todo para ciertos elementos como por ejemplo las imágenes que se carguen desde la memoria del servidor, es decir, se guardan en memoria y como es ese servidor desde el que tú ofreces todo, pues las muestra mucho más rápido. Pero cuando vas a notar ya la parte del caché es cuando empiezas con el caché dinámico, con el servicio que tienen ellos de guardado en memoria del caché, que esto es a partir de sus planes de Grow Big y es decir, el básico no lo tiene, pero los otros dos siguientes sí lo tienen. Bueno, esto no me quiero adentrar mucho más en detalle porque tenéis un curso donde hablo de todo esto, incluso un episodio del podcast. Bien, ¿Qué pasa si no estás en uno de estos hostings que te ofrecen ya opciones de caché y que te ofrecen su propio plugin y demás? Bueno, hay otros plugins de caché, los hay muy buenos, los hay gratuitos también que están muy bien, por ejemplo para mí de los que he probado el mejor gratuito es WP Optimize, del que tenéis un episodio del podcast y además un tutorial premium, como te comenté al principio. Luego de los de pago, no sé si el mejor, pero el más popular es WP Rocket, del que también tenéis un curso completo y un episodio del podcast, por supuesto. Luego hay otros más típicos que a lo mejor no tienen tan buen marketing pero que se utilizan mucho, como por ejemplo W Super Cash, que este es, vamos, facilísimo de usar. Explico su uso en el curso de WordPress intermedio, en la primera clase, de hecho en plugins esenciales de WordPress, ahí si no recuerdo mal, creo que es en el minuto 9 aproximadamente, explico cómo utilizar este plugin de caché gratuito, que es de los más fácil, tiene muy pocas opciones, básicamente activas el caché y listo, lo guardado en caché y listo. Si quieres tener más control, más opciones, entonces de los gratuitos sin duda te recomiendo WP Optimize. Todo lo que estoy comentando tiene enlaces, en la parte de enlaces recuerda Gonzalo es 284. Bueno, si a lo mejor alguna de las partes técnicas que he comentado te parecen demasiado o te dan más igual, con lo que te tienes que quedar es que el guardado en caché es prácticamente esencial para acelerar la carga de tu web y para que la experiencia de tus visitantes sea mejor. Y que en WordPress tienes soluciones que están muy bien para implementarlas o para implementarlo. En este caso el caché tienes opciones gratuitas, que está muy bien, tienes opciones a nivel de tu hosting o si quieres invertir en un plugin premium también lo tienes, como en este caso WP Rock. Sí, fantástico. Pues nada más por este episodio, espero que te haya gustado. Si es así y quieres echarme un cable, ya sabes que puedes compartirlo con alguien a quien pienses que le puede interesar o publicarlo en tus redes sociales. Incluso si quieres puedes dejar una valoración en la plataforma de podcast desde la que estés escuchando, en apple Podcast, en iVoox puedes dejar un comentario, si me escuchas desde Spotify tienes opciones para compartirlo de forma muy sencilla, por ejemplo en tus stories de Instagram, lo que más te apetezca. Si quieres, como digo, aportar un poquito a este podcast y que otros como tú lo puedan conocer, pues te lo agradezco muchísimo. Nada más por este episodio, nos seguimos escuchando. Adiós.