Comparación de rendimiento de Divi vs Avada (2021): ¿Cuál es más rápido?

Publicado: 2021-07-08

¿Tratando de elegir entre Divi vs Avada para construir su sitio de WordPress?

Estos dos temas son dos de los temas premium de WordPress más populares de todos los tiempos: Elegant Themes (desarrollador de Divi) afirma tener más de 806 000 clientes, y Avada se ha comprado más de 747 000 veces en ThemeForest. Esos son números increíblemente impresionantes y una prueba de que cada tema tiene muchos usuarios felices.

Uno de los factores más importantes detrás del éxito de ambos temas es su conjunto de constructores visuales de arrastrar y soltar. Con estos constructores, puede crear hermosos sitios de WordPress personalizados, sin necesidad de código.

Pero la flexibilidad del diseño no es lo único a considerar en un tema de WordPress: también debe sopesar la rapidez con la que ese tema ayudará a cargar su sitio web porque los tiempos de carga del sitio web juegan un papel en todo, desde la experiencia del usuario hasta el SEO, las tasas de conversión y más. .

Esto es aún más cierto desde la actualización de Page Experience de Google, donde Google comenzó a incluir Core Web Vitals en sus clasificaciones.

Con ese fin, decidimos crear una comparación Divi vs Avada centrada en una métrica específica: el rendimiento.

Es decir, ¿Divi o Avada lo ayudan a obtener un sitio web que carga más rápido? Para responder a esa pregunta, realizamos algunas pruebas por nuestra cuenta: siga leyendo para ver los datos y el análisis.

Nota : originalmente publicamos esta publicación y realizamos estas pruebas en julio de 2021. Sin embargo, Elegant Themes lanzó una actualización con importantes actualizaciones de rendimiento de interfaz en agosto de 2021 (Divi 4.10) que marca una gran diferencia en el rendimiento de Divi. Por ese motivo, volvimos a realizar estas pruebas por completo y recopilamos todos los datos y conclusiones nuevos en noviembre de 2021.

Cómo probaremos el rendimiento del tema Divi vs Avada

Antes de llegar a los datos, hablemos sobre cómo vamos a probar el rendimiento de Divi vs Avada para que sepa exactamente cómo configuramos las cosas.

En primer lugar, vamos a probar dos escenarios de alto nivel:

  • Prueba n.º 1: probaremos solo los temas. Es decir, no usaremos sus constructores visuales incluidos. En su lugar, solo probaremos la "Página de muestra" predeterminada creada con el editor de bloques.
  • Prueba n.º 2: probaremos una página simple creada con el constructor de cada tema, ya que los constructores visuales son una parte clave de lo que hace que Divi y Avada sean tan populares. Intentaremos usar módulos comparables para que la comparación sea lo más equitativa posible.

Para cada escenario de prueba de alto nivel, también probaremos dos configuraciones diferentes:

  • La primera configuración es solo con los temas mismos y sin otras optimizaciones de rendimiento.
  • La segunda configuración es con WP Rocket instalado y configurado para que pueda ver cómo se ven las cosas si implementa las mejores prácticas de rendimiento de WordPress.

Además del almacenamiento en caché de páginas y otras mejores prácticas básicas, WP Rocket también ofrece algunas características únicas que pueden optimizar el código de cada tema y mejorar las métricas de Core Web Vitals.

  • Eliminar CSS no utilizado – esto le permite eliminar CSS innecesario de su sitio página por página. Puede ser especialmente bueno para reducir el tamaño de página de temas como Divi y Avada.
Remove-Unused-CSS-option-Source-WP-Rocket
Eliminar CSS no utilizado – WP Rocket
  • Retrasar la ejecución de JavaScript : esto le permite esperar para ejecutar JavaScript hasta una interacción del usuario, lo que hace un gran trabajo al acelerar el tiempo de carga inicial. Siempre puede excluir manualmente ciertos scripts si necesita que se carguen inmediatamente .
Retraso-JS-ejecución-Fuente-WP-Rocket-
Retrasar la ejecución de JS – WP Rocket

Nuestros sitios de prueba están alojados en un droplet de DigitalOcean económico de $5 por mes impulsado por RunCloud y una pila de Nginx. No hicimos ninguna mejora de rendimiento más allá de agregar WP Rocket en algunas de las pruebas, como se indicó anteriormente.

Para probar y medir los datos de rendimiento de WordPress, utilizaremos WebPageTest para recopilar datos de rendimiento centrados en dispositivos móviles:

  • Dispositivo de prueba : iPhone 8. Los dispositivos más modernos tendrán procesadores más potentes para procesar JavaScript más rápidamente, lo que podría conducir a tiempos de carga ligeramente más rápidos. Podría ser lo contrario con dispositivos más antiguos o de menor potencia.
  • Velocidad de conexión: conexión LTE acelerada (12 Mbps, 70 ms RTT). Los tiempos de carga en el mundo real serían más rápidos si un visitante está navegando en Wifi o más lentos si el usuario tiene algo así como una conexión 3G.

Para cada prueba, haremos que WebPageTest ejecute nueve pruebas separadas y tome el valor de la mediana. Esto nos ayuda a evitar la variabilidad de una sola prueba y obtener resultados más consistentes.

Estas son las cuatro métricas en las que nos centraremos:

  1. Pintura con contenido más grande (LCP) : parte de las nuevas métricas Core Web Vitals de Google y un factor de clasificación SEO en la actualización de Page Experience.
  2. Tiempo hasta el primer byte (TTFB) : esto mide qué tan rápido el servidor puede responder con el primer byte de datos después de procesar el PHP del sitio/tema (o entregar desde el caché, en el caso de nuestra prueba WP Rocket).
  3. Tamaño de página : en igualdad de condiciones, un tamaño de página más pequeño siempre es mejor.
  4. Solicitudes HTTP : todo lo demás es igual, menos solicitudes HTTP siempre son mejores.

Finalmente, aquí están los números de versión de todo lo que estamos probando:

  • Tema Avada – 7.5
  • Constructor Avada – 3.5
  • Divi tema – 4.13.1
  • Cohete WP – 3.10.3.

Pruebas de velocidad Divi vs Avada

Ahora, pasemos a nuestras pruebas prácticas de rendimiento Divi vs Avada.

Prueba #1: Solo los temas

En esta primera prueba, estamos probando solo los temas sin usar los constructores visuales:

  • Divi: solo el tema Divi, ya que Divi ya se incluye en Divi Builder.
  • Avada: también instalamos los complementos Avada Core y Avada Builder, ya que estos son complementos básicos necesarios. Sin embargo, no instalamos ningún complemento opcional.

El contenido real es la "Página de muestra" que viene con una nueva instalación de WordPress. Está construido con el editor de bloques nativo.

Aquí están los datos de los temas por sí mismos:

LCP TTFB HTTP
Peticiones
Tamaño del archivo
divide 1.011 segundos 0,408 s 14 201 KB
Avada 1.517 s 0,448 s dieciséis 544KB

Puede ver que Divi es el claro ganador aquí cuando se trata del mayor tiempo de pintura con contenido, ya que el tiempo de Avada es un 50% más alto.

¿Por qué la diferencia?

Bueno, vamos a suponer que una gran parte del rendimiento más rápido de Divi es el hecho de que el tamaño de página de Avada es de 544 KB, mientras que el de Divi es de solo 201 KB. Tenga en cuenta que esto es para una página que no se creó con el generador visual; esta es solo la página de muestra predeterminada creada con el editor de bloques.

Ahora, veamos los datos después de agregar WP Rocket:

LCP TTFB Solicitudes HTTP Tamaño del archivo
Cohete Divi + WP 0,384 s 0,273 s 9 92 KB
Avada + Cohete WP 0,444 s 0,247 s 12 325 KB

Puede ver que, con las optimizaciones de WP Rocket, ambos temas son mucho más rápidos y hay muy poca diferencia en el tiempo de mayor pintura con contenido entre Divi y Avada. Divi sigue siendo un poco más rápido, pero la diferencia es lo suficientemente pequeña como para que solo sea una variabilidad de prueba normal.

Además, WP Rocket pudo reducir en gran medida el tamaño de la página de ambos temas gracias a las funciones para eliminar el CSS no utilizado y retrasar la ejecución de JavaScript. Puede ver que el tamaño de la página de Divi se redujo en más de la mitad, mientras que el tamaño de la página de Avada se redujo en más de 200 KB.

Estas mejoras, junto con el almacenamiento en caché y otros ajustes, son lo que provocó la mejora de los tiempos de LCP.

Prueba #2: Con Constructores

En esta segunda prueba, usamos el generador visual de cada tema para crear una página comparable utilizando aproximadamente los mismos módulos. El diseño es muy simple: solo agregamos tres elementos para mantener las cosas lo más iguales posible:

  • Editor de texto con contenido idéntico de lorem ipsum
  • Botón
  • contracírculo

La idea aquí es principalmente ver qué "peso" adicional se agrega a la página cuando activa el generador de cada tema.

Aquí están los datos solo para los temas/constructores por sí mismos:

LCP TTFB HTTP
Peticiones
Tamaño del archivo
divide 0.899 s 0,341 s 14 205 KB
Avada 1.394 s 0,418 s 15 508 KB

En general, puede ver que los resultados son más o menos los mismos que los anteriores. Divi es notablemente más pequeño en términos de tamaño de página y, como resultado, tiene un tiempo de pintura con contenido más grande más rápido.

Además, ninguno de los temas agrega peso adicional a la página solo porque ha activado el generador visual, lo que significa que realmente no hay ninguna penalización por usar el generador en lugar del editor nativo ( al menos para páginas simples ).

Aquí están los datos después de agregar WP Rocket:

LCP TTFB HTTP
Peticiones
Tamaño del archivo
Cohete Divi + WP 0.399 s 0.260 s 9 92 KB
Avada + Cohete WP 0,466 s 0,259 s 11 296 KB


Con WP Rocket, puede ver el mismo resultado que la primera prueba. Ahora, los tiempos de pintura con contenido más grande de Divi y Avada son mucho más rápidos y similares en rendimiento, aunque Divi es nuevamente un poco más rápido. Más allá de reducir en gran medida el tiempo de pintura con contenido más grande, WP Rocket también pudo lograr reducciones similares en el tamaño del archivo como en la primera prueba.

Reflexiones finales sobre el rendimiento de Divi vs Avada

Divi y Avada son similares en el sentido de que ambos le brindan el poder de crear un sitio web personalizado utilizando sus constructores visuales de arrastrar y soltar.

Sin embargo, si bien ambos le brindan ese control, Divi ahora es notablemente más rápido en términos de rendimiento listo para usar.

La diferencia fue pequeña cuando realizamos por primera vez nuestras pruebas de rendimiento Divi vs Avada. Sin embargo, después de la actualización de rendimiento de Divi 4.10 en agosto de 2021, Divi ahora es mucho más pequeño que Avada de forma predeterminada, lo que lleva a que los tiempos de pintura con contenido más grandes listos para usar de Divi sean aproximadamente dos tercios de los de Avada.

Sin embargo, si usa WP Rocket con su almacenamiento en caché y las nuevas funciones para eliminar CSS no utilizado y retrasar la ejecución de JavaScript, puede realizar grandes mejoras en ambos temas.

Si bien Divi aún era un poco más rápido con WP Rocket habilitado, la diferencia era mucho más mínima y Avada aún funcionaba bien.

Esto sugiere que, si bien Divi es un poco más rápido, aún puede crear un sitio de carga rápida con Avada siempre que implemente las mejores prácticas de rendimiento de WordPress con una herramienta como WP Rocket.

Por supuesto, estos dos temas no son sus únicas dos opciones. Si está enfocado en la velocidad y el rendimiento, es posible que desee consultar nuestras colecciones de los temas de WordPress gratuitos más rápidos o los temas de WooCommerce más rápidos si está creando una tienda de comercio electrónico.

Puede encontrar temas incluso más rápidos que estos dos, incluido el tema Astra, que funcionó bien en nuestra comparación de rendimiento Divi vs Astra ( aunque la diferencia no es tan grande gracias a las nuevas mejoras de rendimiento de Divi ).

¿Todavía tienes alguna pregunta sobre Divi vs Avada cuando se trata de velocidad y rendimiento? ¡Pregúntanos en los comentarios!