Webové aplikace jsou nevědomky výměna starých desktopových aplikací. Jsou pohodlnější, snadno se aktualizují a nejsou vázány na jedno zařízení. A i když se uživatelé jemně přesouvají z webových aplikací založených na prohlížeči do mobilních, poptávka po složitých a rafinovaných aplikacích je již obrovská a stále roste., Pokud uvažujete o vytvoření vlastní aplikace, pravděpodobně jste slyšeli, že existují dva hlavní návrhové vzory pro webové aplikace: vícestránková aplikace (MPA) a jednostránková aplikace (SPA). A samozřejmě, oba modely mají své klady a zápory.

než začnete svůj nápad přeměňovat na skutečnou aplikaci, musíte odpovědět na spoustu důležitých otázek. Chcete-li se rozhodnout, jaký model aplikace je pro vás lepší, měli byste postupovat podle přístupu content-first, který zdůrazňuje důležitost uvedení obsahu aplikace před vše ostatní., Je to proto, že obsah je hlavním důvodem, proč uživatelé aplikaci budou nebo nebudou používat. A to nás vede k nejdůležitějším otázkám: jaký obsah chcete prezentovat a jaký obsah budou vaši uživatelé nejvíce zajímat.

existuje mnoho výhod a nevýhod SPA I MPA. Doufám, že řádky níže vám jasné rozdíly mezi těmito dvěma návrhové vzory a přinese vám blíže k místu, kde budete vědět, jaký druh aplikace se hodí váš nápad více. A udělejte si představu o vlastní aplikaci.,

single-page aplikace je aplikace, která funguje uvnitř prohlížeče a nevyžaduje stránka nabíjení během použití. Používáte tento typ aplikací každý den. Jedná se například o Gmail, Mapy Google, Facebook nebo GitHub.
Lázně jsou o porci vynikající UX tím, že se snaží napodobit „přírodní“ prostředí v prohlížeči — žádná stránka znovu načte, žádné další čekání. Je to jen jedna webová stránka, kterou navštívíte, která pak načte veškerý ostatní obsah pomocí JavaScriptu-na kterém jsou silně závislí.,

SPA požaduje označení a data nezávisle a vykresluje stránky přímo v prohlížeči. Můžeme to udělat díky pokročilým rámcům JavaScriptu, jako je AngularJS, Ember.js, Meteor.js, Knockout.js .
jednostránkové stránky pomáhají udržet uživatele v jednom, pohodlném webovém prostoru, kde je obsah prezentován uživateli jednoduchým, snadným a funkčním způsobem.

Výhody Single-Page Aplikace:

  • SPA je rychlé, protože většina zdrojů (HTML+CSS+Skripty) je načten pouze jednou během životnosti aplikace. Pouze data jsou přenášena tam a zpět.,
  • vývoj je zjednodušený a zjednodušený. Není třeba psát kód pro vykreslení stránek na serveru. To je mnohem jednodušší začít, protože můžete obvykle nastartování rozvoje ze souboru file://URI, bez použití serveru.
  • SPAs lze snadno ladit s Chrome, protože můžete sledovat síťové operace, zkoumat prvky stránky a data s nimi spojená.
  • je snazší vytvořit mobilní aplikaci, protože vývojář může znovu použít stejný backendový kód pro webovou aplikaci a nativní mobilní aplikaci.
  • SPA může efektivně ukládat do mezipaměti jakékoli místní úložiště., Aplikace odešle pouze jeden požadavek, uloží všechna data, pak může tato data použít a funguje i offline.

nevýhody jednostránkové aplikace:

  • je velmi obtížné a není snadné provést SEO optimalizaci jednostránkové aplikace. Jeho obsah je načten Ajaxem (asynchronní JavaScript a XML) – metodou výměny dat a aktualizace v aplikaci bez aktualizace stránky.
    aktualizace 27.09.2017: ve svém komentáři Iris Shaffer správně poukázala na to, že to lze provést i na straně serveru. Ve skutečnosti je to dnes jednodušší, než tomu bylo dříve.,
  • stahování je pomalé, protože ke klientovi musí být načteny těžké klientské rámce.
  • vyžaduje, aby byl přítomen a povolen JavaScript. Pokud některý uživatel zakáže JavaScript ve svém prohlížeči, nebude možné správně prezentovat aplikaci a její akce.
    aktualizace 27.09.2017: ve svém komentáři si Iris Shaffer všimla, že s izomorfním vykreslením na straně serveru můžete stránku vykreslit již na serveru. Když je počáteční vykreslení na serveru a může být uloženo do mezipaměti, zakázání JS by nebylo problémem pro získání vykreslené stránky., Teoreticky je to tak. Je zřejmé, že můžete vykreslit na straně serveru. Nedostatek JS však může být problémem pro další funkce. Mnoho věcí lze provést v HTML & CSS, ale z mé zkušenosti by bylo peklo to udělat tímto způsobem místo použití JavaScriptu.
  • ve srovnání s „tradiční“ aplikací je SPA méně bezpečná. Díky Cross-Site Scripting (XSS) umožňuje útočníkům vkládat skripty na straně klienta do webové aplikace jinými uživateli.,
  • únik paměti v JavaScriptu může dokonce způsobit, že výkonný systém zpomalí
  • v tomto modelu se tlačítka zpět a vpřed stanou nefunkčními.
    aktualizace 27.09.2017: dnes už to není problém.

vícestránková aplikace

vícestránkové aplikace fungují „tradičním“ způsobem. Každá změna např. zobrazit data nebo odeslat data zpět na požadavky serveru Vykreslování novou stránku ze serveru v prohlížeči. Tyto aplikace jsou velké, větší než lázně, protože musí být. Vzhledem k množství obsahu mají tyto aplikace Mnoho úrovní uživatelského rozhraní., Naštěstí už to není problém. Díky Ajaxu se nemusíme obávat, že velké a složité aplikace musí přenášet spoustu dat mezi serverem a prohlížečem. Toto řešení se zlepšuje a umožňuje aktualizovat pouze určité části aplikace. Na druhou stranu přidává větší složitost a je obtížnější se vyvíjet než jednostránková aplikace.

výhody vícestránkové aplikace:

  • je to perfektní přístup pro uživatele, kteří potřebují vizuální mapu, kam jít v aplikaci., Solidní, málo level menu navigace je nezbytnou součástí tradiční vícestránkové aplikace.
  • Velmi dobré a snadné pro správnou správu SEO. To dává lepší šance na hodnost pro různá klíčová slova, protože aplikace může být optimalizována pro jedno klíčové slovo na stránku.

nevýhody vícestránkové aplikace:

  • neexistuje možnost použít stejný backend s mobilními aplikacemi.
    aktualizace 27.09.2017: tehdy, když jsem psal tento článek, neměl jsem mnoho zkušeností s backendem as mobilními aplikacemi., Nyní je pro mě zřejmé, že můžete použít stejný backend pro oba. A rád bych poděkoval všem čtenářům, kteří na to upozornili.
  • Frontend a backend vývoj jsou pevně spojeny.
  • vývoj se stává poměrně složitým. Vývojář musí používat rámce pro obě strany klienta a serveru. To má za následek delší dobu vývoje aplikací.

SPA nebo MPA?

před nasazením webové aplikace je třeba zvážit její cíl., Pokud víte, že potřebujete více kategorií (protože například provozujete internetový obchod nebo publikujete spoustu dalšího obsahu) — použijte vícestránkový web. Pokud jste si jisti, že váš web je vhodný pro čistý jednostránkový zážitek-jděte na to. A pokud máte rádi lázně, ale jen stěží se vejde vše do jedné stránky, zvažte místo toho hybridní web. To je další způsob, jak jsem se ještě nezmínil. Hybridní aplikace bere to, co je nejlepší v obou přístupech, a snaží se minimalizovat nevýhody., Je to ve skutečnosti aplikace na jednu stránku, která používá kotvy URL jako syntetické stránky umožňující více při vytváření navigace prohlížeče a funkce předvoleb. Ale toto je téma pro další článek.

Možná, že v budoucnu, všichni budou používat Single Page Aplikace modelu (včetně hybridní aplikace), jak se zdá přinést spoustu výhod. Mnoho aplikací na trhu migruje k tomuto modelu. Nicméně, protože některé projekty prostě nemohou zapadnout do SPA, model MPA je stále živý.

původně publikoval Paweł Skólski na neoteric.eu/blog 1. Prosince 2016.