homefinance blog
¿Intenta decidir entre Elementor y Wpbakery Page Builder?En esta guía, respondemos la pregunta crucial: ¿Cuál de ellos le dará un sitio de WordPress más rápido?Ambos vienen con una interfaz intuitiva de tipo y drap que brinda energía a los desarrolladores y diseñadores, lo que les permite construir páginas de WordPress en unos minutos.Pero, ¿dónde está en términos de velocidad y rendimiento?¡El generador de páginas WPBakery (mejor conocido como compositor visual) es hace 10 años!Su éxito se debe en parte a su estrategia grupal: muchos temas populares premium han integrado a WPbakery en sus manifestaciones de 2011. Este fue uno de los primeros creadores de páginas que apareció en el mercado.
Elementor fue un gran éxito desde su lanzamiento en 2016, con más de 5 millones de instalaciones activas. El éxito llegó un poco más tarde, pero ahora se ha convertido en el primer generador de páginas utilizado en WordPress. Elementor y Wpbakery son opciones muy populares para el diseño web y la personalización: no cometerá errores de los constructores. Sin embargo, ¿podemos decir lo mismo sobre su desempeño? Ejecutemos algunas pruebas para ver qué generador de página es más rápido. Esto debería ayudarlo con el próximo proyecto. Anteriormente como compositor visual. (Utilizamos esto en nuestra auditoría de rendimiento). Visual Composer Website Builder (2017): Aplicación basada en ReactJS que le permite diseñar un sitio web completo, incluidos encabezados, sótanos y barras laterales. Es más como un constructor de sitios web que puede comparar con Elementor Pro. Rode tres pruebas de velocidad separadas para las páginas constructores con la siguiente configuración: Tema utilizado: Tema Twenty -one
Creadores de página probados: Elementor y Wpbakery
Herramientas de rendimiento: Google PageSpeed Insight y WebPagetest
Habrá tres escenarios: ️ Escenario n. ️ Escenario #2: en el mismo sitio web, construiremos una página simple con cada constructor y compararemos los resultados de rendimiento. En aras de la igualdad, usaré el módulo equivalente y los widgets para cada constructor. Las plantillas de página iniciales provienen de las bibliotecas Elementor y Wpbakery. Para tratar de mantener las cosas con la mayor precisión posible, esto es lo que agregaré: un encabezado de héroe con fondo (la imagen elemental tiene 150 kb)
Un encabezado de héroe con una imagen para WP Bakery (la imagen de WP Bakery es de 152 kb)
4 términos con imágenes pequeñas con elemento (4 kb por imagen)
2 testimonios de imágenes pequeñas con Wpbakery Page Builder (4kb por imagen, son los mismos para ambos constructores)
Un video construido en YouTube
Una sección de texto e iconos
Botón / urgencia
Testimonio de clientes falsos
Preguntas frecuentes de acordeón
Un módulo aleatorio según lo que está disponible en el constructor
️ Escenario #3: Mediremos el rendimiento al activar el complemento WP Rocket Cache. Esto le dará una idea de qué tipo de optimización de rendimiento puede esperar si está utilizando un complemento como WP Rocket. Para proporcionar a los usuarios una excelente experiencia a largo plazo, siempre debe evaluar la velocidad de su sitio para ver qué KPI mediremos en nuestra auditoría de rendimiento:
Nota de rendimiento general
La hora cargada completa de la página inicial
El tamaño total de la página
Medidas de rendimiento del faro, a saber:
Core Web Vitals Stands (la pintura más grande con contenido, apariencia acumulada, demora en la primera entrada) Índice de velocidad, tiempo para interactivo, tiempo de bloqueo total, primera pintura satisfactoria.
Los resultados de la prueba Elemoror vs Wpbakery Elementor son su comercializador, desarrollador o web profesional y necesita tomar decisiones difíciles sobre la marcha. ¿Cuál es el generador de página más rápido? En el que vale la pena invertir? Bueno, si desea saber cuáles de estos dos complementos le ahorrarán tiempo y no ralentizarán su sitio, ¡quédese con nosotros! ¡Pasemos a los datos! Escenario #1 – Sin generadores de páginas y cohete WP
Una página implícita en veintisiete veintiún son los datos que utilizan el tema predeterminado de WordPress 2021 (sin el generador de página sin cohete WP). /Tr>
Mi sitio es bastante rápido, lo que tiene sentido, Lo que hace porque casi no hay contenido en él. Ahora vamos a darle vida a las cosas construyendo una página inicial real con los creadores de página. la biblioteca.
️ Resultados de rendimiento elemental:
| kpi puntuación | general Grado de rendimiento (psi) | 62 |
| tamaño de página | 2.287 kb |
| solicitudes http | 19 |
| tiempo de carga completo de la página inicial | 3.2 s |
| El contenido más grande lleno de contenido | 2.8 S |
| Primera pintura satisfactoria | 2.3 S |
| Cambio acumulativo | 0 |
| índice de velocidad | 6.2 s |
| tiempo para interactivo | 3.9 s |
| tiempo de bloqueo total | 120 ms |
Mi sitio se volvió un poco más lento después de la página de inicio construida con Elementor, esto era predecible, porque agregué contenido en la página.Mis indicadores ahora están inclinados a los colores naranja y rojos:
Resultados de rendimiento con la página inicial creada con Elementor – Fuente: PSI Page Creator Elementor ha afectado mi rendimiento general y transformado mis valores de FCP, y LCP en el área roja. Sin embargo, TBT y CLS permanecen estables, lo que es alentador para la finalización visual y la estabilidad. ️ Resultados de rendimiento de WPBakery:
pintura más grande llena de contenido
a nivel mundial, mi sitio se volvió más lento después de construir la página inicial con wpbakery y, Nuevamente, están en el área de naranja (58/100). Aunque los KPI no son tan malos, el tiempo de carga de mi página inicial sigue siendo bastante alto (4.9 s de webpagetest.org). En la parte buena, tenemos dos puntajes verdes en PSI, pero desafortunadamente los otros cuatro valores de faro son en rojo:
Resultados de rendimiento con la página inicial creada con WPBakery – Fuente: PSI para finalmente completar la comparación entre Elementor y WPBakery. ️ Elementor vs Wpbakery – Resultados de rendimiento:
Hay algunas áreas donde la panadería WP tiene la ventaja Sobre el elemento, pero generalmente le di ventaja de Elementor P Para su mayor título de rendimiento. Algo bueno sobre el uso de un creador automático de sitios web, como Elementor o Wpbakery es cuánto tiempo y esfuerzo se reducen de construir algo solo, ¡todo sin sacrificar la calidad! Es cierto, a veces no tenemos la energía, el tiempo o la experiencia para diseñar un sitio web desde cero y aquí son útiles …
La idea es que para crear plantillas o demostraciones atractivas listas para su uso, los desarrolladores deben usar una gran cantidad de CSS y JS. Todos estos archivos pueden sobrecargar su sitio y aumentar el tiempo de carga, como hemos visto en nuestro análisis anterior. Desde la felicidad, WP Rocket optimiza su sitio web construido con Elementor o Wpbakery, por lo que no lleva horas antes de que alguien ingrese a su página web. Es hora de ver el impacto positivo del cohete WP en el rendimiento. Escenario #3 Elementor vs WP Bakery con WP Rocket Después de construir una página con ambas páginas generadores, nuestros puntajes de rendimiento se trasladan al área de PSI Orange. Además, un vistazo rápido a las secciones de oportunidades/diagnóstico muestra un lugar de mejora al usar Elementor y WPBakery. Las cifras son diferentes, pero finalmente, PSI ofrece las mismas recomendaciones para ambos creadores de páginas.
Las oportunidades de sección y el diagnóstico con el elemento de página inicial – Fuente: ¡PSI no se asusta! Google PageSpeed Insights ofrece algunas recomendaciones que puede usar para mejorar su puntaje de rendimiento del faro y hacer que su sitio sea más rápido. Lo que sea que se dirige a la optimización de archivos, la implementación de la carga perezosa en las imágenes y la eliminación de los recursos que bloquean la representación mejorará el rendimiento. (¿Suena esto? ¡Suena exactamente como las características de WP Rocket!) Para obtener una evaluación de rendimiento ecológico, Google recomienda seguir las técnicas a continuación:
Use una política de almacenamiento de caché efectiva: una larga vida útil de caché puede acelerar las visitas repetidas a su página.
Considere la entrega de JS/CSS en línea crítico y posponiendo todos los estilos no críticos (para eliminar los recursos que bloquean la representación) reducen las reglas no utilizadas de las hojas de estilo y retrasan el CSS no utilizado para la página anterior (reduzca JavaScript y CSS sin usar)
Los recursos basados en texto deben servirse con compresión (GZIP, Deflado o Brotti) para minimizar el total de bytes de red.
Fuente web de precarga para asegurarse de que el texto permanezca visible durante la carga de fuente web
Estas cinco soluciones clave son implementadas (casi) automáticamente por WP Rocket. Todo lo que tiene que hacer es cambiar algunas opciones en el tablero de WordPress. Te mostraremos cómo se hace un poco más tarde. Ahora es el momento de activar WP Rocket para ver si todos los problemas mencionados anteriormente han desaparecido. ¿Listo? Echemos un vistazo al escenario con WP Rocket: Elementor – WP Rocket
| Grado de rendimiento general (PSI) | 62 | 93 |
| tamaño de página | 2.287 kb | 859 kb |
| solicitudes http | 19 | 14 |
| Tiempo de carga completo de la página inicial TD> El contenido más grande lleno de contenido | 2.8 S | 1.5 S |
| Primera pintura satisfactoria | 2.3 s | 1.1 s |
| cambio acumulativo | 0 s | 0 s |
| índice de velocidad | 6.2 s | 1.1 s |
| tiempo para interactivo | 3.9 s | 1.1 s |
| LLOQUEO DE TIEMPO TOTAL | 120 ms | 0 ms |
En general, nuestro sitio es más rápido con WP Cohete. Todos los KPI han mejorado significativamente, y la nota de rendimiento general está ahora en verde:
Mis nuevos KPI con Elemador y WP Cohete Coadet-Source: PSI WPBAKERY-WP ROCKET
| Grado de rendimiento general (PSI) | 58 | 91 |
| tamaño de página | 2.040 kb | 979 kb |
| Solicitudes http | 20 | 15 |
| a tiempo completo cargado por el tiempo completo cargado de la página inicial | 4.027 S | 1.9 S |
| El contenido más grande lleno de contenido | 2.5 S | 1.5 S |
| la primera pintura satisfactoria | 2 s | 0.9 s |
| Cambio acumulativo | 0.434 | 0.038 S |
| índice de velocidad | 4.8 S | 1.9 S |
| tiempo para interactivo | 2.2 s | 1.1 s |
| Tiempo de bloqueo total | 10 ms | 0 ms |
La misma conclusión aquí: mi nota de rendimiento ahora está en ¡Verde! WP Rocket hizo un gran trabajo aquí. Ya no tengo KPI rojo. Son verdes o naranjas (y LCP), lo cual es alentador. El tiempo de carga de mi página pasó de 4 s a 1.9 s, y el tamaño de mi página pasó de 2,040 kb a 979 kb.
Mi nuevo KPI con WPBakery y WP Rocket-Source: Psi Elementor vs WP Bakery: ¿Qué es mejor para el rendimiento?Después de comparar el rendimiento de estos dos complementos de WordPress, descubrí que el elemento era un poco más rápido que WPBakery.También aprendimos que WP Rocket puede hacer algo mágico para acelerar su sitio, mejorar su web vital de la web e incluso reducir el tiempo total de bloqueo a cero, ¡independientemente del generador de página que use!
Los datos hablan por sí mismos. Eche un vistazo a nuestra tabla a continuación:
Elementor de aceleración y wpbakery con WP Rocket, supongo que estás interesado en saber cuáles de las opciones de cohetes de WP he activado para obtener una puntuación verde y ampliar mi lista de “auditorías promocionadas”. Mis “auditorías pasadas” es mucho más larga con el cohete WP activado aquí: Comparta sus cuatro opciones que utilicé en WP Rocket para hacer que mi sitio sea más rápido (tanto para Elementor como para WPBakery):
Pestaña de optimización de archivos: minimiza CSS, combina CSS y optimiza la entrega de CSS: esta es la función de eliminación de CSS no utilizada (o si no funciona para usted, la opción CSS asincron): los archivos CSS – pestaña WP Rocket
La pestaña de optimización de archivos minimiza JS, combina archivos JS, retrasó la carga JS y la demora JS (que me permitió y elimina/reduce JS no utilizado):
Pestaña de optimización de archivos JS – WP Rocket
Retraso JS – WP Rocket
Pestaña de medios: active lazyload en imágenes y videos;Eso fue útil para el video de YouTube ubicado en el encabezado:
Característica de carga perezosa – WP Rocket
Pestaña precarga: active la fuente de precarga de caché y la fuente de precarga:
Cache de precarga – WP Rocket
Tags Comparación de la velocidad elemental vs wpbakery: ¿qué es más rápido?(2021)
