V úvodním článku seriálu o Ajaxu vám popíšu, co to Ajax je, k čemu se používá a kdo ho používá.

Co je Ajax?

Ajax byl jako zkratka pro asynchronní JavaScript a XML vytvořen Jamesem Garrettem v článku publikovaném na webové stránce společnosti Adaptive Path. Tento článek publikoval v únoru 2005 na webu s názvem Ajax: A New Approach to Web Applications (Ajax: nový přístup k webovým aplikacím).

Ajax se doslova vřítil na scénu webových aplikací a nabídl vysoce interaktivní webové aplikace náramně se podobající těm desktopovým, neboť mění obsah svých stránek bez nutnosti jejich znovunačtení.

Často se pomocí Ajaxu realizují tzv. našeptávače. Když píšete něco do textového políčka, tak je váš text průběžně odesílán na server, zpětně pak dostáváte nápovědná slova, která byste mohli chtít napsat. Ta vám poté předkládají ve formě seznamu pod políčkem. Může sloužit také například jako kontrola dat zadaných do formuláře při registraci nového uživatele nějaké aplikace. Uživatel zadává své přihlašovací jméno a mezitím na pozadí pomocí Ajaxu probíhá kontrola, zda nick není již v databázi.

Co Ajax přináší?

• Ajax vám umožňuje vytvářet mnohem lepší a přístupnější weby a webové služby pro uživatele, např. čtenáře vašeho internetového magazínu.
• Díky své popularitě již existují pro tuto techniku návrhové vzory, které umožňují vývojářům snazší práci a osvobodí je od „vynalézání kola“.
• Nevyužívá žádnou novou technologii. Ajax pouze spojuje staré technologie v jeden mocný celek.
• Vývojáři se nemusí učit nic nového, stačím jim dosavadní znalosti.
• Výborná integrace s funkcionalitou danou webovými prohlížeči.

Jak Ajax použiji?

• Jedno využití je například u kontroly dat na straně serveru ještě před odesláním stránky uživatelem serveru. Jak jsem již zmínil, vynikající je to při registracích, kdy zadáváme e-mail, nick a jiné údaje. Na pozadí během doby, kdy uživatel vyplňuje formulář, jsou vyhodnocována (na serveru) doposud zadaná data a čtenář je upozorněn na případné chyby ještě před odesláním stránky na server.
• Tvorba aplikací, jaké používá Google, jako Gmail, Google Dokumenty, Google Suggest a jiné.
• Programování datových mřížek, které nám umožní za běhu aktualizovat databázi na serveru.
• Pro vytvoření aplikací, které za běhu vyžadují aktualizace z různých externích zdrojů, jako RSS čtečky apod.

Jaké mi mohou nastat problémy?

• Stránky s Ajaxem není jednoduché bookmarkovat (přidávat do Oblíbených, do Záložek)
• Vyhledávač nemusí být schopen indexovat všechny stránky ajaxové aplikace
• Nefunguje tlačítko zpět jako u běžných internetových aplikacích
• Při vypnutém JavaScriptu na straně klienta se stává vaše Ajaxová aplikace nefunkční

Kdo ho používá?

Gmail

Zdarma dostupný e-mail od Google nabízí uživatelům snadnou použitelnost. Uživatelské rozhraní je jednoduché a prosté. Interakce s uživatelem a komunikace se serverem probíhá bez zádrhelů. Gmail používá Ajax jako prostředek pro poskytnutí výjimečných uživatelských prožitků.

The RoundCube – odkaz [ http://roundcube.net ]

The RoundCube je zdarma dostupný webmailový klient. Tuto skvělou aplikaci uplatní začínající webhostingy pro poskytnutí přístupu k e-mailovým schránkám přes webové rozhrání svým klientům. V některém článku určitě proberu instalaci tohoto skvělého systému.

Google Suggest – odkaz [ http://www.google.com/webhp?complete=1&hl=en ]

Jednoduchá kopie hlavní strany portálu Google. Rozdíl nepoznáte žádný, pokud nezačnete psát do textového pole. Během vašeho psaní získává Google Suggest ze serveru relativní návrhy a zobrazuje pojmy, které by vás mohly zajímat. U každého návrhu je zobrazen počet výsledků, které dostanete, pokud se pro daný termín rozhodnete.

A9 – odkaz [ http://www.a9.com ]

Amazon.com je světově proslulý tím, že je online obchodem se vším. Web A9 se chlubí pokročilým vyhledáváním, které umožňuje vyhledávat různé typy informací zároveň. Pro hledání webů a obrázků používá web MSN. Knihy jsou vyhledány na Amazon.com, filmy na IMDb. A9 dělá unikátním jeho způsob fungování uživatelského rozhraní.

Další příklady:

• Google Maps [ http://maps.google.com ]
• Yahoo! News [ http://news.yahoo.com ]
• Blog Liip [ http://blog.liip.ch/ ]