Analysis and Testing of Ajax-based Single-page Web Applications
Analysis and Testing of Ajax-based Single-page Web Applications
Analysis and Testing of Ajax-based Single-page Web Applications
You also want an ePaper? Increase the reach of your titles
YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.
Samenvatting ⋆<br />
Analyse en <strong>Testing</strong> van <strong>Ajax</strong>-gebaseerde <strong>Single</strong>-<strong>page</strong> <strong>Web</strong>-applicaties<br />
Ali Mesbah<br />
Inleiding en Probleemdefinitie<br />
esktop-applicaties worden meer en meer vervangen door web-applicaties.<br />
D Dit brengt grote voordelen met zich mee: geen gedoe met installatie,<br />
toegankelijkheid vanaf elke computer die een internetconnectie heeft, en altijd<br />
de beschikking over de nieuwste versie van de applicatie.<br />
Tot voor kort was de browser niet meer dan een programma om een serie<br />
hypertekstpaginas, opgemaakt in HTML, te bekijken. Dit klassieke multi<strong>page</strong>model<br />
heeft echter zijn langste tijd gehad: veel a<strong>and</strong>acht gaat tegenwoordig<br />
uit naar een nieuwe type web-applicaties, genaamd <strong>Ajax</strong> (Garrett,<br />
2005). Het is een antwoord op de beperkte interactiviteit van de besta<strong>and</strong>e<br />
toest<strong>and</strong>sloze webinteracties. In deze nieuwe benadering is het interactiemodel<br />
gebaseerd op één enkele pagina, samengesteld uit diverse gebruikersinterfacecomponenten,<br />
met als doel web-applicaties veel interactiever te maken.<br />
In plaats van de hele pagina te verversen vinden de wijzigingen plaats<br />
op componentniveau. Tegenwoordig bevatten web-applicaties allerlei rijke<br />
gebruikersinterface-widgets, zoals sliders, tabs, in- en uitklappende fragmenten,<br />
en zooming, welke geheel in de browser draaien. De techniek die dit alles<br />
mogelijk maakt is bekend onder de naam <strong>Ajax</strong>: een afkorting voor Asynchronous<br />
JavaScript <strong>and</strong> XML.<br />
JavaScript is de geïnterpreteerde scripting-taal die door alle browsers gesproken<br />
wordt: hiermee kunnen de fraaie gebruikersinterface-widgets worden<br />
gemaakt, en acties aan bepaalde gebruikersinterface-events (zoals specifieke<br />
clicks) worden gehangen. Het asynchrone deel van <strong>Ajax</strong> zorgt ervoor<br />
dat de web-applicatie niet meer hoeft te wachten op resultaten die het van<br />
bv. een webserver wil halen: de applicatie, en dus de gebruikersinteractie,<br />
kan gewoon doorgaan terwijl op de achtergrond de browser informatie van<br />
de webserver betrekt. Mede hierdoor krijgt de web-applicatie het responsieve<br />
karakter dat we van desktopapplicaties gewend zijn. De rol van XML in <strong>Ajax</strong>,<br />
tot slot, zit hem in de communicatie tussen de webbrowser en server. Bijzonder<br />
aan <strong>Ajax</strong> is dat deze communicatie gebruikmaakt van “deltas”, waarmee<br />
alleen wijzigingen in de toest<strong>and</strong> van de gebruikersinterface worden doorgegeven.<br />
Zo wordt voorkomen dat de volledige toest<strong>and</strong> van de pagina steeds<br />
opnieuw van de server gehaald moet worden. In plaats daarvan wordt deze<br />
toest<strong>and</strong> bijgehouden binnen de browser, middels het Document Object<br />
Model (DOM).<br />
⋆ Deze samenvatting is gedeeltelijk verschenen in twee Nederl<strong>and</strong>se publicaties: (Mesbah <strong>and</strong><br />
van Deursen, 2006) en (van Deursen <strong>and</strong> Mesbah, 2008).