Astra vs GeneratePress 2023: rendimiento y características

¿Está interesado en GeneratePress y Astra para su próximo proyecto web? Tiene sentido considerarlos porque ambos son temas ligeros de WordPress que ponen el rendimiento en la cima de sus prioridades.

En este artículo, veremos el rendimiento de GeneratePress y Astra y recopilaremos datos de comparación de un escenario de caso real. También compartiremos algunas técnicas para aumentar el rendimiento y revisaremos sus características principales para ayudarlo a elegir entre ellas.

¿Qué tema es más rápido: GeneratePress o Astra? ¡Estás a punto de descubrirlo!

Cómo estamos probando el rendimiento de GeneratePress frente a Astra (enfoque móvil completo)

Para medir el rendimiento de GeneratePress y Astra, estamos adoptando un enfoque totalmente móvil con servidores ubicados en Francia.

Herramientas de rendimiento y KPI

Temas: Estamos comparando las dos versiones gratuitas de los temas GeneratePress y Astra. Aunque ambos ofrecen complementos premium, no los hemos instalado para esta auditoría.

Herramientas y métricas:

• GTmetrix (Tamaño de la página, tiempo de carga completa y número de solicitudes HTTP en el móvil, desde un iPhone 12 en París )
• Google PageSpeed ​​Insights (para Core Web Vitals: mayor pintura con contenido y otras métricas clave de rendimiento: cambio de diseño acumulativo: índice de velocidad, tiempo total de bloqueo y primera pintura con contenido)

Los sitios de prueba

Para mantener las cosas lo más justas posible, construimos nuestros sitios de prueba con los bloques del Editor de WordPress y luego simplemente intercambiamos los temas. Hemos diseñado los siguientes módulos:

• Un encabezado de héroe con una imagen de fondo.
• Cuadros de texto e imágenes
• Iconos
• Galería de imágenes (utilizamos las mismas imágenes para ambos)

Comparación del rendimiento de GeneratePress y Astra

Ahora comparemos nuestros dos sitios usando PageSpeed ​​Insights y GTmetrix. ¡Vamos a los datos!

Como referencia, así es como se ven nuestros dos sitios de prueba:

Nuestra página con GeneratePress (mismos módulos)	Nuestra página con Astra (mismos módulos)

Comencemos con la primera métrica, el grado de rendimiento móvil: son bastante similares para ambos temas. Obtenemos una calificación naranja en Google PageSpeed ​​Insights con 81/100 para Astra y 82/100 para GeneratePress.

Resumen de rendimiento de Astra vs. GeneratePress

Aquí hay una tabla de resumen con todos los KPI de rendimiento que obtuvimos para ambos temas. Debería ayudarlo a comparar visualmente ambos temas:

*Núcleo web vitales

¿Es Astra más rápido que GeneratePress? – Respuestas clave

• Ambos temas son muy similares en rendimiento ya que obtuvieron 81/100 (Astra) y 82/100 (GeneratePress) en dispositivos móviles.
• Astra y GeneratePress tienen casi el mismo tiempo de carga completa de alrededor de 3 segundos.

• Acerca de Core Web Vitals:
  • Cambio de diseño acumulativo: Astra está funcionando mejor que GeneratePress y evita los cambios repentinos en los diseños (con un CLS de 0 s, en comparación con GeneratePress, que está en números rojos con una puntuación de 0,521).
  • Pintura con contenido más grande: la pintura con contenido más grande (LCP) de GeneratePress es de 3,3 segundos contra 4,1 s para Astra (lo que pone a este Core Web Vital en números rojos.
• El número de solicitudes HTTP es similar (20 y 21), pero el tamaño de la página de Astra es más ligero: 788 KB (contra 953 KB para GeneratePress).

Para profundizar en la auditoría de desempeño, echemos un vistazo a las secciones de diagnóstico y oportunidades de Lighthouse a continuación.

Sección de oportunidades de PageSpeed ​​Insights para GeneratePress

El rendimiento de GeneratePress es satisfactorio, pero hay margen de mejora en las siguientes áreas:

• Habilite la compresión de texto : al comprimir su contenido, se asegura de que sus páginas se muestren a los visitantes más rápidamente.
• Reducir el tiempo de respuesta inicial del servidor : lo que significa que debemos intentar retrasar JS para tener una respuesta más rápida del servidor. Las principales soluciones son limpiar la base de datos, usar código limpio e implementar el almacenamiento en caché.
• Reduzca el CSS no utilizado : recortar su código al reducir el CSS no utilizado afectará positivamente el tiempo de carga de la página.
• Sirve imágenes en el formato de próxima generación : Lighthouse recomienda servir imágenes en WebP o AVIF para ofrecer una mejor compresión cuando se usan imágenes en línea.
• Sirva activos estáticos con una política de caché eficiente : se trata de usar un complemento de caché eficiente.

Sección de diagnósticos y oportunidades de PageSpeed ​​Insights para Astra

En general, descubrimos que la falta de almacenamiento en caché y las imágenes mal optimizadas son los principales culpables de las siguientes señales de alerta. Estas son las mejoras que debemos implementar para el sitio de prueba de nuestro Astra:

Ahora que sabemos dónde nos encontramos en términos de rendimiento para ambos temas, sigamos las recomendaciones de PageSpeed ​​Insights y aprovechemos WP Rocket (e Imagify) para solucionar todos estos problemas de rendimiento fácilmente.

Cómo acelerar Astra y GeneratePress

Para acelerar Astra y GeneratePress, la primera recomendación de Lighthouse es usar un complemento de almacenamiento en caché como WP Rocket. Reduce el tiempo de respuesta del servidor al almacenar en caché el contenido, optimizar el código y la base de datos e implementar la compresión de texto.

Con respecto a la optimización de imágenes, Lighthouse sugiere habilitar Imagify para codificar de manera eficiente las imágenes y garantizar el rendimiento. Imagify es un complemento optimizador de imágenes fácil de usar que comprime imágenes y las convierte a WebP.

Muy bien, es hora de ver cómo se están desempeñando ahora ambos temas después de abordar todos los problemas.

Resultados de rendimiento mejorados gracias a WP Rocket (e Imagify)

WP Rocket e Imagify han mejorado significativamente la puntuación en Lighthouse para ambos temas. Ahora estamos puntuando 100/100 para GeneratePress y Astra:

GeneratePress + WP Rocket + Imagínese (PSI)	Astra + WP Rocket + Imaginar (PSI)

¡Gracias a WP Rocket e Imagify, ahora estamos pasando la auditoría de PageSpeed ​​Insights! Solucionamos todos los problemas señalados en las secciones de oportunidades y diagnósticos de GeneratePress.

Problemas de GeneratePress marcados por Lighthouse	¡WP Rocket e Imagify los arreglaron todos!

Las mismas mejoras y correcciones ocurrieron para Astra:

Problemas de Astra señalados por Lighthouse	¡WP Rocket e Imagify los arreglaron todos!

Para resumir, armamos una tabla de comparación global que muestra el rendimiento de ambos temas con y sin WP Rocket + Imagify (el optimizador de imágenes):

*Núcleo web vitales

Conclusiones clave con WP Rocket

Gracias a WP Rocket, hemos notado importantes mejoras en el rendimiento de ambos temas, como:

• La calificación de rendimiento móvil en PageSpeed ​​Insights subió a 100/100 para ambos.
• WP Rocket mejoró nuestra puntuación Core Web Vitals, y todos se movieron al verde.
  • La mayor pintura con contenido (LCP) pasó de 3,3 s a 0,7 s para GeneratePress y de 4,1 s a 0,6 para Astra.
  • Los cambios de diseño de contenido (CLS) pasaron de 0,524 a 0 para Generatepress.
• Ahorramos alrededor de 1 s en el tiempo de carga de la página para ambos.
• El número de solicitudes HTTP también ha disminuido para ambos temas: de 21 a 16 para Astra y de 20 a 15 para GeneratePress.
• El índice de velocidad ahora es de 0,6 s para GeneratePress (era de 5 s y estaba en rojo).
• El tamaño de la página es mucho más pequeño para ambos temas. Pasó de casi 788 KB a 588 KB para Astra y de 957 KB a 547 KB para GeneratePress.
• Todos los problemas marcados en los problemas de PageSpeed ​​Insights ahora están en la auditoría aprobada.

Conclusiones clave con Imagine

• Imagify comprimió nuestras imágenes en un par de clics lo que lo hace muy fácil de usar.
• Todas nuestras imágenes se comprimieron y convirtieron a WebP (el formato de próxima generación recomendado por Google).
• Imagify ayudó a resolver los problemas de "servir imagen en el formato de próxima generación" y "codificar imágenes de manera eficiente" de PageSpeed.

A continuación se muestran los dos botones que presionamos para optimizar nuestras imágenes:

• Conversión WebP para hacer las imágenes más claras.

• Compresión inteligente de imágenes masivas : la compresión de todas sus imágenes funciona automáticamente en segundo plano y hace el trabajo por usted.

Descubramos todas las características de WP Rocket que ayudaron a dar un impulso de velocidad adicional a ambos creadores de páginas:

• Almacenamiento en caché y GZIP y compresión de texto : WP Rocket se aplica automáticamente con almacenamiento en caché y compresión GZIP al activarse.

• Minificar CSS, combinar CSS y eliminar CSS no utilizado – Para optimizar la entrega de CSS.

• Del mismo modo, también hay algunas opciones para minimizar, diferir y retrasar JavaScript.

Nuestra auditoría de desempeño ya está completa. Veamos las características principales de cada tema para ayudarlo a decidir qué tema es la opción correcta para sus necesidades.

GeneratePress vs. Astra: características clave y precios

Astra y GeneratePress tienen el mismo enfoque: su versión gratuita es un marco básico que le permite construir cualquier cosa encima sin afectar el rendimiento.

• Temas ligeros populares : tanto Astra como GeneratePress son temas ligeros populares que son una gran base para tener un sitio de carga rápida. Una instalación nueva de GeneratePress agrega menos de 10 KB (comprimidos con gzip) al tamaño de su página, y Astra solo agrega 50 KB en la interfaz. Astra se usa en más de 1 millón de sitios y GeneratePress superó recientemente las 500 000 instalaciones.

Uso del Personalizador para personalizar el tema : confían en el Personalizador de WordPress para modificar las opciones y realizar los cambios visualmente.

GeneratePress + Personalizador nativo de WordPress	Astra + Personalizador nativo de WordPress

• Biblioteca del sitio para principiantes : ambos tienen interfaces intuitivas que son muy fáciles de usar. Todo lo que necesita hacer es seleccionar e importar la plantilla que desea usar en su sitio de WordPress. No necesitas ser un desarrollador avanzado para usar ambas herramientas, y las plantillas están muy bien diseñadas.

Cómo usar la biblioteca para Astra:

• Instale el complemento gratuito "Plantillas de inicio".
• Elige la plantilla de tu preferencia, puedes ordenar por categoría y agregar un filtro “premium”.
• La importación comenzará automáticamente.

Cómo usar la biblioteca para GeneratePress:

• Debe tener activado GP Premium y el módulo de biblioteca del sitio .
• Vaya a Apariencia > GeneratePress > Biblioteca de sitios.
• Elija su diseño para iniciar la importación.

Biblioteca de sitios de GeneratePress	Biblioteca de sitios de Astra

• Compatibilidad con creadores de páginas – GeneratePress y Astra son compatibles con los creadores de páginas más populares, y ambos ofrecen plantillas prefabricadas creadas en Elementor, Beaver Builder y el Editor de WordPress.

Plantillas GeneratePress listas para el creador de páginas (Ejemplo: Elementor + GeneratePress)	Plantillas Astra listas para el creador de páginas (Ejemplo: Elementor + Astra)

• Complementos premium - Ambos temas son freemium, lo que significa que si desea desbloquear algunas funciones, plantillas e integraciones avanzadas, deberá comprar un complemento premium.

¿Qué hay en GeneratePress Premium?	¿Qué hay en Astra Pro?

• Compatibilidad con WooCommerce : ambos temas son compatibles con WooCommerce y ofrecen algunas funciones dedicadas. Ambos tienen plantillas listas para usar creadas con WooCommerce para construir una tienda en línea sobre bases sólidas.

Demostraciones dedicadas basadas en WooCommerce GeneratePress (extracto)	Demostraciones dedicadas basadas en WooCommerce Astra (extracto)

• Comunidad internacional : ambos tienen una gran comunidad en todo el mundo con grupos de Facebook interesantes (10 000 para GeneratePress y 54 000 para Astra). Sin embargo, es más probable que conozca al equipo de Astra (dirigido por Sujay Payar) en WordCamp, ya que parecen estar más involucrados en la comunidad de WordPress.

GeneratePress vs. Astra: las principales diferencias

• El personalizador es menos detallado para GeneratePress , lo que tiene sentido por su enfoque liviano y sin excesos, pero es menos amigable para principiantes que el de Astra, donde la personalización parece más fácil. Por ejemplo, si necesitamos modificar el pie de página, hay una representación visual del diseño:

• La biblioteca de plantillas es más rica para Astra : Astra viene con muchos bloques prefabricados que se pueden usar, como encabezados, testimonios, tablas de precios y llamadas a la acción. GeneratePress tiene una biblioteca con páginas prediseñadas, pero los bloques no son tan impresionantes desde la perspectiva del diseño. Astra proporciona más encabezados prefabricados, por lo que es una buena idea si es un principiante o no quiere comenzar desde cero.
• Etiquetado blanco (solo Astra): Astra Pro le brinda la opción de etiqueta blanca, lo cual es interesante si planea entregar el sitio a un cliente y agregar sus personalizaciones.

• GeneratePress sigue más de cerca la teoría de “menos es más” y sí que ofrece un tema más minimalista que Astra: todo está integrado en la interfaz de WordPress, ya la hora de activar las opciones avanzadas todo es muy sencillo.
• Astra tiene integraciones más estrechas con complementos populares como Learndash o LifterLMS que le permiten, por ejemplo, iniciar un curso en línea completo con unos pocos clics.

Precios de GeneratePress frente a Astra

GeneratePress ofrece dos precios con acceso a las mismas funciones. O paga $ 59 / año u obtiene la licencia de por vida por $ 249. En ambos casos, tendrá las funciones premium, la biblioteca, las actualizaciones y el soporte. El único límite es usar GeneratePress en hasta 500 sitios web.

Astra también ofrece precios anuales y de por vida. Comienza en $ 47, pero necesitará el "Paquete esencial" a $ 137 para acceder a la biblioteca. El mejor valor es el "Paquete de crecimiento" porque le brinda acceso a muchos bloques y complementos de SEO, así como capacitación avanzada.

Terminando

En lo que respecta a la velocidad, los dos temas obtuvieron resultados similares, el tiempo de carga móvil fue casi el mismo y también lo fue el tiempo de carga de la página. La elección final dependerá de tus necesidades y de cuánto necesites un tema integrado con el resto del ecosistema de WordPress.

En cualquier caso, puede crear un sitio avanzado y potenciarlo con potentes funciones premium de ambos temas.

Si encuentra algunos problemas de rendimiento durante su proceso de desarrollo, puede usar WP Rocket e Imagify para abordarlos.

GTmetrix recomienda WP Rocket para reducir el tiempo de respuesta del servidor, por ejemplo.

Entonces, ¿qué tema vas a elegir? ¿Está utilizando actualmente un tema que ralentiza su sitio? Recuerde que WP Rocket e Imagify han aumentado significativamente el rendimiento y nos han hecho obtener una puntuación de 100/100 en PageSpeed ​​Insights. Use WP Rocket para mejorar la velocidad de su sitio de WordPress, y también puede probar Imagify gratis. No corre ningún riesgo porque si no ve ninguna mejora, le ofrecemos un reembolso dentro de los 14 días posteriores a su compra.