KONFERENCE WEB_EXPO 2011

Development Hall // RB101

        

DEV_HALL

DEV_ROOM

DESIGN

BUSINESS

Základní pokyny

  • Zapisujte poznámky z přednášky, formátujte, odkazujte a doplňujte
  • Chovejte se prosím slušně :)
  • O tento dokument se za VŠE GUG stará IVAN_KUTIL(@CODEAS)

Obsah

Pátek 23.9.2011

Sobota 22.9.2011

Pátek 23.9.2011

Introduction to web intents

10:00  –  10:30 // Paul Kinlan

www.webintents.org

  1. Web intents is framework for client-side service discovery and inter-appliaction communication
  1. jako Android intent
  1. new Intent(akce, datový typ, data)
  1. Akce (jako URL)
  1. Share  –  pro sdílení
  2. Edit
  3. Pick
  4. Save
  1. datový typ
  1. “text/uri-list
  1. data
  1. window.location.href
  1. Demo cloud file picker
  2. “změní to způsob jakým z
  3. odkazy
  1. webintents.org
  1. slajdy: webintents-preso.appspot.com

Novinky z konference Build

10:30  –  11:30 // David Grudl

Vývojář a cloud

12:00  –  12:30 // Michael Juřek

  1. Development

Cassandra

12:30  –  13:00 // Michael Augustýn

nosql databáze

kdy se hodí

Cassandra vznikla ve Facebooku, nyní ji však už nevyužívá.

běží v Java

Používá binární protokol Thrift nad TCP

využívá jazyk CQL

keyspace - db

column family - tb

požívá klíče pro řádky

neudává se datový typ je možné použít libovolný počet sloupců

- obecně jsou to pole bajtů

vkládáme/vybíráme sloupce (ne řádky)

Cassandra je hloupé úložiště, vše kromě uložení do db musí řešit vlastní aplikace.

Select se dělá stejně jako v SQL, pokud je podmínka jiná než jen dotaz na klíč, je třeba vybudovat nad sloupcem index. Jedná se o jednoduchý hash index.

Cassandra nerozlišuje insert a update.

Při použití sekundárního indexu je výhodné zapouzdřit dotazovací metody do samostatných tříd.

Většina dotazů se dělá proto, aby se data zobrazovala uživateli. Toto propojení nemusí jít vůbec přes samotnou aplikaci. Navenek to může být tak, že máme dvě separátní aplikace, jedna, která mění stav druhá, která jej jen čte.

Zápis může být řešen pomocí messagingu, kdy aplikace dává do fronty požadavky na změnu, které jsou zachytávány a zpracovávány.

Nepoužívejte Cassandru, pokud se to nevyplatí. :)

Velmi dobrým nápadem je oddělit čtení a zápis, škálování je pak mnohem jednodušší.

Přístup: CQRS

Udi Dahan

..

..

zápis tivvit a @winsik

Jak jsme převáděli desktopovou aplikaci Flexibee do cloudu

13:00  –  13:30 // Peter Ferchschmann

Flexibee má programátorské rozhraní. Aplikace už na desktopu využívala nativní protokol - něco jako tcp stream.

Cloud je jako česká pošta - cena za vhozenou obálku neodpovídá způsobu ani vzdálenosti doručení. Cloud je poskytování služeb ve velkém, aby to bylo levnější. Rozdíl mezi cloudem a hostingem je takový, že během několika minut dokáže naškálovat stahování na stovky gigabyte.

Ve chvíli, kdy se pro každého klienta použije vlastní virtuální stroj nehledě na to, jak se připojuje, jsou velké výkyvy v užití služby, ale fixní náklady.

přístup k databázi pouze jako zabranému místu na disku v případě, že je klient nepřipojen.

Replikace master slave u postgress - vypadne master a nefunguje nic. Využívají couchdb pro uložení řídících informací o uživatelích. Couchdb umí replikovat mezi systémy a pověsit akce na události.

Load Ballancer - použit Varnish. a node.js pro poslech událostí z couchdb.

Malé servery, s konfigurovatelnými rolemi a rychlou možností replikace.

Důležitý je systém puppet, snižuje náklady a administrativu.

Klienti často porovnávají cenu a ne vlastnosti.

Using web APIs with OAuth 2.0

14:30  –  15:00 // Nicolas Garnier

How to use Google’s Web APIs

Slides: http://web-apis-slides.appspot.com/ 

Google’s APIs are RESTful. JSOrN.

3 types of access:

  1. Anonymous (e.g. goo.gl)

Demo: http://web-apis-demo.appspot.com/ 

What is OAuth 2.0

REST APIs

Introduction to WebGL

15:00  –  15:30 // Ilmari Heikkinen

  1. Shaders  –  malé programy říkající “co se má nakreslit” a “jak se to má nakreslit”
  1. Vertex Shader, Fragment Shader
  1. Příklady her: Angry Birds, Monster Dash, Gun Bros
  2. Další využití  –  image processing
  1. zpracovává se na grafice (=rychlejší)
  2. např. http://evanw.github.com/glfx.js/
  1. Zajímavá ukázka 3D modelovacího nástroje http://tinkercad.com/
  2. Další ukázka: http://ship.shapewright.com
  3. Three.js
  1. JS 3D Engine
  2. WEBGL renderer

MongoDB

15:30  –  16:15 // Lukáš Linhart

Tak jako si vybíráme jazyky a frameworky, můžeme si vybrat databázovou architekturu. Není tam ani zmínka o SQL, nebo relacích.

ACID -

BASE

CAP teorém - v distribuovaném datab. systému můžete mít vždy max. dvě z těchto tří vlastností:

Nejprve vybírat produkt (určit požadavky), až poté prostředí.

Zachycení velkého množství informací od uživatele není úplně jednoduché. Co s tak velkým množstvím dat - serializace, normalizace, není rozumné provádět časté změny schématu databáze.

Joke: Zjistili jsme, že lidé nechtějí používat nastavitelný layout, vypnuli jsme to a seznam to začal používat :)

Mongo je dobré a jednoduché, vezme se JSON od kodéra a upustí se do databáze a je tam. Není třeba řešit schéma.

Uvnitř se používá BSON - binární JSON

Replica set - několik nodů, které se chovají jako cluster. automatická replikace z více datacenter.

Mongo je rychlé … přestože přepínání prezentace je pomalé :)

Inplace updaty jsou rychlé. Předběhnete sami sebe :)

Data rostou, je možné definovat, že zápis nebude považován za dokončený, dokud nebude informace na určitém počtu replikací

Skoro všichni ukládájí obrázky na server, do DB jen název - proč? v SQL datab. je to pomalé.

GridFs - způsob uložení velkých objemů dat v DB

Mongo nemá jurnal (http://www.mongodb.org/display/DOCS/Journaling ), při použití kill -9 není zaručeno, co se povede obnovit.

Není vhodné mít data na 32 bit verzi. Limit 4 GB se může zdát hodně, ale ta verze není otestovaná, je na vývoj. Je to podobné, jako používat Mongo na jednom stroji.

Jsou lidé, kteří musí ty slepé uličky projít.

Mongo nepoužívá V8 engine. Při zápisu používá pouze jedno vlákno (problémy lze vyřešit shardingem - pak zápisy vyřizuje vždy server, na kterém daná část dat má ležet). Dostatečně dlouhým zápisem je možné jej zabít. Vytváření indexů bez příznaku na pozadí, tak to dopadne stejně.

Pozor na školní předpoklady - člověk předpokládá, že když něco zapíše, tak to tam je. Je třeba dávat pozor na nastavení zápisu - bezpečný zápis je pomalejší, ale je bezpečný. Poslání na socket nezaručí zápis. Doporučeno měření a benchmarkování, testování krizových stavů.

Nevidím schéma:

Replikační set - nemá load balancing, výkon je omezen výkonem masteru. V případě výpadku mastera se začíná volit nový master, tato operace trvá několik sekund => dochází k výpadku.

Když máte s něčím problém: upgradujte … a přepište nekompatibilní části - musíte být připraveni sledovat vývoj a přizpůsobovat svůj produkt vývoji.

zápis @winsik, @milanlempera and @radeksimko

Za hranicemi jQuery

16:25  –  17:10 // DANIEL STEIGERWALD

Zejména ti, co neznají JavaScript, znají jQuery.

Vývoj jQuery se téměř zastavil, a vývoj pokračuje prostřednictvím pluginů.

jQuery využívá God object - je antipattern - objekt umí příliš velké množství nesourodých věcí.

jQuery je základ pro hobby programátory a relevantní způsob, jak vyvíjet malé aplikace. Za úspěchem jQuery stojí zejména to, že neobsahuje zbytečné množství enterprise technologií, to je také ale jeho velká slabina.

co chybí v JQuery?

Tři generace JS knihoven:

Must have - spoustu úspěšných aplikací, vůbec nevyužívá

Nice to have:

Budoucnost

Dart!

kontakt :) daniel@steigerwald.cz

Dart zabije JavaScript, z JavaScriptu se stane opravdu assembler, již nyní existují precompilery - CoffeeScript

Jde to ale i s jQuery

Hláška: Dva nejobtížnější problémy v programování: pojmenování věcí a invalidace cache

Firebug bude umět přímo debugovat CoffeeScriptový kód.

t

zápis: @winsik, @milanlempera a …

Serversideness

17:30  –  18:45 // Douglas Crockford

JavaScript na serveru není nový nápad.

Základní výhoda je, že stejný kód může běžet na obou stranách. V ajaxových aplikacích často závisí na funkčnosti také bez JavaScriptu. Na straně serveru tak nemusí být rozdílný kód, ale může se použít pro generování statické stránky také tento kód.

node.js stojí na callback funkcích vztažených k událostem. Není tak potřeba vláken, nedochází k deadlockům - nikdy nečekat, nikdy neblokovat, skončit posledním. Nepoužívá se čekání ve smyčce, používá se událostmi řízeného přístupu. Delší úkol by měl být rozdělen na menší oddělené procesy.

Práce v aplikacích ve vláknech je zlo. Vlákna způsobují zaseknutí, nebo soutěží o strojový čas. Může docházet k nepředvídanému stavu v nesynchronizovaných datech.

Sobota 22.9.2011

Symfony 2

10:00  –  10:30 // Pavel Campr, Jiří Praus

Build your application, not your Tools.

Vývoj na GitHubu, pracovalo na něm 250 vývojářů. Snaží se držet standardů a dobrých praktik.

Možnost využít komponenty, nebo jako fullstack framework.

Symfony si při instalaci stahuje aktuální komponenty z GitHubu

Existuje bundle - jako základní organizační jednotka - zdá se, že je to něco jako celistvý modul.

Pro konfigurace používá symfony2 yaml (ale podporuje i xml a php).

Silné využití anotací, např: pro routování, oprávnění a volba šablony.

Environments - nastavení pro různá běhová prostředí.

Využívá nejnovější PHPUnit - podpora integračních testů a profilování.

Web Debug Toolbar: možnost přihlásit se k symfony profileru a vidět logy a chování systému. Uloženo v SQLite3, možnost porovnat napříč požadavky.

Service Container - bohužel nepředstavil.

Twig - původně šablonovací systém začleněný do Symfony, možnost použít samostatně. V šabloně možno připravovat bloky, které se využívají v různých layoutech

Assetic - nástroj pro optimalizované doručování statických souborů, kompiluje a slučuje JavaScipt a CSS. Cache busting - při změně automaticky zpropaguje objekt tak, aby se u klienta použil i přesto, že jej má v cache.

Cachování - možnost cachovat jak celé stránky, tak celé bloky. Využívá HTTP možnosti pro cachování. Možnost nastavit maximální stáří konkrétního objektu. Možnost cachovat stránku jako celek, je možné ale zvolit fragmenty, které se cachovat nebudou. ESI tag.

Ochrana proti XSS, podpora formulářů a validaci. Doctrine ...

V příkazové řádce možno udělat velké množství věcí.

Chybí delší tutorial.

www.symfony.com

Prohlásil, že je to taková reklamní přednáška.

zápis: @winsik and ...

PHP in 2011

10:30  –  11:30 // Rasmus Lerdorf

Slidy: http://talks.php.net/show/webexpo2011/

1993 - začal s prvním prohlížečem Mosaic s HTML a CGI scripty.                 

1994 – PHP verze 1, první šablonovací systém, spíše než jazyk to byla soustava tagů, bylo zde pravděpodobně asi 10 uživatelů

1995 - již mělo podobu jazyka, obsahovalo značku uvození jazyka. Lidé okolo XML si nyní stěžují, že by chtěli ten tag používat, ale je zabrán tím PHP, navrženo pro rychlé scriptování.

Po deseti letech lidé spíše než základní strukturu požadují objektově orientovaný přístup, proto jej PHP začalo nabízet.

PHP není stavěno jako jazyk pro velké přemýšlení, ale tak, aby posloužilo své věci. Lidi nezajímá jak sexy je kód, ale jak dobře se web používá.

Největší výhodou je, že lidé mohou začít, přestože nemají vůbec žádné znalosti. Spousta věcí se dá udělat doslova během pár minut.

YQL - dotazovací jazyk pro web. Velmi jednoduché použití z php.

Vašemu zákazníkovi je jedno, jak moc je váš kód sexy - chce, aby to fungovalo.

2011 - PHP 5.4

Výkon

Je nutné kontrolovat chyby, nevypínat chybové hlášení, ale ošetřovat je, každý error, warning a notice spotřebovává velké množství času.

Profilování pomocí valgrind, nebo XDebug může ukázat slabá místa. Často stačí nastavit konfigurační hodnotu, aby nebylo nutné získávat hodnotu stále znova. Ukáže se, které části jsou důležité a které ne.

Pecl/inclued - ukáže, kolik includů se provede na request, spotřebovává to čas. Je dobré dívat se po frameworcích, jak s tím pracují.

Při komunikaci s vývojáři frameworků naráží na to, že se zabývají programátory, pro něj jsou ale důležití zákazníci.

Statická analýza - pomocí HipHop-PHP se PHP konvertuje do C++. HipHop je překvapivě mnohem lepší než samotné PHP. Podporuje statickou analýzu. PHP umí tyto věci najít taky, ale najde je až během runtime.

Architektura by měla rozkládat požadadavky na více domén, zejména pro statický obsah, zde by neměly být aktivní cookies.

Délka cookies by měla být krátká, pozor na MTU.

Nemělo by se servery přetěžovat a snažit se posílat na jeden webserver velké množství požadavků.

Nevytahujte relační data mimo realační databázi, ale nevkládejte do ní relační data.

PHP 5.3

Closures - vkládání funkcí dovnitř kódu. Pro změnu kontextu se pužívá use, které nám dovolí používat v closures vlastnosti a parametry nadřazených tříd.

Nejzajímavější věc na namespaces je, že lidé nenávidí zpětné lomítko jako oddělovač (bylo to ale jediný single-character, který nebyl pro nic jiného používán - a psát nějakou unicode opičárnu nebo použít sekvenci několika znaků zavrhli)

garbage collector - lepší uvolňování paměti.

NOWDOC (synatxe jako HEREDOC, jen použít jednoduché uvozovky, => v textu nejsou expandované proměnné)

goto - možnost vyskočit ven z mnoha větví (nic jiného neumožňuje) - Kdo nenávidí goto … všichni jste idioti :) Goto v php není zlo.

__DIR__

__callStatic - možnost magicky volat statické metody. Také možno je volat dynamicky.

Vylepšená práce s datumy - možnost získat všecny třetí středy v každém měsíci. Možnost specifikovat formát při dekódování z řetězce.

SPL - GlobIterator - procházení souborů podle regulárního výrazu. Fronty, Haldy,

FPM součást PHP.

Rozšíření ini a možností nastavení v .htaccess.

PHP 5.4

Lepší správa paměti, vyšší výkon, odstranění mnoha nastavení. safe_mode odstraněno. y2k_compliance bylo velmi oblíbené :)

Traits - copy paste asistované kompilátorem, účelem není přímo nahradit vícenásobnou dědičnost, ale zkrátit kód. Říká, jaký kód bude konkrétní třídou využíván.

Zkrácená syntaxe pro zápis pole. Referencování návratové hodnoty funkcí přímo.

Closures - možnost odkazovat se na private property, přestože  jsou volány zvenčí třídy. Možnost vracet closures jako návratovou hodnotu funkce a volat je přímo.

Zápis binárních čísel.

Nové rozhraní JSONSerializable

<?= je vždy přístupný, i pokud jsou vypnuty zkrácené tagy, protože nekoliduje s xml

Vestavěný webserver pro testování.

Prosím testujte PHP 5.4 a křičte nyní.

Diskuse

Při použití HipHopu je třeba brát zřetel na to, že je napsán speciálně pro potřeby Facebooku.

Neplánuje zavádět objektové základní typy nebo silné typy jako číslo nebo řetězec (“1+1 works just fine for me”).

Traity jsou řešeny na úrovni compileru, v konečném důsledku nejde poznat, že jde o trait, je to možné zjistit pomocí reflexe

Problém frameworků je, že se snaží dělat všechno pro všechny. Pokud se předejde spouštění dynamických všemožných kontrolám na konkrétní nasazení, které jsou stále stejné, může být velmi rychlým frameworkem a být schopen obsloužit velké množství požadavků.

slidy: http://talks.php.net/show/webexpo2011

zápis: @winsik a @OndraM a ...

Strategie kešování

12:00  –  12:30 // Michal Špaček

 

HTTP level cache

Hlavičky v odpovědích

Proxy cache

Kešování na úrovni aplikace

Největší problém je invalidace cache.

Kešujte cokoli a kdykoli je to možné - ale mažte data z cache, když je to potřeba.

Hezký teoretický článek http://www.phpguru.cz/kaskadova-cache

zápis: @milanlempera

Scala  –  jazyk budoucnosti

12:30  –  13:00 // Zdeněk Farana

Scala

Paralelní programování

framework Akka 2.0

zápis: @milanlempera

Elasticsearch: za hranice běžného fulltextového vyhledávání

14:30  –  15:30 // Karel Minařík, Lukáš Vlček

http://www.slideshare.net/karmi/elastic-search-beyond-ordinary-fulltext-search-webexpo-2011-prague

https://github.com/karmi/elasticsearch_webexpo_demo

Dnešní přístup tlačí hledání jako způsob používání webu nebo počítače.

Spousta stránek implementuje search naprosto lajdáckým přístupem.

Search is hard, Lets go write SQL queries

Prague spring - celý web by měl být centrován kolem searchem.

Jak hledání funguje:

když hledáme ve třech souborech ruby - jeden je o jazyku, druhý o písničce a třetí o drahokamech

Hledání často využívá inverted index(datová struktura s odlišným pohledem na data, slova se odkazují na místa kde jsou uložena)

Je praktické vědět jak search funguje a nehledat za ním magii, důležitý je analytický krok.

Knihy:

ElasticSearch založen na Lucene v jave.

Využívají jej v ataxo social insider. Data uložena v couchdb, ale všechny dotazy jdou do elasticsearch

Vlastnosti:

HTTP rozhraní - možno ovládat jaikoukoli http knihovnou klidně i curl pomocí požadavků posílajících a získávajících json json. Možnost rozšiřovat pomocí nástrojů využívajících http protokol - nginx...

Json - komunikace v json, umí jej sparsovat. je možné vědět že něco má nějaký formát. možno hledat v indexovaných součástech. Je možné dělat range queries

Schema Free - možno ukládat jakoukoli strukturu dokumentu

Index as Resource - možno hledat v jednom indexu, více indexech nebo celém clusteru. Když je uloženo něco v určitém id, je možné jej získat, dokonce verzovaně. Pro některé druhy informací je možné použít místo databáze. Možné využít alias pro více indexů, a vymazat část indexu.

Distributed - je tak navržen, existuje nějaký cluster, který má jméno. jeho uzly se umí navzájem identifikovat, jeden z nich je master, a ostatní se replikují. Možné rozdelit index na několika částí a replikovat v několika kopiích. Škálování je možno rozdelením na částí - zvýší výkon indexování, případně zvyšovat části replikované - zvyšuje výkon hledání.

Queries - podporuje Lucine queries, možno využít také Query DSL. Podobně funguje geosearch, kde je možné hledat objekty vzhledem k vzdálenosti. Facety - filterování podle tagů. Geo facety.

Mapping - v případě větších požadavků je možné změnit věci ovlivňující hledání, analyzery, url  …

Ruby - klient github.com/karmi/tire

Velikost indexu je možné ovlivnit analyzátorem, a způsobem uložení dat.

Nemá smysl před něj dávat loadballancer, protože škáluje samotný elasticsearch.

Pokud je potřeba nejvyšší výkon - použít Java API místo HTTP.

Má český jazykový analyzer - Lukáš Vlček (pozn. od Lukáše Vlčka: Lucene samotné obsahuje Czech Analyzer a také Czech Stemmer a protože ElasticSearch používá Lucene, tak umí i češtinu. Když @karmiq mluvil o tom, že je to moje zásluha, tak to trochu s chválou přehnal, moje zásluha byla pouze ta, že jsem do ElasticSearch backportoval češtinu před tím, než přešel na novou verzi Lucene a tak si ji čeští uživatelé mohli vyzkoušel o něco dřív.)

Jboss Community

RedHat koupil jboss, preferuje řešení postavené opensource.

Vyžadoval hledání v mail listu

Několik důvodů, kdy je vhodné dělat vlastní search engine

Hledání postavené nad elastic search, indexuje maillisty projektů - zatím není pro produkci veřejně.

Facety - dynamické filterování, zobrazení detailu Apache Tika - indexování příloh. ElasticSearch obsahuje konkrétní dokumenty - slouží jako databáze.

Přímo v dotazu je možné spočítat javascriptem určité hodnoty

Backend pouze elastic search.

zápisky: @winsik

Testování prakticky

15:40  –  16:25 // Honza Král

Všichni vědí, že testování je testování je fajn, ale testuje podstatně méňe lidí.

Spousta z nás testuje manuálně - nemáme počítače od toho, abychom nemuseli dělat věci manuálně?

Management si myslí, že testování je něco navíc, je drahé a není na něj čas - a kdo jim to řekl?

Automatické testy ušetří spoustu opakovaných činností.

Testy řeknou jen, že to na co mám test funguje nebo nefunguje, neřeknou že funguje vše.

Typy testů:

Unit testy

Integrační testy

Akceptační testy

Pokud jsou v aplikaci závislosti a není jednoduše testovatelná unit-testy, pokryjeme starší část jen integračními testy a nový či měněný kód psát tak, aby šel pokrýt unit testy.

Unit testy

View se velmi špatně testují, je potřeba mít šablony, je třeba mít připojení k databázi a nakonec je možné jen testovat to, že je vyrenderován nějaký test. Což je k ničemu.

Dále je možno mockovat databázi a šablony, jenže to je moc práce.

Další možnost je rozsekat metodu view do třídy.

Je možné věřit určitým metodám, není potřeba často mít testy na všechno. Například získání z databáze stačí jen jednou pustit a je jisté, že kód funguje, není třeba testovat kód, kde není možné udělat chybu.

Tuto třídu je možné v testech rozšířit. Stačí pak jen ověřit, že se třída snaží vyrenderovat šablonu se správnými daty, není potřeba kontrolovat, že se tak skutečně stalo, to se kontroluje už v testech šablonového systému.

Není často potřeba řešit ani databázi, data je možné podvrhnout jednoduchým objektem modelu. Detailní testy jsou potřeba jen na důležité části. Není také nutno pracovat s fyzickými daty (vyzvedávat soubory z disku, získávat data z DB), vede to ale na větší dekompozici problému mezi třídy které se na řešení používají.

Při vstupu od uživatele není nutné využívat přímo selenium pro testování vstupu, stačí testovat přímo validaci formuláře.

Ve finále je možné změnit kód na testovatelný

Testovatelný kód je lepší, lépe strukturovaný, lépe udržovatelný.

Vše je na svém místě.

Stupid TDD - když se to povede na poprvé, nemá možná smysl na to psát test, v případně jediné chyby už jo. Některé testy a chyby jsou více prioritní než jiné.

Testy samotné nestačí - přestože existují testy, je třeba je pustit, nastavit prostředí, infrastruktura pomůže jednodušeji testovat.

Není zastáncem TDD - testy napřed jak kdy, u nového projektu začít testy pomůže ujasnit, co vlastně chce udělat.

Když se najde chyba někoho jiného, je zajímavou praktikou místo opravy napsat test a poslat jej.

Unit testy pomůžou při psaní kódu, i kdyby se potom měly zahodit, například při změně kódu, pomůžou při tom integrační práce.

Použití browseru je proti testům pomalé.

zapis: @winsik a @milanlempera

Ajaxizace

16:25  –  17:10 // Jakub Vrána

materiál z přednášky: http://t.co/4M1ja4RT

Hlavní motivace pro odesílání formulářových dat nebo informací AJAXem je zejména rychlost - přenáší se jenom kousek stránky a nikoli celá.

Profesionála zdržují i milisekundy.

Má smysl se tím zabývat zejména u aplikací, které má uživatel otevřeny celý den a velmi výrazně je používá.

Většinou se končí tím, že nějaké odkazy se vyřeší pomocí AJAXu, je ale možné jít dál.

Pokud se mění stav aplikace, dá se řešit:

Hashbang

Mělo by se měnit i URL - kvůli odeslání nebo bookmarku - například měnit URL #hash tento přístup začal cca před třemi lety, funguje pak také historie, ukrádá ale možnost odkazovat doprostřed stránky.

Pokud přejde uživatel bez JavaScriptu na odkaz s hashem, nebude aplikace správně fungovat.

Je potřeba stáhnout na začátku nejen aplikaci, ale i data.

Problém s vyhledávači při indexování se řeší konvence použití #!

Ukládat stav do normálního url 

history.pushState ošetření reakce na změnu URL. Výhodou je kompatibilita s vyhledávači i prohlížeči.

Implementace

Serverová část - může na základě, jestli je použit JavaScriptový request, vygeneruje jen část, jinak celou stránku. Podle hlavičky.

Klientská část - reakce na změny URL

Na co dát pozor

Je třeba ignorovat externí URL a URL dovnitř části stránky.

Uživatel může používat Ctrl nebo prostřední tlačítko, je nutné tyto případy také řešit. Jedná se o častou chybu.

Je dobré přejít na začátek nahraného obsahu. Pamatovat si pozici při procházení historie.

Balení do JSON je nevhodné, při získávání přímo html je možné průběžně zobrazovat. Potřeba získat větší množství dat je možné pomocí hlaviček, vložení tagů, nebo vložení JavaScriptu.

Indikátor činnosti a indikátor činnosti na jiné záložce při přejití jinam, roztočit ji hned je rušivé.

Zrušení zastaralých požadavků. Reakce na rozmyšlení požadavku - Esc - nutno řešit obsluhou klávesy.

Nutno řešit také problémy výpadku serveru.

Odesílat lze i formuláře, je třeba ale řešit získání dat, případně tlačítka, na které uživatel kliknul.

Ajaxem se nedají odeslat soubory.

Přesměrování je lepší řešit speciální HTTP hlavičkou, při hlavičce Location aplikace neví, kam se dostala.

Srovnání použití jako URL

Trochu rychlejší - nemá smysl používat u obyčejných stránek. Ale u aplikací ano, transparentní pro uživatele.

Nevýhoda - jedná se často jakoby o emulování funkce prohlížeče, Selenium si nevšimne změny stavu.

Při pohybu zpět je možné využívat kopii uloženou ve stavu a nekomunikovat se serveru.

Tohle řešení je lepší než #hashbang

Existující řešení pjax množství věcí neřeší, bude ji rozšiřovat

Někdy je možné komunikovat jen pomocí přenosu dat místo celého HTML.

Na zrušení požadavku pomocí xhr.abort() reaguje PHP ukončením scriptu

zápis: @winsik a ...

CZ Podcast #52

17:30  –  18:45 // Roman Pichlík, Jiří Fabián

Půjde stáhnout jako vždy …

The Web is Our DNA