Spis treści
Tytuł trochę wprowadza w błąd bo na wydajność stron stworzonych w Divi czy Elementor pro ma wpływ wiele czynników więc proszę o wyrozumiałość przedstawi tu dwa scenariusze porównania motywu WordPress Divi i wtyczki WordPress Elementor pro.
Pierwszy scenariusz wspomniałem na końcu wpisu Porównanie wydajności popularnych edytorów do tworzenia stron WordPress. W drugim scenariuszu porównam szybkość tych narzędzi do tworzenia stron WordPress w bardziej praktycznych warunkach.
Środwisko testowe, informacje o instalacji WP
| Hosting | Zenbox – Hosting Firma 10k |
| Wersja WordPress | WordPress 6.3.1 |
| Wersja motywu, wtyczki | Najnowsza na dzień 8.31.2023 |
| Wersja PHP | 7.4 |
| Ilość podstron | 1 (tylko strona główna) |
| Ilość wpisów | 0 |
| Ilość zdjęć w bibliotece | 2 (logo i obrazek) |
| Dodatkowe wtyczki | LiteSpeed Cache |
Divi kontra Elementor Pro runda 1
W odróżnieniu od testów wydajności przprowadzonych we wpisie „Porównanie wydajności popularnych edytorów do tworzenia stron WordPress„, podjąłem decyzję że zrobię jeszcze jeden test szybkości, mianowicie zainstaluje i skonfiguruję wtyczkę LiteSpeed cache na stronach stworzonych w Divi i Elementor Pro, zoptymalizuję obrazy, skorzystam z opcji które mają wpływ na wydajność w ustawieniach Divi i Elementor Pro.
Szybkość strony www WordPress stworzonej w Elementor Pro
PageSpeed Insights Elementor Pro
Pingdom Website Speed test Elementor Pro
GTmetrix speed test Elementor Pro
Szybkość strony www WordPress stworzonej w Divi
PageSpeed Insights Divi
Pingdom Website Speed test Divi
GTmetrix speed test Divi
Runda 1 podsumowanie
Jak widać po optymalizacji witryn zarówno Divi jaki Elementor wypada bardzo dobrze, poniżej jeszcze bezpośrednie porównanie szybkości w GTmetrix.
Bezpośrednie porównanie Divi i Elementor Pro w GTmetrix
Teraz czas na porównanie w tabelkach.
Elementor Pro vs Divi PageSpeed Insights
| Elementor Pro | Divi | |
| Performance | 100 | 100 |
| FCP | 1,1s | 0,9s |
| TBT | 0ms | 0ms |
| Speed Index | 1,4s | 1,7s |
| LCP | 1,5s | 1,4s |
| CLS | 0 | 0 |
Elementor Pro vs Divi Pingdom Website Speed Test
| Elementor Pro | Divi | |
| Performance Grade | A 98 | A 98 |
| Page size | 105 KB | 80.3 KB |
| Load time | 173ms | 184ms |
| Requests | 6 | 7 |
| Image | 47.92% (50 KB) | 62.81% (50 KB) |
| Script | – | – |
| Font | – | 8.51% (6.8 KB) |
| HTML | 8.3% (8.7 KB) | 9.44% (7.5 KB) |
| CSS | 42.83% (44.7 KB) | 17.98% (14.3 KB) |
Elementor Pro vs Divi GTmetrix
| Elementor Pro | Divi | |
| Grade / Preformance | A / 94% | A / 96% |
| Strucutre | 95% | 99% |
| LCP | 1.2s | 1.0s |
| TBT | 0ms | 0ms |
| CLS | 0 | 0 |
| Fully Loaded Time | 1.5 | 1.5 |
| Page size | 100KB | 75.7KB |
| Page requests | 6 | 7 |
Elementor Pro Vs Divi runda pierwsza opinia
Jak widać powyżej wyniki są bardzo podobne, więc sumując odpowiednia konfiguracja wtyczki LiteSpeed Cache oraz włączenie opcji w Divi i w Elementor Pro odpowiadających za wydajność pozwoli nam konkurować ze stroną wykonaną w edytorze blokowym WP.
Divi kontra Elementor Pro Runda 2
W drugiej rundzie pojedynku narzędzi do tworzenia stron WordPress Divi i Elementor Pro, odwzoruję bardziej praktyczne wykorzystanie tych page builderów. Mało kto korzysta z Divi czy Elementora Pro żeby stworzyć stronę z jedną sekcją Hero, dlatego w rundzie drugiej z pomocą wbudowanej biblioteki gotowych szablonów
Layout Elementor Pro wybrany do testów wydajności
Niestety ale zrzut ekranu strony w Elemntor Pro nie wykonał się poprawnie, pewnie ze wzgęldu na ustawienia wtyczki LiteSpeed Cache. W kżdym razie strona działa poprawnie na telefonie i komputerze.
Layout Divi wybrany do testów wydajności
Jak widać strony obu przypadkach są bardziej rozbudowane niż pojedyńcza sekcja hero, więc jestem ciekawy wyników. Layout Divi zawiera więcej sekcji, zdjęć, elementów i animacji więc uważam że Elementor Pro wypadnie nieco lepiej, ale nic czas na testowanie.
Wydajność rozbudowanej strony www stworzonej w Elementor Pro
Page Speed Insights Elementor PRO
Pingdom Website Speed Test Elementor PRO
GTmetrix Speed Test Elementor PRO
Wydajność rozbudowanej strony www stworzonej w Divi WordPress
Page Speed Insights Divi
Pingdom Website Speed Test Divi
GTmetrix Speed Test Elementor PRO
Divi kontra Elementor bardziej rozbudowana strona www – bezpośrednie porównanie
Elementor Pro vs Divi PageSpeed Insights
| Elementor Pro | Divi | |
| Performance | 99 | 100 |
| FCP | 1,4s | 1,0s |
| TBT | 0ms | 10ms |
| Speed Index | 1,7s | 2,1s |
| LCP | 1,5s | 1,3s |
| CLS | 0 | 0 |
Elementor Pro vs Divi Pingdom Website Speed
| Elementor Pro | Divi | |
| Performance Grade | A 98 | A 94 |
| Page size | 125.8 KB | 666.1 KB |
| Load time | 239ms | 250ms |
| Requests | 9 | 21 |
| Image | 34.81% (43.5 KB) | 80.11% (533.1 KB) |
| Script | – | – |
| Font | – | 13.97% (93.0 KB) |
| HTML | 12.45% (15.6 KB) | 1,47% (9.8 KB) |
| CSS | 51.94% (65 KB) | 4.3% (28.6 KB) |
Elementor Pro vs Divi GTmetrix
| Elementor Pro | Divi | |
| Grade / Preformance | 90% | 97% |
| Strucutre | 95% | 98% |
| LCP | 1.4s | 1.1s |
| TBT | 0ms | 0ms |
| CLS | 0 | 0 |
| Fully Loaded Time | 1.6s | 1.5s |
| Page size | 88.2 KB | 256 KB |
| Page requests | 6 | 14 |
Przeprowadziłem również testy porównawcze w GTmetrix kilka razy żeby sprawdzić czy słabszy wynik wydajności strony stworzonej w Elementor Pro to błąd pomiarowy.
Bezpośrednie porównanie GTmetrix Divi Vs Elementor Pro 1
Bezpośrednie porównanie GTmetrix Elementor Pro vs Divi 2
Podsumowanie – Motyw WordPress Divi vs wtyczka Elementor Pro
Jestem mile zaskoczony szybkością strony stworzonej z Divi, biorąc pod uwagę to w jaki sposób Divi generuje strony – korzysta z przestarzałych shortcodów (Wersja Divi 5.0 będzie pozbędzie się shortcodów i będzie generowała bardziej przyjazny kod HTML) i layout Divi zawiera więcej sekcji i obrazów od layoutu strony Elementor pro to strona stworzona w Divi wypadął naprawdę świetnie.
Z drugiej strony jestem lekko zawiedziony wydajnością Elementor Pro, patrząc na to jak dynamicznie developerzy Elementora rozwiją wtyczkę i dodają nowe funkcje byłem pewien że Elementor wygra znacząco z Divi, jest to dla mnie duże zaskoczenie.
Co wybrać Divi czy Elementor Pro?
Jak widać w powyższych testach wydajności nie ma to większego znaczenia wybierz narzędzie do Tworzenia stron, które bardziej Ci odpowiada. Ja będę korzystał zarówno z Divi jaki Elementor Pro.
Dodaj komentarz