Webareal.sk - technicky nič moc

Stav zo septembra 2021. Nechce sa mi to zas celé pozerať.

Minulý rok som mal príležitosť sa pozrieť ako vylepšiť obchod hostovaný na webareal.sk. Čo je poskytovateľ hotových eshopov so žiadnym prístupom k zdrojovému kódu a obmedzenými možnosťami hlbších úprav. Väčšine ľudí to bude stačiť. Mal som tuším základný platený profil.

Musím napísať, že ma to dosť zdeprimovalo. Vyskytli sa tam vážne problémy, ktoré sa nedali vyriešiť. Ako, bude to fungovať aj v súčasnom stave, ale z môjho pohľadu, čo má rád veci aspoň z 80% optimalizované, je to zúfalé.

Administračné rozhranie je v poriadku, nejak ide a nie sú s ním problémy. API je okej, dokumentácia je online a má atribúty a príklad, čo je dobré, ale je z môjho pohľadu nedostatočná - treba hádať nejaké veci ako stavy objednávok a nechápem, prečo tam dali na označenie jeden znak, keď mohli celý reťazec, dátumy nepoužívajú ISO8601, ale nejaký divný formát.

A tým sa dostávam k časti, ktorú vidia návštevníci. Tá je patetická. Funkčne ide, sú tam vnorené menu, vyšši premium si môže zapnúť breadcrumby, funguje na mobile a tak. Avšak štýl je zlý a technická stránka pôsobí v štýle “čo to kurva je”. Jazykovo je to klasické PHP+HTML+CSS+jQuery. Všetky témy vyzerajú ako z roku 2009-2012. Aj sa tak divne správajú. Kto si pamätá jQuery UI (ten tam inak načítavajú), prototype.js a tú dobu, tak tuší. Témy majú divné okraje a veľkosti písiem a ani jedna nešla cestou minimalistického funkčného štýlu, ktorý priniesol Apple s prvým iPhonom. Technicky témy zdieľajú väčšinu skriptov a jQuery, ale nejak som to bližšie neskúmal.

Pustil som na to Lighthouse - a vyšlo veľmi dobré a veľmi zlé. Rozhodne vedia, čo robia. SEO - 97-100%, accessibility - 95%. Ale best practices - 67% a performance - 37% a 67% - záležalo od stránky. Najviac sa čakalo na načítanie JavaScriptu a CSSiek v head. Z nejakého dôvodu nepoužívajú minifikáciu a kompiláciu do jedného súboru a nie je to kvôli HTTP2. Proste to zabralo 6,2 a 2,3 sekundy. Obrázky sú celkom okej, stále nepoužívajú webp, ale to nie je až taký problém, ale sú tam ďalšie veci ako skripty a ktovie čo ešte, čo blokujú hlavný thread ďalších 3,3 sekundy a celkovo sa tam púšťajú kadejaké pičoviny. A DOM má príliš veľa elementov, 1200. Najviac by tomu minifikácia a kompilácia, ale obávam sa, že rýchlejšie by sa to načítavalo, ale stále bolo “pomalé” - klasicky tak podvedome pomalé rolovanie či pohyb kurzora.

Úprimne, už dlho ma neprepadol taký hlboký pocit beznádeje a zúfalstva a ani som nedokázal plne vysvetliť vlastníkovi, že prečo to nemá budúcnosť a že dôležité vylepšenia sú mimo kontrolu. Možno mu to bolo len viac menej jedno. Každopádne svoju prácu som urobil.

A aj preto sa vyhýbam eshopom ako sa najviac dá. Nevďačná práca a vždy ma prepadne hlboký pocit zúfalstva z technického stavu. Aj keby som mal prístup ku kódu.

Čo by som vylepšil? Minifikácia a kompilácia skriptov. Prejsť na ES6 a importy - tým pádom by im to aj useklo nepoužívaný kód. Optimalizovanejšie obrázky a dať dokopy tie skripty, ktovie čo na tej stránke robia. Načítavanie skriptov a cssiek v body, čistejší DOM, čistejšie témy, modernejší vzhľad, rýchlosť prvého vykreslenia. Starať sa o svoje jQuery.

Nemyslím, že to niekto dá dokopy bez toho, aby nezačal s dizajnom a kódením HTML na zelenej lúke a nenastavil si nejaký Webpack a nodejs.

Ako, nedá sa uprieť, že to celé nejak ide a je v podstate často aj rýchly a funguje aj mobilný štýl. Ale nie je to ono a funguje na istej grafickej a technickej hranici (a v dôležitých ohľadoch zastaralej), za ktorú sa nedá dostať…