Dne 27.5.2020 jsem se zúčastnil online srazu Frontendisti.cz. Hlavní téma srazu bylo JAMstack. Všichni řečníci mluvili o nových technologiích a postupech nebo popisovali vlastní způsob jak weby vyvíjejí na JAMstack. Moje řeč byla trochu proti proudu, ve které jsem se podělil o svou vlastní zkušenost s JAMstack přístupem. Celé video mého povídání zde.
Pro ty, kteří neradí sledují videa shrnu to nejpodstatnější v tomto článku.
Hlavní myšlenka, kterou jsem chtěl svou řeči předat byla moje osobní zkušenost s JAMstack. Protože jsem frontend kodér a JAMstack je primárně pro frontend vývojáře, tato technologie nebo spíš technologický postup mě zaujal. Zvolil jsem technologický mix React + Gatsbyjs + datoCMS + Netlify, na kterém jsem postavil několik projektů včetně tohoto blogu, který právě čtete. Po zkušenostech na těchto projektech, poměrně rychle jsem se vrátil ke svému předešlému způsobu realizace webu na WordPressu, a blog v JAMstacku, jsem přepisoval zpět do PHP.
Možná se ptáte proč se tak stalo? Jednoduše, protože každá technologie a postup má své výhody a nevýhody. Když jsem pro a proti porovnával, pro mně jednoznačně vyhrál WordPress. Zde je shrnutí:
Největší výhody JAMstacku:
1. rychlost a výkon
Bezpochyby největší výhodou přístupu JAMstack je právě rychlost. Přechod mezi stránkami nebo stavy aplikace jsou pocitově velmi rychlé a příjemné. JAMstack obvykle snadno řeší největší problém rychlosti = obrázky. Dokáže perfektně obrázek zkomprimovat, vygenerovat modérní formáty (webp) a elegantně řeší lazyloading.
2. bezpečnost
Jsou to statické vygenerované stránky a tudíž není co hacknout, až do chvíle, kdy potřebujete pracovat s daty a něco ukládat do databáze (např. objednávky, komentáře apod). Myslím, že zas tolik bezpečné to není a když někdo bude opravdu chtít, tak vám hackne i JAMstack web, když se bude hodně snažit..
Největší nevýhody přístupu JAMstack:
1. chybějící pohodlí a funkce z wordpress prostředí
Jsem zvyklý na prostředí wordpressu a jeho intuitivní administraci, které se nevyrovná Headless CMS, který vznikl minulý měsíc nebo rok. Jsem zvyklý, že celý systém je v češtině. Jsem zvyklý, na funkce jako je náhled a koncept, které v Headless CMS nejsou. Jsem zvyklý na obrovské množství pluginů, které mi dokážou ušetřit velké množství času. Jsem zvyklý na velkou celosvětovou wordpress komunitu, která řeší různé problémy a ten váš problém je nejspíš dohledatelný na internetu. Další výhodou wordpressu, že je zcela zdarma a veškeré data, která do systému ukládáte jsou ve vaši databázi, ve vaši správě a na vašem hostingu. Což se nedá říct o spoustě placených Headless CMS systémech v cloudu, které vás mohou o Vaše data kdykoliv připravit.
2. náročnější a tudíž dražší realizace
Není frontend kodér jako frontend vývojář. Často i já mívám zmatek v tom, co vlastně je náplní mé práce a co není. Abyste dokázali web postavit na JAMstacku, musíte velmi dobře umět javascript, potažmo React a graphQL. I když jsem se snažil sebevíc, realizace pomoci JAMstacku byla pro mě vždy časově náročnější než realizace ve WordPressu. I kdyby to nějaký šikovný javascriptový vývojář dokázal časově vyrovnat s mou realizaci na wordpressu, tak má určitě vyšší hodinovou sazbu než já (běžný frontend kodér s přesahem do PHP). Prostředí reactu mi prostě nesedlo, protože s sebou obnášelo kompletní změnu způsobu přemýšlení nad tvorbou webů.
Jak spojit výhody JAMstack a WordPressu
Jedním z hlavních důvodu, proč jsem se vrátil k Wordpressu byla skutečnost, že web na wordpressu lze optimalizovat a dosáhnout tak výhod, které s sebou přináší JAMstack. Spojení prostředí wordpressu, jazyka PHP a výhod JAMstacku je pro mě jasnou volbou.
1. kešovací plugin + CDN
Hlavní myšlenka JAMstacku je odbourání závislosti na vykreslení na straně serveru, tedy všechny ty PHP skripty, které ve wordpressu probíhají při požadavku na stránku. Jenže pro WordPress existují kešovací pluginy (supercache, wp-rocket, wp2static,….), které vygeneruji statické html soubory, každé stránky. Pro běžné návštěvníky tak zobrazujete statické html soubory, stejně jak to řeší JAMstack. A aby to dávalo ještě větší sílu, vygenerované hml soubory kešovacím pluginem můžete vložit na CDN. Načtení wordpress webu je pak znatelně rychlejší a má veškeré výhody, které nabízí CDN, tedy rychlost a stabilitu, která udrží obrovskou návštěvnost. Mrkněte třeba na článek, kde kluci z nasweb.cz popisuji, jak řešili krizový korona virový web, postavený na tomto principu.
2. optimalizace obrázků
Tady se neobejdete bez pluginů, který solidně obrázky optimalizuje. Nebo zde existuje ještě možnost použití cloudové služby, například cloudinary a vlastního lazyloadingu. Jak jsem se s tím popasoval a čeho tím dosáhl můžete přečíst v mém článku o optimalizaci obrázků ve wordpressu.
3. preloading pages
Existuji javascriptové knihovny (quicklink, instant page), které vám stránky před načtou ještě dříve než je navštívíte. Stačí když na odkaz najedete mýši, nebo se objeví ve viewportu a na pozadí dojde k přednačtení. Ušetříte tak desítky až stovky milisekund a dosáhnete stejného efektu jak to třeba řeší Gatsbyjs, který stránky přednačítá na stejném principu.
Závěr
Ano JAMstack je bezpochyby moderní způsob realizace webů, ale je vhodný spíše pro programátory – lidi co s javascriptem to opravdu uměj. Javascript je mi sice velmi blízký, ale pro mé potřeby, jakožto frontend kodéra, je to pro mě prostě příliš komplikované. Pokud jste na tom podobně jako já, raději zůstaňte u technologii, ve kterých nyní děláte, protože wordpress není zastaralý a ne, neumírá. Je stále populární a stále je nejpoužívanější systém na světě a dlouho ještě bude.
