Články
Spíte dobře? Připravili jsme pro Vás články, které Vám nedají spát.Co dokáže AJAX?
9. 5. 2007 | Martin Cajthaml
AJAX už dnes asi většina lidí zajímajících se o web zná. Překvapuje mě však, že spousta z nich neví přesně, co všechno AJAX dokáže a co už ne. Nakonec mi připadá, že každé použití Javascriptu ve web 2.0 aplikacích je dnes označováno za AJAX. Pojďme si tedy ukázat pár AJAXových příkladů pomocí různých javascriptových knihoven a rozdělit, co AJAX je, a co není.
Martin Cajthaml
IT ManagerBez serveru to nejde
Podstatou AJAXu je načítání dat Javascriptem na pozadí pomocí protokolu HTTP. Bez webového serveru se tedy při AJAXu neobejdete. Pokud webová stránka žádná data takto nenačítá, nejedná se o AJAX. Příkladem můžou být různé javascriptové efekty (pomocí dynamických úprav zdrojového HTML). Tyto efekty však aplikace AJAXu často doprovázejí. Proto je důležité rozlišovat, zda na webu chcete pouze vizuální efekty, či skutečné využití AJAXu (např. i k tvorbě RIA). V další části uvedu několik příkladů efektů bez použití AJAXu.
Bez AJAXu
Bez použití AJAXu musí mít stránka nahrána všechna data už při načtení stránky.
To je samozřejmě velmi omezující v tom, jaké funkce od takové stránky
lze čekat. Samozřejmě může být použito těch nejlepších vizuálních
efektů, ale pořád je to v podstatě „jen“ HTML stránka. Při nutnosti
komunikace se serverem musí být načtena stránka znovu a celý
uživatelský zážitek je ten tam. Přesto jsou takové stránky občas chybně
označovány za AJAXové. Zde jsou některé ze zmíněných efektů:
Plynulé změny pozice a velikostí
Zobrazování a schovávání
Navigační prvky
Obsah1
Obsah2
Obsah3
Obsah4
S AJAXem je zážitek
Jakmile stránka využívá AJAX, je uživatel příjemně překvapen plynulostí procesů na ní. Většina akcí se dá provést bez nutnosti načítat jinou stránku, takže se vše blíží běžné desktopové aplikaci. Takových aplikací AJAXu lze najít velké množství a jsou velmi různorodé. Od obyčejného načítání určité části stránky, po skutečné RIA aplikace, které nahrazují ty běžné. Většinu z nich lze samozřejmě považovat za součást Webu 2.0.
Příkladem využití čistého AJAXu bez dalších efektů může být například takový chat. Určitě zanechte vzkaz ;-)
AJAXu můžeme také jednoduše využít u již uvedeného příkladu se záložkami. Jejich obsah lze ovšem načítat ze serveru, a je tedy aktuální. Navíc je možné využít AJAX i pro další užití v nich - např. validaci a odeslání formuláře.
Jelikož je u AJAXu podstatou asynchronní načítání dat, lze toho využít kupříkladu pro jejich dynamické zobrazovaní, např. v tabulce se stránkováním. Tato využívá jako zdroj dat databázi.
AJAX a RIA
Běžné desktopové aplikace využívají určité knihovny systému pro zobrazování sebe sama. AJAXové aplikace mohou využívat javascriptové knihovny místo systémových
a vytvářet svůj vzhled pomocí nich. Existují dokonce knihovny
podporující určitou část uživatelského rozhraní známou z běžných
aplikací. Dokážou vytvářet a zavírat okna, v nich menu, tlačítka,
formuláře a prakticky cokoliv vás napadne. Díky těmto knihovnám vznikají stále častěji webové verze známých aplikací.
Dnes si tak díky tomu můžeme na webu napsat dokument, vytvářet tabulky,
prezentace, pracovat s obrázky a další běžné věci.
Nejrozšířenější knihovny
Přiznám se, že já nejčastěji využívám Dojo toolkit
,
ale těch „lepších“ knihoven je větší množství a každá se hodí na trochu
odlišné věci. Hlavně z důvodu množství implementovaných funkcí a
efektů. Ostatně mnoho z nich je postaveno na kultovní knihovně Prototype
. Pojďme si tedy pár nejrozšířenějších (čistě javascriptových)
stručně představit.
- The Dojo toolkit
- Rozsáhlý toolkit velmi usnadňující vývoj nejen „velkých“ aplikací v Javascriptu. Pomocí vysoké úrovně abstrakce umožňuje nejen používání (X)HTML, ale také generovat výsledek do SVG či jiných uživatelem definovaných formátů. Obsahuje mnoho známých prvků již implementovaných a připravených k okamžitému použití. Umožňuje navíc snadno další prvky doprogramovat uživatelem. Velkou výhodou je rychlost vývoje a snadná použitelnost.
- Scriptaculous
- Šikovná knihovna pro různé vizuální efekty postavená na Prototype knihovně. Výhodou je jeho snadná implementace pro spolupráci v mnoha programovacích jazycích (včetně např. smalltalku!). Moc pěkné a efektní, zakládá si na kvalitním uživatelském rozhraní.
- Yahoo UI
- Sada knihoven vyvíjených společností Yahoo je velmi profesionální. Přístupem se podobá Dojo toolkitu (jen je trošku „ukecanější“). Obsahuje standardně pěkně graficky zpracované elementy a navíc různé CSS vychytávky (použití stejného fontu nezávisle na prohlížeči, různé šablony, atd.).
- MochiKit
- Označuje sám sebe za odlehčenou javascriptovou knihovnu, avšak nabízí širokou paletu funkcí. Obsahuje snad jen méně předpřipravených prvků a efektů oproti předchozím. Výhodou je menší velikost a větši rychlost načtení.
- Rico
- Ve verzi 2.0 skutečně impozantní knihovna se spoustou zdrojů založena také na knihovně Prototype. Snad nejsnadnější používání Drag&Drop operací, jaké jsem viděl. Vývoj s ním jde rychle od ruky.
Budoucnost (nebo současnost?)
AJAX lze už dnes považovat za platformu. Platformu tak rozšířenou, že na poli RIA určitě konkuruje Flashi či Javě. Pro AJAX mluví hlavně výhoda nezávislosti platformy backendu. Ten může být vytvořen v jakémkoliv programovacím jazyce a zpřístupněný přes web server. Za poslední roky se navíc rapidně zvyšuje počet a kvalita AJAXových knihoven, a tak mi nezbývá než se těšit na světlé zítřky internetových aplikací.
Chcete uveřejnit náš článek?
Máte zájem některý z našich článků publikovat ve Vašem časopise, webu či kdekoliv jinde? Neváhejte nás kontaktovat!
Zažádat o svolení


Vaše názory