Siempre estamos buscando formas nuevas e innovadoras para acelerar y optimizar sus sitios. Durante los dos últimos meses, nuestro equipo ha estado trabajando detrás de las escenas con los desarrolladores de WP Rocket para coordinar algunos cambios con su nuevo plugin versión 3.0 (lanzado en Abril 3, 2018). Estamos emocionados de anunciar que WP Rocket 3.0 y Kinsta son ahora totalmente compatibles y lo serán a partir de ahora.
Eche un vistazo a todo lo que necesita saber a continuación sobre el uso de WP Rocket en Kinsta y cómo puede ser algo grandioso para usted y sus clientes.
Usando WP Rocket en Kinsta
Para aquellos de ustedes que no están familiarizados con WP Rocket, es un popular plugin de caching y optimización todo-en-uno premium para WordPress. Normalmente no permitimos plugins de caching en nuestro entorno porque están en conflicto con nuestra solución de cache incorporada. Sin embargo, como la funcionalidad de caching de página de WP Rocket 3.0 se desactivará automáticamente cuando se ejecute en servidores Kinsta. Como resultado, permitimos a WP Rocket en nuestra plataforma porque ya no hay incompatibilidades.
Esto le permite utilizar ahora La solución de caching de Kinsta pero aún tomar ventaja de las increíbles funciones de optimización que WP Rocket tiene para ofrecer (nos sumergiremos en esto más adelante).
¿Por qué es importante el almacenamiento en cache? Caching es el proceso de almacenar recursos de una solicitud y la reutilización de los recursos para las solicitudes posteriores. Básicamente, reduce la cantidad de trabajo necesario para generar una página y disminuye la carga del servidor web. Es la forma número uno para negar el retraso de la dependencia que WordPress tiene en PHP y una base de datos (leer más sobre WordPress vs HTML estático).
Características de WP Rocket 3.0
Si no ha visto la nueva versión 3.0 de WP Rocket la UI es hermosa; mientras que todavía es fácil de usar y navegar! A continuación profundizaremos en algunas de las características recomendadas que puede utilizar desde WP Rocket para acelerar su sitio de WordPress, así como cómo está sincronizado con el entorno de Kinsta.
También estaremos ejecutando algunas pruebas de velocidad para ver el impacto de las opciones que tienen en vivo en un sitio web. No obstante, recuerde que los resultados pueden variar de un sitio a otro, por lo que asegúrese de probar en su propio sitio o entorno de staging.
Si está utilizando un staging en Kinsta, WP Rocket ha puesto en la lista blanca nuestra URL (staging-sitename.kinsta.cloud). Lo mismo es cierto en caso de ejecutar en localhost.
Borrar la Cache
Aunque el caching en WP Rocket se desactiva automáticamente cuando se ejecuta en Kinsta, la opción «Borrar Cache» en el menú de WP Rocket está sincronizada con el entorno de Kinsta. Si borra la cache de WP Rocket, este borra la cache de Kinsta realmente en su lugar. ¿No es genial? Y como siempre, usted puede borrar la cache de Kinsta desde la parte superior derecha de la barra de admin.
La «Purga de esta URL» también funciona de la misma manera, pero en lugar de purgar toda la caché de su sitio, limpia la caché de la URL en la que se encuentra actualmente. Esto es genial si tal vez hiciste una actualización manual de una página o un post.
Por motivos de rendimiento, no recomendamos que borre constantemente toda la caché de su sitio, ya que entonces tendrá que reconstruirlo. Purgar las URL individuales es una forma mucho mejor.
Si cambia algo en su sitio de WordPress, como un plugin o tema, podría ver una advertencia de WP Rocket. El botón Borrar la cache de Kinsta aquí también borra la cache.
Por último, si hace clic en el botón «Eliminar los archivos cacheados» en el panel de control de WP Rocket, esto hará lo mismo en Kinsta.
Cache
Como mencionamos anteriormente, el almacenamiento en caché de la página de WP Rocket se deshabilita automáticamente para los sitios alojados en Kinsta. Por lo tanto, recomendamos dejar la configuración de caché de WP Rocket como está con la opción «Habilitar el caché para dispositivos móviles» marcada.
Optimización de Archivos
Bajo el menú «Optimización de Archivo» le dan la posibilidad de optimizar su CSS y los archivos JavaScript. Analicemos en detalle cada uno de estos un poco más adelante.
Ajustes básicos
- Minificar HTML: elimina espacios en blanco y comentarios para reducir el tamaño. Realizamos pruebas de velocidad y vimos una reducción del 0.84% en el tiempo de la carga con esta opción habilitada. ⏱ Puede que no vea locas mejoras con esta característica pero, en general, menos espacio en blanco en el código es una buena cosa.
- Combinar archivos de fuentes de Google: Combinar las fuentes de Google reducirá el número de peticiones HTTP. Si está utilizando un alojamiento con HTTP/2 activado, ya no se recomienda combinar archivos debido a mejoras de la paralelización. Kinsta es totalmente compatible con HTTP/2. Cargando sus fuentes desde su propia CDN también puede mejorar rendimiento a veces. Eche un vistazo a nuestra guía sobre cómo alojar fuentes locales.
- Quitar las cadenas de consulta de recursos estáticos: Sus archivos CSS y JavaScript suelen tener la versión del archivo en el extremo de su URL, como
domain.com/style.css?ver=4.6. Algunos servidores y servidores proxy son incapaces de cachear cadenas de consulta, incluso si un encabezadocache-control:publicestá presente. Así que al removerlos, puede a veces mejorar su caching. Realizamos pruebas de velocidad y vimos un 1.86% de disminución en el tiempo de carga con esta opción habilitada. Nota: No se puede usar esta opción junto con las opciones de minificación de CSS o JavaScript.
Archivos CSS
- Minificar CSS: elimina espacios en blanco y comentarios para reducir el tamaño del archivo. Realizamos pruebas de velocidad y vimos a un 1.69% de disminución en el tiempo de carga con esta opción habilitada. ⏱ Debido a la forma en que el CSS funciona, esto podría romper su sitio, así que pruébelo con cuidado. De nuevo, en general, menos espacio en blanco en el código es una buena cosa.
- Combinar los archivos CSS: combina todos los archivos en 1, reduciendo las peticiones HTTP. Si está utilizando un alojamiento con HTTP/2 activado, ya no se recomienda combinar archivos ya que ahora pueden ser cargados en paralelo a través de una única conexión. Kinsta es totalmente compatible con HTTP/2. Lea más acerca de la combinación de los CSS externos.
- Optimizar la entrega de CSS: CSS bloquea la visualización en su sitio web para acelerar el tiempo de carga percibida. Lea más acerca de esto en nuestros artículos en profundidad sobre CSS de bloqueo de procesamiento y optimización de ruta de visulaización crítica. Realizamos pruebas de velocidad y vimos un 0.17% de disminución en el tiempo de carga con esta opción habilitada. ⏱ No obstante, recuerda que esto es más sobre el tiempo de carga percibido que el tiempo de carga real.
Archivos JavaScript
- Minificar archivos JavaScript: elimina espacios en blanco y comentarios para reducir el tamaño del archivo. Realizamos pruebas de velocidad y vimos una reducción del 0.84% en el tiempo de carga con esta opción habilitada. Debido a la forma en que JavaScript funciona, esto podría romper la funcionalidad con el plugin o tema, así que pruébelo con cuidado.
- Combinar archivos JavaScript: combina su sitio de JS en menos archivos, reduciendo las peticiones HTTP. Si está utilizando un alojamiento con HTTP/2 activado, ya no se recomienda combinar archivos ya que ahora pueden ser cargados en paralelo a través de una única conexión. Kinsta es totalmente compatible con HTTP/2.
- JavaScript carga diferida: elimina el bloqueo de visualización en su sitio y puede mejorar el tiempo de carga. Lea más acerca de esto en nuestros artículos en profundidad sobre el bloqueo de visualización de JavaScript. Esto también puede romper su sitio, por lo que asegúrese de probar con cuidado. Realizamos pruebas de velocidad y vimos un 1.35% de disminución en el tiempo de carga con esta opción habilitada.
Si eres cliente de Kinsta y utilizas la función de minificación de código que está integrada en el panel de control de MyKinsta, consulta con el servicio de atención al cliente si es posible utilizar ambas opciones.
Medios Sociales
Bajo el menú «Medios» le dan una opción para cargar en carga diferida sus imágenes y video, así como deshabilitar la carga de scripts adicionales como Emojis e Embebidos. Analicemos en detalle cada uno de estos un poco.
Carga Diferida
La carga diferida es una técnica de optimización que carga contenido visible pero retrasa la descarga y procesamiento de contenido que aparece debajo del fold. Activando la opción de carga diferida puede mejorar el tiempo de carga real o percibido como imágenes, iframes, y los videos se cargan solamente cuando entran (o están a punto de entrar) en el puerto de vista y reduce el número de peticiones HTTP.
- Habilitar para imágenes: Realizamos pruebas de velocidad y vimos un 3.89% de disminución en el tiempo de carga con esta opción habilitada.
- Habilitar iframes y videos: Hemos bajado ocho vídeos de YouTube en una página y vimos un 74.43% de reducción en el tiempo de carga con esta opción habilitada. WP Rocket tiene una opción para reemplazar automáticamente un vídeo de YouTube con su imagen de vista previa. Esta es una manera increíblemente poderosa para acelerar los vídeos en el sitio de WordPress.
Eche un vistazo a nuestro tutorial en profundidad sobre la carga diferida en WordPress.
Emoji
Con el lanzamiento de WordPress 4.2 llegó la integración de emojis en el núcleo para navegadores antiguos. El gran problema con esto es que genera una solicitud HTTP adicional en su sitio de WordPress para cargar el wp-emoji-release.min.js. Y esto carga cada página.
Deshabilitar Emoji: La opción deshabilitar emoji reducirá el número de peticiones HTTP. No las romperá, simplemente volverá a la versión emoji predeterminada del navegador del usuario. Realizamos pruebas de velocidad y vimos un 2.2% de disminución en el tiempo de carga con esta opción habilitada.
Compruebe nuestro artículo en profundidad sobre cómo deshabilitar emojis.
Embeds
Con el lanzamiento de WordPress 4.4 llegó la característica oEmbed en el núcleo. Probablemente haya visto o usado esto antes. Esto permite a los usuarios incrustar vídeos de YouTube, tweets y muchos otros recursos en sus sitios simplemente pegando una URL, que WordPress convierte automáticamente en un embebido y proporciona una vista previa en vivo en el editor visual. Si tienes Facebook incrustado en tu sitio, comprueba cómo la nueva actualización de Facebook lo afectará, y cómo arreglarlo.
Sin embargo, lo que esto significa es que también genera una solicitud HTTP adicional en su sitio de WordPress para cargar el wp-embed.min.js. Y esto carga en cada página.
Desactivar WordPress embeds: La opción de deshabilitar embeds reducirá el número de peticiones HTTP. Realizamos pruebas de velocidad y vimos un 4.9% de disminución en el tiempo de carga con esta opción habilitada. ⏱ Chequee nuestro artículo en profundidad sobre cómo deshabilitar embeds.
Precarga
En el menú «Precarga» te dan la opción de habilitar la precarga de la caché, la precarga del DNS y la precarga de las fuentes. No todos estos funcionarán en Kinsta. Pero analicemos en detalle cada uno de estos un poco.
Caché de precarga
No recomendamos esta opción para los sitios alojados en Kinsta porque puede reducir el rendimiento al sobrecargar a los trabajadores de PHP.
Prefetch Solicitudes de DNS
Permite búsqueda previa de DNS para resolver nombres de dominio (realizar una búsqueda de DNS en el fondo) antes de que un usuario haga clic en un vínculo que, a su vez, puede ayudar a mejorar el rendimiento. Se realiza mediante la adición de una etiqueta dns-rel="prefetch" en el encabezado de su sitio WordPress. Recomendamos añadir prefetch a solicitudes externas de la CDN, fuentes de Google y Google Analytics. Aquí está un ejemplo a continuación:
<link rel="dns-prefetch" href="//cdn.domain.com/">
<link rel="dns-prefetch" href="//fonts.googleapis.com/">
<link rel="dns-prefetch" href="//www.google-analytics.com">Esto es más difícil de hacerle una prueba de velocidad, pero puede estar seguro que le ayudará a acelerar su sitio.
Precarga de fuentes
Si estás alojando fuentes en tu propio dominio, y no en un servicio externo como Google Fonts, te recomendamos que las añadas a la lista de «Preload Fonts» en WP Rocket. Al precargar las fuentes en tu elemento HTML <head>, los navegadores web pueden empezar a descargar las fuentes antes de que sean descubiertas en tu archivo CSS.
Reglas Avanzadas
Debido al hecho de que WP Rocket sincroniza con la cache del entorno de Kinsta no puede usar las reglas avanzadas. Si necesitas excluir una URL o un directorio de la caché o forzar la caché de una determinada cadena de consulta, siempre puedes contactar con el equipo de soporte de Kinsta.
Base de Datos
Bajo el menú «Base de datos» WP Rocket te da la posibilidad de realizar limpiezas en los mensajes, comentarios, transitorios y tablas.
Cuando se combina con nuestras optimizaciones semanales automáticas de la base de datos, para mantener tu base de datos limpia eliminando las revisiones posteriores y los transitorios innecesarios asegurará que tu base de datos funcione al máximo rendimiento.
Limpieza de Publicación
No es raro que los sitios más antiguos tengan más de 100+ revisiones en sus páginas principales. Esto es simplemente debido a años de edición y actualización de contenidos. Digamos por ejemplo un sitio tiene 700 páginas o publicaciones con 150 revisiones en cada una, esto sería más de 100,000 entradas en la base de datos. Esto ocupa espacio de almacenamiento, e incluso con índices de la base de datos, esto a veces puede perjudicar el rendimiento.
WP Rocket le da la opción de eliminar los siguientes:
- Revisiones
- Auto-borradores
- Publicaciones descartadas
Eche un vistazo a nuestra publicación en profundidad sobre cómo optimizar las revisiones de rendimiento más rápido.
Borrar Comentarios
Análogamente a las revisiones, spam y los comentarios tirados pueden simplemente agregar a espacio desaprovechado a lo largo del tiempo. WP Rocket le da la opción de eliminar los siguientes:
- Comentarios de spam
- Comentarios descartados
Si no está usando los comentarios en su sitio de WordPress recomendamos simplemente desactivar los comentarios para evitar que el spam entre a todos. Entonces también no tiene que preocuparse acerca de la instalación de plugins de spam.
Limpieza de Transitorios
Los transitorios en WordPress a veces se pasan por alto, pero son muy importantes! De hecho, hemos visto cache transitoria dañada derribar completamente un sitio WordPress. Éstas están pensadas en ser temporales y, por tanto, es seguro eliminarlas y lo recomendamos. Si necesitan, un plugin se regenerará todos automáticamente. WP Rocket le da la opción de eliminar los siguientes:
- Transitorios expirados
- Todos los transitorios
Limpieza de la Base de Datos
La opción de limpieza de la base de datos reduce la sobrecarga de tablas de la base de datos. Sin embargo, en Kinsta utilizamos InnoDB en lugar de MyISAM y, por lo tanto, esto normalmente no es necesario. InnoDB ha demostrado que funciona mejor y es más fiable. Una gran razón para usar InnoDB en lugar de MyISAM, es aprovechar el bloqueo a nivel de línea. Esto permite que las consultas a la base de datos se procesen más rápidamente. Si migra su sitio de WordPress en Kinsta, esta es una de las optimizaciones que nuestros ingenieros hacen en su sitio.
Limpieza Automática
WP Rocket también le da la posibilidad de programar la limpieza automática de su base de datos sobre una base diaria, semanal o mensualmente. Esta es programada con un cron job detrás de las escenas.
CDN
Bajo el menú «CDN» puede habilitar una red de entrega de contenido de terceros. Esto realmente no es difícil de entender cuando se trata de rendimiento. Estos asumen la carga de su servidor web, mientras aceleran la entrega de contenido a sus visitantes haciendo mejor su experiencia. Compruebe por qué pensamos que cada sitio debe estar utilizando un CDN.
Si es un cliente de Kinsta, este menú no será necesario, ya que el Kinsta CDN se despliega automáticamente en su sitio detrás de las escenas.
Recomendamos ejecutar su sitio de WordPress primero a través de una herramienta de prueba de velocidad del sitio web y confirmar si todos sus activos (JS, CSS e imágenes) se están cargando desde la CDN de Kinsta.
Heartbeat
Heartbeat es una API de WordPress Core para el sondeo de servidores. Es usado por muchos temas y plugins para mantener un flujo de conexión con tu servidor. Esto permite a los desarrolladores de WordPress construir actualizaciones en tiempo real en sus productos.
Por defecto, el código de Heartbeat del lado del cliente se ejecuta cada 15-60 segundos. Dependiendo de su sitio y la configuración de tu servidor, los frecuentes pings del servidor de Heartbeat pueden no ser necesarios.
Con WP Rocket, puedes reducir los intervalos de ping de Heartbeat a 2 minutos o deshabilitar completamente los pings para el backend (panel de control de WP), frontend y editor de posts de tu sitio.
Para la mayoría de los sitios, recomendamos usar la opción «Reducir la actividad». Muchos plugins y temas modernos se aseguran de que Heartbeat tenga las funcionalidades principales, así que deshabilitarlo completamente podría potencialmente romper tu sitio.
Add-Ons
Bajo los «Add-Ons» WP Rocket le da la posibilidad de añadir servicios adicionales a su sitio como Cloudflare, Sucuri, Google Analytics, y Facebook Pixel.
Si usted usa cualquiera de estos servicios en su sitio, le recomendamos que los configure a través de WP Rocket para asegurarse de que se está beneficiando de la integración más optimizada para estos servicios.
Si ya está usando otros plugins para integrar estos servicios en su sitio, puede eliminarlos de forma segura después de configurar el complemento en WP Rocket.
Optimización de imágenes
Los desarrolladores de WP Rocket son los mismos que están detrás de Imagify, uno de nuestros servicios de optimización de imágenes favoritos. Si buscas un plugin de WordPress fácil de usar para optimizar imágenes, echa un vistazo a Imagify. Para aprender más sobre la optimización de imágenes y otros plugins y soluciones de optimización, consulta este artículo.
Pruebas de Velocidad Finales
Luego ejecutamos algunas pruebas de velocidad finales con todo habilitado para que se pudiera ver un antes y un después. Nota: Este sitio WordPress está alojado en Kinsta.
Antes de WP Rocket
Ejecutamos 5 tests en Pingdom sin WP Rocket y tomamos el promedio.
Luego ejecutamos 5 pruebas en Pingdom con WP Rocket y las opciones activadas y tomamos el promedio.
Después de WP Rocket
Luego ejecutamos 5 pruebas en Pingdom con WP Rocket y las opciones activadas y tomamos el promedio.
Luego ejecutamos una prueba en Google PageSpeed Insights con WP Rocket.
Aquí está la explicación de los resultados anteriores:
- En nuestras pruebas Pingdom hemos visto un 9.12% de reducción en el tiempo de carga total cuando ejecutando WP Rocket. Si bien esto puede no parecer locamente alto, esto sólo duró unos pocos minutos y menos de 10 clics para llevar a cabo.
- Recuerde que la esencia de WP Rocket es su solución de caching. Pero aquí en Kinsta, ya estamos utilizando nuestra cache integrada, tan sólo estamos compartiendo los resultados de sus demás funciones de optimización. Por lo que realmente es un 9% de mejora encima de la cache de Kinsta, rápido como relámpago.
- El sitio que estábamos utilizando para la prueba es bastante optimizado ya. Los sitios más grandes y aquellos que no son tan optimizados verán fácilmente resultados incluso mejores.
- ¿Tiene curiosidad de saber por qué hay solicitudes adicionales en la versión final? Generalmente esto es debido a la carga diferida de imágenes que crea peticiones vacías
data:image/gif;base64. Pero no se preocupe, todavía va a ser más rápido. - Si aloja el vídeo posiblemente pueda ver reducciones en el tiempo de carga de hasta el 50% o más. Esto se consigue utilizando la función de WP Rocket que sustituye a los vídeos de YouTube con miniaturas de vista previa interactivas. ¡Esto es realmente útil!
- En nuestras pruebas de Google PageSpeed Insights vimos un aumento en nuestra Puntuación obtenida de 88/100 a 98/100. Sin embargo, las puntuaciones no son tan importantes como los tiempos de carga general, de modo que tómelos con un grano de sal. Discutimos esto en nuestro artículo sobre Google PageSpeed Insights.
Como puedes ver arriba, WP Rocket hace que sea increíblemente fácil acelerar tu sitio de WordPress con sólo unos pocos clics.
Resumen
El equipo de WP Rocket empuja constantemente nuevas funciones que directamente se co-alinean con las recomendaciones de rendimiento web que compartimos en Kinsta. ¡Puede esperar ver una mayor integración con su plugin en los próximos meses! Estamos emocionados de que los clientes ahora pueden utilizar este plugin sin modificaciones adicionales necesarias.
Nos encantaría saber lo que piensa. ¿Utiliza WP Rocket? Háganoslo saber en los comentarios a continuación.
Brian tiene una gran pasión por WordPress, lo ha estado utilizando durante más de 10 años e incluso ha desarrollado un par de plugins premium. Brian disfruta de los blogs, las películas y el senderismo. Conéctese con Brian en Twitter.
Deja una respuesta