SPA - Single page aplikace jako webová stránka

Od roku 2014 je naší unikátní službou vývoj webových stránek jako SPA - single page aplikací. Single page aplikace neznamená aplikace s jednou stránkou, i když se ten termín pro to také občas používá. SPA je technicky označení pro aplikace (jako jsou také webové stránky), které se chovají jako jedna stránka s proměnlivým obsahem. A taková aplikace může mít podstránek klidně tisíce... Technologie a přístup, které v našich začátcích byly progresivní a unikátní, se postupně prosadily mezi špičkovými službami světové úrovně a stalo se standardem mít client-side orientované aplikace, kde většina logiky a kódu běží u uživatele v prohlížeči.

Toto šetří prostředky na serveru a umožňuje spoustu funkcionality obstarat instantně, protože se nemusí vše dotazovat serveru po Internetu, ale vyhodnocuje se přímo v zařízení. V současnosti i mobilní telefony jsou dostatečně výkonné i pro poměrně náročné aplikace a SPA, respektive obecně client-side aplikace, které jsou vystavěné na mohutném využití JavaScriptu a jeho frameworků, nabízí i další výhody - je hůře zpracovatelná a napadnutelná roboty. Tím mimochodem odpadá velká část spamu, a to i bez využití captcha.

Tou hlavní výhodou ale je, že prakticky celá aplikace běží nahraná po prvním načtení přímo v zařízení a dá se tak maximálně odladit UX - animace při přechodech mezi stránkami, průběžné "donahrávání" obsahu ze serveru... takovéto detaily učinily návštěvu webu mnohem plynulejší a do té doby byly k vidění pouze u nativních mobilních aplikací. A není náhoda, že SPA web lze "konvertovat" i na mobilní multiplatformní aplikaci. Jde tak o jeden z nejdostupnějších způsobů, jak mobilní aplikaci vyvinout.

V posledních letech, jak už to s trendy bývá, se trend začal otáčet a vše se upírá k rychlosti načítání - v tomto směru je klíčovou metrikou Core Web Vitals, které jsou důležitým faktorem pro SEO. Hodnotit výkon pohledem prvního načtení SPA příliš nesvědčí, protože se právě na začátku nahrává velká část kódu a až po návštěvě pár podstránek se naplno projevuje efektivita a úspornost dat u optimalizované single-page aplikace.

Momentálně oblíbeným řešením je tzv. SSR (server-side rendering), což je vlastně způsob, jakým weby fungovaly na PHP před 10 nebo 15 lety. Jen se vyměnily používané jazyky a technologie. Aplikace se celá připraví na serveru a na zařízení uživatlele přijde do prohlížeče kód "jen" k vyrenderování/zobrazení. Nutno říci, že v českém prostředí se technologie naprosté většiny webů mění jen velmi pomalu, a tak kromě velkých hráčů, startupů a progresivních firem ani SPA moc firem nevyzkoušelo a většina stále pracuje na principech SSR z dob kolem roku 2010.

Z našeho pohledu zajímavější je takzvaná hybridní nebo izomorfní aplikace, která spojuje klady obou světů. Začíná přípravou na serverů, do prohlížeče přichází prakticky hotový web, ale následně se donahraje kód, který celou aplikaci oživí a udělá z ní SPA.

My vyvíjíme v současnosti jak izomorfní, tak SPA aplikace a v některých případech i SSR. Jde ale spíše o konzervativní projekty. U SPA umíme zdárně čelit výzvám, které jsou pro některé vývojáře důvodem pro volbu jiné technologie. Díky výkonovým optimalizacím a odladěnému prerenderingu dosahujeme v některých případech i lepších SEO výsledků než v případě SSR.

Z původně využívané technologie AngularJS jsme plně přešli na Vue (nejdříve verze 2, nyní 3), která je frontendově naší specializací. Používáme také framworky Nuxt 3 a Vuetify.

Chcete se dotknout víc než
špičky ledovce?

<Path> Layer 1