Avantajele si dezavantajele unei aplicatii bazate pe AJAX
Motivatie
Aparitia aplicatiilor bazate pe AJAX, a insemnat un pas important in dezvoltarea si imbunatatirea
modului in care utilizatorii interactioneaza pe aplicatiile web. Termenul de AJAX (Asynchronous
JavaScript + XML ) are la baza o suita de tehnologii care ajuta la la cresterea interactivitatii, vitezei
si usurintei in utilizarea aplicatiilor web. Aceasta tehnologie s-a nascut din nevoia de imbunatati
viteza de navigare a siturilor, prin micsorarea timpilor de raspuns la actiunile utilizatorilor. Pentru
fiecare actiune a utilizatorului, siturile obisnuiau sa reincarce complet pagina pentru a o actualiza cu
noi date, chiar si in cazurile in care schimbarile erau minore. Astfel, inainte de AJAX, fiecare click
de mouse cauza un timp mort pentru utilizator, pana cand noua pagina se incarca.
AJAX presupune un schimb de date intre browser si server, astfel incat sa nu mai fie
necesara reincarcarea intregii pagini web de fiecare data cand userul face o schimbare in aceasta.
AJAX reprezinta o colectie de tehnologii, fiecare utilizata si in mod de sine-statator, dar care
combinate permit obtinerea unei unelte foarte puternice:
• Prezentarea in mod standard a paginilor, prin HTML sau mai noul XHTML, si CSS
(Cascading Style-Sheets) pentru aranajrea in pagina a continutului;
• Afisare dinamica si interactiune folosind DOM (Document Object Model), accesat printr-un
limbaj de scripting, pentru a modifica in mod dinamic si a asigura interactiunea cu
informatia prezentata;
• Schimb bidirectional de date si manipulare prin XML intre client si server, desi orice format
poate fi folosit, inclusiv HTML, XSLT sau text simplu;
• Schimbul de date asincron se realizeaza prin obiectul XMLHttpRequest, desi in unele
implementari AJAX se poate folosi un IFrame pentru schimbul de date, sau chiar tag-uri
<script> adaugate dinamic.
• JavaScript folosit pentru a lega toate aceste elemente intr-un pachet puternic.
Eliminarea reincarcarilor inutile de pagini a fost acel mic pas care a declansat o avalansa de
eforturi in directia imbunatatirii interfetei siturilor web. Facilitati precum drag-n-drop, validare
automata a datelor, unelte web de colaborare interactiva, si multe altele sunt noi in lumea
aplicatiilor web, acestea fiind asociate in mod traditional cu aplicatiile care ruleaza local.
Aplicatiile AJAX sunt in principal executate in computerul utilizatorului, prin manipularea
paginii curente de catre browser folosind metode de document object model (DOM). AJAX poate fi
utilizat pentru o serie de functii precum actualizarea inregistrarilor, expandarea formularelor,
returnarea unor cautari simple, editarea de elemente, toate fara nevoia de a reincarca intreaga pagina
web in momentul cand aceasta este modificata. Se trimit doar cereri scurte catre server si se primesc
raspunsuri de dimensiuni mici. Acest lucru creste interactivitatea si apropie paginile web de
posibilitatile aplicatiilor desktop.
Acestea ar fi avantajele utilizarii aplicatiilor AJAX totusi, lasand la o parte avantajele se pot
observa si oarece dezavantaje la nivel de in interactiune cat si la nivel de implementare. Paginile
web ce utilizeaza AJAX pot sa impiedice functionarea comportamentului normal, obisnuit si
asteptat al butoanelor de Back dintr-un browser. Utilizatorii se asteapta ca apasand aceste butoane
sa fie dusi la aspectul anterior al paginii, dar acest lucru nu este mereu adevarat cand se utilizeaza
AJAX, deoarece browserul nu poate tine mereu socoteala modificarilor produse in mod dinamic si
asincron. O alta problema a paginilor dinamice este dificultatea de a creea unu link sau un
bookmark catre o stare particulara a aplicatiei.
De asemeni o alta problema care impiedica rularea aplicatiilor web este reprezentata de

absenta optiunii de a rula JavaScript in interiorul unui browser. Acest lucru este observat la
browserele mobile sau la versiunile mult mai vechi ale browserului. De asemeni persoanele cu
disabilitati sau alte impedimente care se bazeaza pe tehnologia de “Text to Speech”, vor avea
dificultati in a folosi o astfel de aplicatie.
Google Reader
Avantajele si dezavantajele prezentate mai sus se pastreaza pentru toate aplicatiile bazate pe
AJAX. Totusi pentru a analiza si a observa modalitatea in care o astfel aplicatie respecta sau nu
anumite sabloane de proiectare, precum si modul in care influenteaza interactiunea cu utilizatorul,
vom face un stiu de caz pe o aplicatie AJAX cunoscuta: Google Reader.
Google Reader este o aplicatie pentru citirea feed-urilor RSS, ce doreste sa furnizeze intr-un
mod cat mai simplu, actualizarile feed-urilor la cei care sunt abonati la acestea.
Ne vom axa pe sabloanele de proiectare folosite precum si pe uzabilitatea aplicatiei si
eventualele probleme care pot aparea la folosirea ei.
Figura 1. Meniul Principal in Google Reader
Modul de organizare al aplicatiei Google Reader este prezentat in Figura 1. Dupa cum
putem observa este organizat dupa sablonul “left column navigation”. Acest lucru permite
utilizatorului un mai bun control al feed-urilor la care este inscris, avand un raspuns imediat la
meniurile pe care le acceseaza in fereastra in care este plasat continutul.
Dupa cum putem obsera in Figura 2 zona de lucru a aplicatiei poate fi impartita in patru
zone mari. Prima zona pune la dispozitia utilizatorului alte aplicatii, din cadrul suitei de aplicatii
furnizate de Google, pe care le poate accesa, precum si acces rapid la setari. Acest asezare este
importanta permitand schimbarea de aplicatii mai usor, astfel imbunatatind modul de lucru al
utilizatorului.
Urmatoarea zona este data de optiunea de cautare din cadrul aplicatiei. Dupa cum putem

observa avem optiunea de a cauta toate feed-urile, grupurile de feed-uri sau fiecare feed in parte.
Acest optiune de cautare precum si pozitionarea acesteia imbunatateste experienta utilizatorului cu
aplicatia, acesta avand acces imediat la orice informatie prin intermediul optiunii de cautare.
Rezultatele cautarii sunt furnizate in zona 4, zona actualizarilor, putand fi vizionate in acelasi mod
ca si celelalte actualizari.
Figura 2. Modul de Organizare a informatiei in Google Reader
Urmatoarea zona este data de meniul de control al aplicatiei. Ca si cazul zonelor precedente
putem observa ca fiecare element component este asezat dupa importanta lui de sus in jos, deci o
organizare “Top-Down”. Astefel primul element component al aceste zone este butonul de adaugare
de feed-uri noi, acesta avand functionaliatea si de cautare a noi feed-uri, dupa cum putem observa in
Figura 3.
Figura 3. Adaugare Feed-uri in Google Reader
Organzarea feed-urilor la care este abonat un utilizator se poate face in fisiere sau, furnizand
o organizare ierarhica, dar acest lucru este lasat la dorinta utilizatorului, ele fiind organizate ca si o
lista de feed-uri. Acesta lista se poate ascunde sau filtra dupa anumite optiuni dupa cum putem
observa in Figura 4. Fiind o aplicatie AJAX, aceasta ne permite optiunea de “drag and drop” la
modul de organizare a feed-urilor, lasand o flexibilitate mai mare utilizatorului la modul de aranjare.

Figura 4. Optiuni Feed-uri in Google Reader
Meniul de control poate fi ascuns pentru a maximiza zona patru. Aceasta zona reda
actualizarile la feed-uri. Dupa cum putem observa in Figura 5 si Figura 6, Google Reader permite
doua moduri de vizualizare a actualizarilor. Primul mod este ilustrat in Figura 5, fiind denumit si
“List View” dupa modul de redare a continutului sub forma de lista. In acest mod de vizionare a
actualiarilor putem observa modul de diferentiere dintre actualizarile care au fost vizionate acestea
fiind marcate prin un fundal albastru si actualizarile care nu au fost vizionate fiind diferentiate prin
un fundal alb. Acest mod de vizualizare permite utilizatorului sa selecteze mai usor actualizarile pe
care doreste sa le citeasca selectand titlul prezentat. In momentul selectarii actualizarii dorite,
aceasta se va deschide, in aceeasi fereastra, furnizand continutul utilizatorului. Acest lucru este
specific aplicatiilor AJAX, reducand frustrarea utilizatorului de a naviga prin numeroase pagini
pana a ajunge sa vizualizeze continutul dorit.

Figura 5. List View in Google Reader
Modul de vizionare “Extended View”, ilustrat in Figura 6 prezinta actualizare cu intregul
continut, permitand astfel utilizatorului sa citeasca fiecare actualizare, in ordinea in care au fost
adaugate. Fiind o aplicatie bazata pe AJAX schimbarea intre cele doua moduri de vizualizare se
poate face usor folosind optiunile din coltul din dreapta.
Figura 6.Expanded View in Google Reader
Cele doua moduri de vizualizare sunt controlate cu ajutorul unor butoane de navigare si de
optiuni. Am identificat mai multe optiuni ce faciliteaza modul in care utilizatorul controleaza
aplicatia. In grupul 2 de butoane din Figura 6, aplicatia pune la dispozitie un mod de a marca si a
trimite si altor utilizatori acea stire, sau de a o organiza intr-o colectie de stiri favorite, pentru a fi
vizionate ulterior. Aceste butoane si optiuni faciliteaza interactiunea cu utilizatorul prin furnizarea
lucrurilor de mare interes pentru cel ce foloseste aplicatia.
Pentru a face aplicatia si mai accesibila Google a furnizat o lista taste prin care poate fi
controlata aplicatia, fara ajutorul mouse-ului.Spre exemplu taste J si K sunt folosite pentru
navigarea printe actualizari, S pentru a trece o actualizare la favorite, etc. O lista completa de
comenzi este furnizata la adresa: http://www.google.com/help/reader/faq.html#shortcuts .
Cele prezentate in paragrafele anterioare sunt la nivel de interactiune conventionala cu
utilizatorul, un lucru benefic fiind modalitatea de navigare cu ajutorul tastaturii. Totusi la nivel de
interactiune neconventionala, luand in vedere persoanele cu disabilitati de vedere, aplicatiile AJAX
nu pot fi folosite, nepermitand acestora o navigare usoara. Imbunatatirea acestui mod de
interactiune ar face aplicatiile AJAX, mai accesibile si mai interactive pentru
Bibliografia folosita:
1. Official Webpage Google Reader
2. Google Reader FAQ

3. Ajax Design Patterns - By Michael Mahemoff 2006, O'Reilly