Nový Seznam Email – klientská aplikace
Nový Seznam Email – klientská aplikace
- Webová interaktivní prezentace
- "?" zobrazí krátkou nápovědu
- Tisk jako obvykle
- Pro pokračování stiskněte mezerník
Bojový plán
- Architektura JavaScriptové aplikace
- Moderní technologie: HTML5, CSS3, JS API
- Síťová komunikace
Architektura JavaScriptové aplikace
Architektura JavaScriptové aplikace
- Téměř 700kB a 24k řádek kódu
- Minifikace pomocí Google Closure Compiler (přes 400kB)
- Psáno pomocí frameworku JAK
Komponentní systém
- Soustava ~15 volně provázaných komponent
- Komponenty korespondují s částmi UI a hlavními uživatelskými úkony
- Rozložení komponent je proměnlivé (2/3 sloupce, kancelářské, …)
- Komponenty jsou volně provázány systémem událostí (vzor Observer / PubSub)
Moderní technologie
Moderní technologie: HTML5
- Pro nepodporující prohlížeče JS polyfilly
- Nové značky a atributy:
<meter>, <progress>, @placeholder
- WYSIWYG editor pomocí
@contenteditable
Moderní technologie: CSS3
- Vektorové ikony pomocí
@font-face
- Stíny, barevné přechody, průhlednost, kulaté rohy
Moderní technologie: JS API
- XMLHttpRequest 2, File API (nahrávání příloh)
- localStorage (některá nastavení)
- History API (ukládáná stavu do URL, tlačítko zpět)
Síťová komunikace
Síťová komunikace – požadavky
- E-mailový klient potřebuje přenášet velká množství dat
- Uživatel očekává rychlou reakci (vs. desktopový klient)
- Notifikace o nové zprávě
Síťová komunikace – řešení
- Transportní binární protokol FastRPC
- Intenzivní cachování přijatých dat
- Dvoúrovňová cache: výčet zpráv ve složce / štítku, celá těla vybraných zpráv
- FIFO, omezení zabrané paměti
- Periodické dotazování na změnu stavu schránky
- Informace o změně stavu též v každé odpovědi od serveru