Divi, Elementor, WPBakery või Gutenberg? Võrdleme ausalt – CSS koormus, jõudlus, millal kumb sobib ja miks teemavalik on alus kõigele muule.

Sisukord

WordPress leht on nii kiire kui selle alus lubab. Võid optimeerida pilte, seadistada cache’i ja paigaldada Redise – aga kui teema genereerib 500 KB CSS-i igal lehe laadimisel, on sellel laele. Teema ja page builderi valik on üks olulisemaid otsuseid, mis mõjutab kõike muud.

Vaatame ausalt läbi peamised variandid – mis töötab, mis on kompromiss ja millal kumb sobib.

Miks page builderid aeglustavad

Page builderid lahendavad reaalse probleemi – visuaalne lehekülgede ehitamine ilma koodi teadmata. Aga nad teevad seda hinnaga.

CSS bloat – page builder genereerib CSS-i kõigi võimalike elementide jaoks, mida see oskab kuvada, olenemata sellest, mis konkreetsel lehel tegelikult kasutusel on. Elementor laeb 300-400 KB CSS-i igal lehel. Divi laeb 500+ KB. See on kogu kood – nupud, akordionid, slaidierid, tabid, galeriid – kõik korraga.

JavaScript – animatsioonid, interaktiivsed elemendid, drag-and-drop redaktori loogika. Osa sellest laeb ka frontend-is, kus kasutajal seda vaja pole.

Inline CSS – paljud page builderid kirjutavad elemendi-spetsiifilise CSS-i otse HTML-i style atribuutidesse. See ei saa olla vahemälustatud, laeb iga kord uuesti ja paisutab HTML faili suurust.

Geneeritud HTML – lihtne tekst + pilt, mis puhtas koodis oleks 5 rida HTML-i, on page builderis 50 rida pesastatud div-e koos classidega.

Divi – sobib väikestele projektidele, aga piirangutega

Divi on üks tuntuimaid page buildereid. Visuaalne redaktor on intuitiivne, mallide valik on lai ja hind on mõistlik (ühekordsed load saadaval).

Plussid:

Kiire alustada, visuaalselt lihtsalt mõistetav
Lai mallikogu
Ühekordse litsentsiga saadaval (vs aastane tellimus)

Miinused:

CSS koormus on suur – 500+ KB igal lehel vaikimisi
Divi 5 on väljas, aga hetkel veel küllaltki vigane – uuele projektile minnes tasub oodata stabiilsemat versiooni
Suurte projektide puhul (palju tooteid, kõrge liiklus) on jõudluse optimeerimiseks vaja märkimisväärset lisatööd
Leht on tihedalt seotud Diviga – teema vahetus on keeruline

Sobib hästi: lihtsad visiitkaardilehed, väikesed ettevõttelehed, projektid kus arendusaeg on prioriteet üle jõudluse. Me oleme ise DIVI 4 peal üles ehitanud ligikaudu 50 erinevat veebilehte, aga keerulisematel või suurematel projektidel eelistame Gutenbergi kasutada.

Elementor – populaarne, mugav, aga JS-heavy

Elementor on maailma populaarseim WordPress page builder. Kasutajaskond on suur, pluginaökosüsteem lai, tutorials on leitavad igale küsimusele.

Plussid:

Lihtsaim õppida kõigist siin mainitutest
Suur kogukond ja palju kolmandate osapoolte lisandmooduleid
Tasuta versioon on üsna võimekas

Miinused:

JavaScript koormus on märkimisväärne – Elementor laeb palju JS-i ka siis, kui lehel pole ühtegi interaktiivset elementi
Vaikimisi seadistustes on bloat sisse ehitatud – Google Fonts, Font Awesome ikoonid, mitmed skriptid laadivad alati
Elementor Pro hind on kõrge (~59$ aastas ühe saidi kohta)

Elementori debloat on võimalik – plugin nagu “Elementor Tweaks” või käsitsi seadistamine Elementori eksperimentaalsetes seadistustes laseb osa mittevajalikust välja lülitada. Aga see on lisatöö, mida puhtal teema puhul poleks vaja.

Sobib hästi: projektid kus klient haldab ise sisu, landing page’id, olukorrad kus visuaalne paindlikkus on tähtsam kui maksimaalne kiirus.

WPBakery – lihtne ehitada, kapriisne töötada

WPBakery (endine Visual Composer) oli aastaid Themeforesti teemade standardne page builder. Paljud vanemad saidid töötavad endiselt sellel.

Plussid:

Lihtne ehitada – frontend ja backend redaktor mõlemad olemas
Sisseehitatud debloat tööriistad (saab välja lülitada elemente, mida ei kasuta)
Suured mallikogud paljudes teemades kaasas

Miinused:

JavaScript heavy – sarnaselt Elementorile on JS koormus märkimisväärne
Töötamine võib olla kapriisne – konfliktid teiste pluginatega on sagedamad kui teistel
Areng on aeglustunud – uuemad alternatiivid on paljudes aspektides paremad
Shortcode’i põhine arhitektuur tekitab sisu lukustuse – kui WPBakery eemaldada, täitub sisu shortcode’idega

Sobib: olemasolevatele projektidele, kus WPBakery on juba kasutusel ja vahetus pole otstarbekas. Uutele projektidele ei soovita.

Gutenberg (plokiredaktor) – alguses võõras, lõpuks efektiivne

Gutenberg on WordPress-i sisseehitatud plokiredaktor alates versioonist 5.0. Full Site Editing (FSE) laiendab seda kogu saidi kujundusele – päis, jalus, mallid.

Plussid:

Sisseehitatud – ei vaja eraldi pluginat
Puhas kood – genereerib oluliselt vähem CSS-i ja JS-i kui kolmandate osapoolte page builderid
FSE teemad (nagu TwentyTwentyFive) on jõudlusele optimeeritud
WordPress’i tulevik – areneb aktiivselt

Miinused:

Õppimiskõver on järsem kui Elementoril või Divil – eriti kasutajatele, kes on harjunud visuaalse drag-and-drop kogemusega
Täiustatud kujundusvalikud nõuavad sageli kohandatud blokke või lisaplugina (Kadence Blocks, GenerateBlocks)
FSE on võimas, aga dokumentatsioon on kohati puudulik

Gutenbergi jõudlus on aga selge võit. Leht, mis on ehitatud Gutenbergi ja optimeeritud FSE teema peal, laadib kiiremini kui sama sisu Elementoris – sest genereeritava koodi maht on fundamentaalselt väiksem.

Hundikuu.ee ise töötab custom child theme’il TwentyTwentyFive baasil – CSS 18 KB kodulehel, Lighthouse 98/100 mobiilil. See oleks Diviga või Elementoriga saavutamatu ilma drastiliste kompromissideta.

Sobib: uued projektid kus arendaja on kaasatud, jõudlus on prioriteet, klient on valmis õppima.

Võrdlustabel

	Divi	Elementor	WPBakery	Gutenberg
CSS koormus	~500 KB	~300-400 KB	~200-300 KB	~20-50 KB
JS koormus	Keskmine	Suur	Suur	Väike
Õppimiskõver	Madal	Madal	Madal	Keskmine
Lighthouse (tüüpiline)	60-80	65-80	65-75	85-100
Uutele projektidele	Väikestele	Jah, kliendile	Ei	Jah
Debloat võimalik	Osaliselt	Osaliselt	Sisseehitatud	Pole vaja

Milline valida

Uus projekt, arendajaga – Gutenberg + FSE teema (TwentyTwentyFive, Kadence, GeneratePress). Parim jõudlus, puhtaim kood.

Uus projekt, klient haldab ise – Elementor (debloatida kohe alguses) või Kadence Blocks Gutenbergi peal. Mugavam kliendile, optimeeritav arendajale.

Väike visiitkaardileht, kiire arendus – Divi sobib, aga ära kasuta Divi 5 veel kriitilisele projektile.

Olemasolev WPBakery projekt – ära vaheta lihtsalt vahetamise pärast. Vaheta ainult kui jõudlusprobleem on tõsine ja ümbertöötamine on nagunii plaanis.

Page builder ei ole igavene valik – aga vahetus on tüütu ja kallis. Alguses õige valik säästab aastaid probleeme.