Grupa
MagazynyInternetowe.pl
Wykorzystanie technologii AJAX niesie wiele korzyści. Oferuje on znacznie więcej niż zwijane menu i ładowane na bieżąco zdjęcia. Bardzo ważne jest asynchroniczne przesyłanie informacji i nowe sposoby w podejściu do usług online.
Marcin Kosedowski
AJAX (Asynchronous JavaScript and XML) nie jest sam w sobie konkretną technologią, ale zbiorem i efektywnym wykorzystaniem już istniejących. Jego główne zalety to działanie bez przeładowywania strony, ograniczenie ilości przesyłanych danych i otwarcie przed webmasterami nowej gałęzi: aplikacji online.
Wykorzystanie dokumentów XML pozwala na użycie wielu formatów danych, takich jak kanały RSS, strony xHTML i HTML, dane z arkuszy kalkulacyjnych i dokumentów tekstowych (np. OpenOffice'a) w jeden sposób. Dzięki temu projektant aplikacji pracuje tylko na jednym formacie danych, co ułatwia zadanie. Pliki takie mogą być generowane dynamicznie lub wczytane z serwera albo komputera użytkownika.
Najbardziej "tajemnicze" słowo Asynchronous (asynchroniczny) jest w rzeczywistości największą zaletą AJAX-u. Oznacza to, że dane pobierane i wysyłane są w trakcie trwania innych akcji. Dzięki temu nie trzeba ładować od razu całej aplikacji lub strony. Dane mogą być wymieniane na bieżąco w trakcie pracy, co zwiększa wygodę użytkowania i dynamikę strony.
Całość łączona jest przez język skryptowy obsługujący model DOM (Document Object Model), zwykle JavaScript z odpowiednim frameworkiem takim jak jQuery, Prototype czy MooTools. Pozwalają one na uproszczenie kodu aplikacji i przyspieszenie czasu jej pisania kosztem mniejszej wydajności. W przypadku aplikacji AJAX część obliczeń wykonuje się po stronie klienta, więc serwer nie musi być obciążony.
Najlepszym przykładem techniki jest walidacja formularzy rejestracyjnych. Użytkownik podaje np. nowy login i przechodzi do pola z hasłem. W tym czasie skrypt łączy się z bazą, która zwraca komunikat o tym, czy dany login jest już zajęty. Ramka z loginem zostaje podświetlona, a obok pojawia się stosowny komunikat. Załóżmy teraz, że przeszukanie bazy trochę trwało - w tym czasie użytkownik wpisał swoje hasło. Działający w czasie przesyłania danych z serwera skrypt sprawdził (po stronie klienta) czy nie jest ono zbyt krótkie. To wszystko bez przeładowywania strony.
Doskonałym przykładem wykorzystania AJAX-u jest walidacja formularzy
Przykładowy skrypt walidacji formularza znajdują się na stronie: http://tetlaw.id.au/view/javas...
Dobrym wykorzystaniem JavaScriptu i odciążeniem serwera są wszelkiego typu rozbudowane aplikacje online. Przykładowe produkty Google'a: Google Maps i Docs wykorzystują w dużej mierze moc obliczeniową komputerów użytkowników zamiast posiłkować się procesorami serwerów. Dodatkowo Google Maps pobiera kolejne fragmenty mapy w trakcie przeglądania.
AJAX sprawdzi się doskonale również w galeriach obrazków. W przeciwieństwie do galerii wykonanych we Flashu (przynajmniej tych pierwszych) nie ma tu mowy o długotrwałym ładowaniu wszystkich zdjęć naraz. W trakcie kiedy użytkownik ogląda jeden obraz ładowany może być kolejny. Oczywiście bez odświeżania całej strony.
Przykładowy skrypt galerii: http://www.nickstakenburg.com/...
Ostatnimi czasy dużą popularnością cieszą się samouzupełniające się pola formularzy. Wprowadzono je m.in. w serwisie Allegro, porównywarkach cenowych i oczywiście w Google Search. Takie podpowiedzi wymagają wyjątkowej szybkości działania - prawie każde przyciśnięcie klawisza to oddzielne zapytanie do serwerów. Jest to doskonały przykład wykorzystania transmisji asynchronicznej - dane przesyłane są jednocześnie w obie strony w bardzo krótkich odstępach czasu.
Przykładowy skrypt: http://www.brandspankingnew.ne...
Jednak opieranie się wyłącznie na AJAX-ie nie powinno być zasadą. Wiele osób korzysta z rozszerzeń blokujących skrypty lub telefonów, które nie zawsze poprawnie obsługują JavaScript. W dodatku asynchroniczne pobieranie danych może być ograniczone przez przeglądarkę zainstalowaną w komórce. Mimo że popularna Opera w wersji mobilnej radzi sobie doskonale z asynchronicznymi skryptami duża grupa użytkowników korzysta z domyślnych przeglądarek dołączonych do telefonu, które wypadają zdecydowanie gorzej.
Google Docs - darmowy arkusz kalkulacyjny online może zastąpić Excela i Calca w prostych obliczeniach.
Osoby takie muszą liczyć się z utratą części udogodnień, ale do projektanta witryny powinno należeć zadbanie, aby strona była dostępna również dla użytkowników mobilnych. Więcej na ten temat pisaliśmy w artykułach Dostępność w AJAX-ie i Włącz usability.
Mimo że większość osób przyzwyczaiła się już do AJAX-u, nawet jeśli nie wie o jego istnieniu (np. podpowiedzi Google) nie każdy zdaje sobie sprawę jakie możliwości niesie za sobą ta technika. AJAX pozwala np. na wykorzystanie komputerów odwiedzających jako botnetu wykonującego obliczenia rozproszone. Przykładem takiego działania jest skrypt wykorzystywany do łamania haseł - maszyna każdego z użytkowników w trakcie trwania wizyty sprawdza część haseł i co jakiś czas zapisuje wyniki na serwerze. Oczywiście czytelnicy nie muszą o tym nic wiedzieć.
Podpowiedzi w Google Search mogą śmieszyć, ale są wyjątkowym osiągnięciem - każde zapytanie obsługiwane jest przez ok. 60 serwerów.
Przykładowy kod JS można znaleźć na stronie http://pajhome.org.uk/crypt/md..., a wykorzystany został np. na blogu http://necro.nomicon.pl/2009/0....
Kolejną możliwością jest wykonanie badań klikalności każdego z linków na stronie i zachowań odwiedzających witrynę - łącznie ze śledzeniem kursora. Działanie takie może działać na korzyść użytkowników, jeśli właściciele serwisu wykorzystają uzyskane informacje do poprawienia użyteczności witryny. Jednak nie ma się co oszukiwać: zwykle uzyskane informacje zostaną wykorzystane w celach marketingowych, takich jak rozmieszczenie reklam.
Trendy związane z modelami SaaS (software as a service) i cloud computing wróżą technologii AJAX świetlaną przyszłość. W przeciwieństwie do Flasha i ActvieX nie wymaga on dodatkowych pluginów i zwykle nie budzi zbytnich kontrowersji. Ponadto przeniesienie części obliczeń na maszyny użytkowników pozwala na odciążenie serwerów. Równie ważne jest zmniejszenie ilości przesyłanych danych i szybszy dostęp do podstawowych funkcji witryny. W dobie ciągłego ograniczania kosztów i wzrostu świadomości ekologicznej wydaje się to dobrą drogą.
kroppr.rborn.info - serwis udostępniający edytor zdjęć wykonany w AJAX-ie
Również Google planuje zwiększyć zainteresowanie AJAX-em. Nie chodzi o kolejną usługę, ale znaczące zmiany we flagowym produkcie - wyszukiwarce. Miałyby one polegać na analizie zachowań użytkowników odwiedzających monitorowane strony, ruchu kursora w wynikach wyszukiwania i sposobie klikania na reklamy kontekstowe. Mogłoby to doprowadzić do znaczących zmian w branży pozycjonerskiej - zwłaszcza, jeśli cała obsługa odbywałaby się za pośrednictwem AJAX-u a Google szyfrowało transmisję. Na szczęście nie zanosi się na to, bo szyfrowanie wymaga uzycia znacznej mocy obliczeniowej.
Jak widać, AJAX oferuje dużo więcej niż skrypty dodające animacje do menu i podobne gadżety. Bardzo ważne jest przeniesienie obliczeń na komputery użytkowników i zmniejszenie ilości przesyłanych danych. Zdecydowaną zaletą ajaksowych skryptów jest również wygoda odwiedzających i możliwość tworzenia dynamicznych aplikacji online.
Powiązane publikacje
Brak komentarzy
Marcin Kosedowski - programista i mimo wykształcenia typowo technicznego autor artykułów o tematyce dotyczącej Internetu i bezpieczeństwa w sieci. Hobbystycznie prowadzi bloga, na którym porusza sprawy związane z programowaniem i Internetem.
Adres bloga like-a-geek.jogger.pl
Artykuły tego autora:
Internet i multimedia są dziś nierozerwalnie ze sobą związane. Największe portale internetowe urozmaicają dostarczane informacje treściami dźwiękowymi oraz materiałami video. W ślad za nimi idą mniejsze serwisy, a szczyty popularności notują serwisy z filmami rozrywkowymi oraz multimedialne materiały szkoleniowe. Czy ty też chciałbyś wzbogacić swoją stronę o multimedia? Zobacz, to naprawdę nie jest trudne!
Polecamy:
Na skróty:
Magazyny Internetowe| Co za ile| Programy| Praca| Magazyn Internet| Internet Maker| Web Toster| ForumNasze serwisy: