Instrucciones y consejos para configurar el complemento WP Rocket , que puede acelerar visiblemente su sitio de WordPress.
que es un cache
Caché es una palabra que se usa con tanta frecuencia últimamente que incluso mi abuela está hablando lentamente de ella. Caché es el nombre de temporal o caché de la computadora y del servidor.
En lugar de tener que volver a cargar toda la página web (que se descarga del servidor de manera efectiva), ciertas partes que no cambian se cargan desde esta memoria.
Así, se produce una disminución del flujo de datos entre el cliente y el servidor, lo que se asocia a una menor cantidad de datos transferidos y, en particular, a una mayor velocidad de carga de la página.
Caché del lado del servidor
Cada servidor promedio tiene su propio sistema de caché. El servidor suele recordar imágenes guardadas, archivos CSS y JS que son comunes a toda la página.
En lugar de enviar siempre el logotipo guardado al cliente, solo envía información de que el cliente ya tiene el logotipo guardado y, por lo tanto, puede usarlo.
Esto se aplica a la mayoría de las imágenes de la página. Es posible que alguna vez haya enfrentado el problema de seguir viendo la imagen anterior incluso después de reemplazarla por una nueva. Así que el caché tiene la culpa.
Durante el desarrollo del sitio web, por supuesto, debemos deshabilitar el caché, porque necesitamos ver los cambios realizados de inmediato. Esto lo puedes hacer del lado del servidor, en el panel de control de tu hosting.
Caché del lado de la página
También podemos configurar el caché en el lado de WordPress. Aunque se llama caché, en realidad solo se realiza la optimización de los códigos utilizados y otros archivos.
Podemos utilizar varios plugins para este fin. Algunos de ellos son gratuitos y en su mayoría cubren solo la funcionalidad básica. Muchos tienen versiones pagas o se pagan desde cero.
En este artículo, nos centraremos en el complemento WP Rocket, que se paga, pero definitivamente puedo clasificarlo entre los mejores complementos de optimización de velocidad con la conciencia tranquila.
¿Cómo obtener WP Rocket? cual es su precio
Obtenemos WP Rocket exclusivamente de su sitio web oficial . En términos de precio, tenemos tres planes para elegir: INDIVIDUAL por $ 49 por año, lo usaremos para un sitio web. Usaremos el plan PLUS de $99 para tres sitios y el plan INFINITE de $249/año para una cantidad infinita de sitios web (ideal para desarrolladores que hacen muchos sitios).
Después de completar la información de facturación y pago, recibiremos un archivo .zip para descargar, que contiene nuestro complemento y licencia. Subimos el complemento a nuestro sitio a través de wp-admin (Complementos-> agregar nuevo-> cargar complemento). Después de una instalación exitosa, no olvide activar el complemento.
Instrucciones para configurar el complemento WP Rocket
En la práctica, ya me he encontrado varias veces con que una persona instaló un complemento de caché y no notó ningún cambio. Por supuesto. TENER un complemento de caché es bueno, pero es como tener una licencia de conducir (pero no conducir). Para mejorar el rendimiento y optimizar la velocidad, necesitaremos configurar WP Rocket.
Se puede acceder a la configuración de WP Rocket en wp-admin a través de la columna principal izquierda en la sección Configuración –> Cohete WP . Hacemos clic. Se nos mostrará un tablero de anuncios y muchas opciones diferentes, a primera vista aterradoras. Vamos a repasarlos uno por uno.
Tablero de mandos
Tablón de anuncios. Aquí se muestra información básica sobre su cuenta, licencias, etc. Tenemos la opción de activar «Rocket Analytics» aquí, lo que significa que algunos datos se enviarán a WP Rocket HQ. Esto puede ayudar a los desarrolladores de complementos.
Cache
Configuraciones básicas para el caché.
Podemos activar/desactivar el almacenamiento en caché móvil , recomiendo dejarlo activado. También podemos separar archivos de caché por separado para PC grandes y por separado para móviles. Personalmente, nunca hago esto porque no veo ninguna razón para hacerlo.
Habilitar el almacenamiento en caché para los usuarios de WordPress que han iniciado sesión activa el caché para los usuarios que han iniciado sesión. No es necesario para páginas más simples y de presentación, pero si tiene una página donde los usuarios inician sesión (por ejemplo, una tienda electrónica), esta función puede ser útil. Básicamente, el usuario que ha iniciado sesión no utiliza la memoria caché (se supone que el usuario que ha iniciado sesión es un administrador del sitio web, que debería ver la página sin memoria caché para poder comprobar los cambios inmediatamente). Cuando marque esta casilla, los usuarios registrados también utilizarán la memoria caché.
Vida útil de la memoria caché : aquí establecemos el período de tiempo después del cual la memoria caché debe limpiarse automáticamente. Después de hacer clic en «Minutos» basta con seleccionar la hora y el día. Siempre dejo el valor predeterminado establecido, pero, por supuesto, depende de usted. Entonces, si alguna vez realiza un cambio, no comienza a aparecer de inmediato, debe «vaciar» el caché manualmente, es decir, restablecerlo. Si lo olvida, se restablecerá automáticamente después del tiempo especificado aquí.
El caché se puede borrar manualmente a través del panel de administración (la franja negra en la parte superior), busque el elemento WP Rocket y haga clic en Borrar caché para vaciar todo el caché. Esto comenzará a mostrar los cambios en todas partes, incluso a los usuarios que no hayan iniciado sesión.
Optimización de archivos
Probablemente la parte más interesante. Aquí establecemos cómo WP Rocket debe procesar los archivos que componen el sitio web.
Ajustes básicos
Minimizar HTML : minimiza el código fuente HTML de la página eliminando saltos de línea o espacios innecesarios. Poco eficaz, pero prácticamente no hay nada que salga mal aquí. Siempre lo enciendo.
Optimice las fuentes de Google : definitivamente déjelo activado, mejorará la carga de las fuentes de Google, que casi seguramente usará.
Nota: En las versiones más recientes de WP Rocket, la configuración básica ya no está disponible (ya no es relevante).
Archivos CSS
CSS es el lenguaje con el que, en términos simples, se configura la apariencia de la página. En un universo ideal, cada página contiene un solo archivo .css donde se configura todo el material visual. Pero esto ciertamente no es cierto en WordPress. Dado que WordPress es una plataforma compleja y consta de temas y complementos, casi todos los complementos tienen sus propios archivos CSS (y rara vez solo uno). Como resultado, carga varias decenas de archivos CSS cada vez que se carga la página.
Minificar archivos CSS: minimiza los archivos .css eliminando sangrías y espacios. Similar a la minificación de HTML. Dado que hay más archivos CSS, esta configuración es casi imprescindible.
Combinar archivos CSS : lo que hará esta configuración es revisar todos los archivos .css que usa la página y crear un archivo grande (solo uno). Entonces, acerquémonos al estado del universo ideal: carga solo un archivo .css, aunque sea más grande. Definitivamente es necesario habilitar esta opción.
Optimizar la entrega de CSS : también activo esta configuración. Hará que el CSS se cargue «asincrónicamente», es decir, independientemente del resto del contenido de la página web.
Por supuesto, para que no sea tan fácil, configurar la combinación de archivos CSS puede causar errores visuales en la página (los llamados errores). En ese caso, es necesario averiguar qué está causando el problema e incluir el archivo .css específico en «Archivos CSS excluidos».
Archivos Javascript
Como en el caso de CSS, también podemos optimizar archivos Javascript.
Minify y Combine se comportan de la misma manera que CSS
Eliminar jQuery Migrate : jQuery Migrate es una función auxiliar de jQuery que lo alerta sobre las incompatibilidades entre las versiones de jQuery y los complementos o temas de terceros. Desde WordPress 5.5, ya no se usa, por lo que puedes desactivarlo.
Cargar JavaScript diferido : básicamente hará lo mismo que la entrega de Optimize CSS: el javascript se cargará independientemente del resto de los archivos en la página.
Nota: si usa el protocolo http2, no es necesario combinar archivos CSS o JS.
Los medios de comunicación
En esta sección configuraremos imágenes, videos y otros contenidos multimedia.
Carga lenta
Lazy Load es una función que ralentiza la carga innecesaria de imágenes que no se ven inmediatamente en la página. Esto provocará un aumento significativo de la velocidad, ya que las imágenes solo comenzarán a cargarse cuando te acerques a su ubicación. Entro en www.wp.sk y en la parte inferior del pie de página está el logotipo de wp.sk, que en realidad es una imagen.
La carga diferida hará que la página se cargue sin esta imagen. Solo cuando nos acercamos al pie de página girando la rueda del mouse, la imagen se carga en segundo plano y se muestra. Hasta entonces, no es necesario. Sin carga diferida, toda la página se carga desde el principio.
Habilitar para imágenes : habilita la carga diferida para imágenes.
Habilitar para iframes/videos : habilita la carga diferida para videos e iframes. Iframe se usa a menudo, p. en el caso de un feed de Facebook, o al insertar un video de YouTube o contenido de otro sitio.
Reemplazar iframe de YouTube con imagen de vista previa : reemplaza un video descargado con una imagen de vista previa (por ejemplo, si nos desplazamos rápidamente al lugar donde debería estar el video y no ha tenido tiempo de cargarse en segundo plano).
emoticonos
Los emojis son una parte bastante inútil de WordPress, pero en algunos blogs pueden encontrar su aplicación. En realidad, son smileys (emoticonos) que WordPress convierte automáticamente en forma gráfica. Si no lo necesita, puede apagarlos fácilmente.
incrustaciones
Deshabilite las incrustaciones de WordPress : evita que otros «saquen» parte de su sitio a sitios externos. Recomiendo dejarlo puesto.
Compatibilidad WebP
Establece el almacenamiento en caché para imágenes WebP. WebP es un formato de imagen relativamente nuevo diseñado principalmente para su visualización en Internet. La imagen es más pequeña en tamaño pero comparable en calidad a jpg. Cada jpg y png se puede convertir a WebP, a través de algún convertidor, y cargarlo en la página. Sin embargo, si no está utilizando WebP, no es necesario habilitar esta configuración.
Precarga
Como mencioné anteriormente, WP Rocket funciona al estilo de crear archivos personalizados (principalmente .css y .js) que luego se usan en la operación en vivo del sitio web, en lugar de los originales. La precarga es la función que activa esta generación de archivos. Lo mismo ocurre con la regeneración de archivos ya creados si hay un cambio en la página (por ejemplo, agregar un nuevo artículo, etc.).
Aquí recomiendo dejar «Activar precarga», así como «Activar precarga de caché basada en mapa del sitio», «Mapa del sitio XML de Yoast SEO» (si usa el complemento Yoast SEO) y también «Habilitar precarga de enlace». Esto es suficiente para el 99% de los sitios web.
Reglas avanzadas
Aquí estableceremos reglas avanzadas para WP Rocket. Por ejemplo, podemos especificar subpáginas, archivos, etc. aquí. que nunca debe almacenarse en caché. Podemos establecer una excepción al almacenar cookies en caché, o según el navegador utilizado.
Dentro de WP Rocket, es posible utilizar los llamados comodines, es decir, el comodín asterisco *. Si necesitamos, p. para eliminar todo el complemento del almacenamiento en caché, digamos Contact form 7, no tiene sentido enumerar 10 archivos .css uno debajo del otro, que se encuentran en la carpeta contact-form-7. Usaremos un comodín en su lugar, algo como esto:
Wp-content/plugins/contact-form-7/* que garantiza que toda la carpeta (y, por lo tanto, todo el complemento) permanezca sin almacenar en caché.
Base de datos
En esta sección, podemos acelerar el sitio muy bien en algunos casos, pero pasa factura. Aquí podemos realizar los llamados limpiando la base de datos de datos aparentemente innecesarios. WP Rocket recomienda realizar una copia de seguridad de la base de datos antes de realizar dichas operaciones de base de datos.
Aquí podemos eliminar revisiones, borradores automáticos, publicaciones de la papelera, comentarios no aprobados, transitorios, optimizar tablas y configurar la limpieza automática.
Al crear cada subpágina o artículo en WordPress, se guardan tantas revisiones como hagamos clic en el botón ACTUALIZAR. Para sitios grandes que contienen principalmente artículos, esto puede ser un gran problema, considerando que puede haber varios millones de revisiones. Al eliminar estas revisiones, facilitaremos mucho la vida de la base de datos, pero perderemos la posibilidad de volver a versiones anteriores del artículo o subpágina.
CDN
CDN significa Red de entrega de contenido. Lo estás usando y es posible que ni siquiera lo sepas. A nivel de código de una página web, hay varias bibliotecas que generalmente se usan para crear una página web.
Un ejemplo típico puede ser jQuery o las fuentes de Google. La ventaja es que el visitante de su sitio web probablemente ya tendrá jQuery descargado de otra página en su PC, por lo que su navegador no tiene que volver a extraer el archivo jQuery del servidor, sino de su caché, al mostrar la página.
Esto afectará la velocidad del sitio web. Sin embargo, en realidad, estos son solo unos pocos archivos de kilobytes, que no tendrán un impacto extremo en la velocidad cuando se trata de un sitio web clásico.
Latido del corazón
Heartbeat es una funcionalidad incorporada de wordpress. Este es algún tipo de «impulso» regular, en base al cual las solicitudes ajax se envían al servidor a intervalos regulares (una vez por minuto).
Se utiliza para las notificaciones que se muestran en el entorno del administrador, para el guardado automático de artículos y subpáginas, para bloquear el contenido cuando lo edita otro usuario (aparece la proverbial tabla «Usuario #nombre edita este artículo»).
Personalmente, nunca he tenido un problema con esto, ni lo he tratado. En teoría, puede desactivar Heartbeat aquí, pero ciertamente no lo recomiendo, ya que interfiere con la funcionalidad integrada de WordPress, sin mencionar los complementos utilizados, que pueden quedar inutilizables. Por lo tanto, limitar esta configuración solo es relevante para algunos complementos débiles.
Complementos
Opción para instalar otros complementos que funcionan con WP Rocket y garantizar una velocidad aún mejor.
Optimización de imagen
Ya debe pensar en la optimización de imágenes al crear un sitio web, o al subir contenido. La decencia dicta no poner una imagen de más de 300kB en la página. El tamaño FullHD (es decir, 1920×1080) es completamente suficiente para la mayoría de los sitios web. Definitivamente no recomiendo subir imágenes SLR gigantes a la web (por ejemplo, 6000×4000).
Aunque WordPress aún los recortará a un tamaño de 4K, el tamaño de los datos de la imagen es más importante que las dimensiones. En realidad, solo hay unas pocas excepciones cuando es necesario utilizar una imagen de datos de gran tamaño.
Para tales imágenes, sin embargo, siempre usamos su miniatura y la imagen completa solo cuando hacemos clic en ella (por ejemplo, al abrirla en Lightbox). En cualquier caso, WP Rocket no incluye la opción de optimizar imágenes, pero funciona muy bien con el complemento Imagify .
Otro complemento muy conocido para optimizar imágenes es EWWWW Image Optimizer (recomiendo desinstalarlo después de usarlo).
Instrumentos
Herramientas de complemento. Importar, exportar, volver a una versión anterior. Cosas que sabemos.
Tutoriales
Y por último, en la sección de Tutoriales del plugin WP Rocket encontrarás tutoriales en vídeo para su uso en inglés.
Consejo final: consulte este tutorial sobre cómo acelerar su sitio de WordPress .
Was this article helpful for you? Support me by sharing, please. 👍
