Adobe Flex is de nagelnieuwe server, die de manier waarop tot nu toe webapplicatie-interfaces gebouwd werden voorgoed zal veranderen.

Iedereen kent de beperkingen van HTML - en ASP, ColdFusion, PHP, JSP - voor het ontwikkelen van gebruikersinterfaces. ‘Klik-en-wacht’ (request/respons) GUI’s waar een actie van de gebruiker gevolgd wordt door een verwerkingsproces op de applicatieserver en waarbij het resultaat als een nieuwe webpagina ingeladen wordt in uw browser. Buiten Flash Remoting was hier voor webapplicatieontwikkelaars nog geen goed alternatief voor.

Niet langer!

Macromedia Flex maakt het, samen met Flex Builder mogelijk op een snelle en eenvoudige manier Rich Internet Applications (RIA’s) te bouwen.

Wat zijn Rich Internet Applications?

De beste manier om Flex en RIA’s (Rich Internet Applications) te begrijpen is door na te gaan hoe u op dit moment webapplicaties bouwt. Bent u een ColdFusion ontwikkelaar of een ontwikkelaar die ASP, JSP of PHP gebruikt, dan bouwt u waarschijnlijk applicaties die bestaan uit veel gelinkte pagina’s. Pagina’s die client-code (HTML, JavaScript) en server-side code (CFML, SQL, ASP, PHP) bevatten. Waarschijnlijk probeert u back-end data te scheiden van GUI-elementen maar gebruikt u nog steeds beide om uw applicatie aan de gang te krijgen (en te houden…).

Op die manier wordt - als het om ColdFusion pagina’s gaat - door de browser een CFML bestand aangevraagd, die eerst door de CFServer wordt verwerkt en pas daarna naar de browser van de gebruiker wordt teruggestuurd.
Dit request/respons principe, waarbij complete webpagina’s door vervolg-pagina’s vervangen worden, is in ontwikkelomgevingen als ASP, JSP en PHP niet anders. U herkent dit makkelijk genoeg aan de manier waarop binnen webapplicaties detailpagina’s worden opgevraagd (in een artikel over Flash Remoting heb ik dit request/respons principe ooit - en een beetje snerend - het ‘klik-en-wacht’ effect genoemd).

Dit effect (gedrag) is voor gebruikers van webapplicaties essentieel anders dan het gedrag dat zij kennen van desktop applicaties, waarbij het gebruik veel intuïtiever is en de gebruiker veel minder met ‘schermwisselingen’ te maken krijgt. Die zelfde intuïtiviteit beschikbaar maken via het web was echter, door de beperkte mogelijkheden van HTML, tot op dit moment niet goed mogelijk.

Maar niet langer dus.

Flex en Rich Internet Applications

Met Flex is het nu mogelijk om gebruikers dezelfde ‘desktop ervaring’ te geven die zij normaal hebben bij applicaties zoals Word of Open Office.Org. Binnen een RIA kan, zonder dat er een nieuwe pagina ingeladen wordt, gecommuniceerd worden met toepassingen op de server. Binnen één scherm is het mogelijk om master-detail gegevens weer te geven, productkenmerken op te roepen, selecties uit te voeren, GUI-eigenschappen te wijzigen, drag-and-drop uit te voeren, zonder dat er sprake is van het aloude ‘klik-en-wacht’ principe. En dat allemaal via uw browser en via Internet!

Anders gezegd: met Flex verandert u uw webapplicatie van een statische klik-en-wacht machine tot een dynamische, intuïtieve en gebruiksvriendelijke applicatie, die qua functionaliteit en responstijd vergelijkbaar is desktop applicaties…

Hoe wordt dat voor elkaar gestoomd?

De kern van dit hele verhaal ligt bij SWF-bestanden.
Flex genereert client-side Macromedia Flash SWF-bestanden die ingeladen worden in Flash Player. De Flex applicatie kan, binnen Flash Player, vervolgens asynchroon (dus zonder ‘klik-en-wacht’) communiceren met de Flex server en - zonder dat de gebruiker dit in performance ziet of merkt - (aanvullende) gegevens van de server binnen halen.
Omdat overdracht alleen betrekking heeft op data (zonder de overhead van GUI en lay-out elementen) is het netto effect dat de gebruiker werkt met een webapplicatie die sneller en responsiever is dan de gebruikelijke JSP, ASP, PHP of ColdFusion webapplicaties. Sterker nog: die vergelijkbaar is met desktop applicaties.

Hoe worden RIA’s ontwikkeld?

Flex applicaties worden grotendeels gebouwd op dezelfde manier als desktop applicaties, met ondersteuning van een aantal servers-side runtime services.

MXML wordt daarbij als ‘scripting taal’ gebruikt, waarbij u op een visuele manier een applicatie vorm kunt geven. Met MXML kunt u, net zoals in C++, C# of Delphi in designview een groot aantal componenten op een ‘Form’ neerzetten en er in codeview code aan toevoegen die zorg draagt voor specifieke functionaliteit. Ieder component kent zijn (of haar) eigen 'tag attributes': kenmerken en eigenschappen die zowel in de ontwerpfase als in runtime via code aangesproken kunnen worden (zichtbaar op de tab 'Tag' in figuur 1).

Het programma verloopt daarbij grotendeels via behaviours (‘Events’, gebeurtenissen) die aan bepaalde componenten toegekend zijn. Events komen daarbij grotendeels overeen met de feitelijke acties die de gebruiker in de applicatie kan uitvoeren (klikken op een knop, verslepen van een object, gegevens opslaan etc.).

Naast MXML is het mogelijk om in broncode ActionScript 2.0 te verwerken. Met volledige ondersteuning voor Object georiënteerd programmeren en een syntax die veel lijkt op wat Java en C# zijn in Flex dezelfde ontwikkelprincipes en uitgangspunten van toepassing die gebruikt worden bij ontwikkeling van desktop applicaties.

En tot slot: ook in Flex is alles een klasse. Beginnend met de mx.core package stamt alles - tot en met de componenten - van deze basisbibliotheek af.

Betekent dit dat het ontwikkelen van RIA’s moeilijk is?

Nee.
Zeker niet voor Delphi, C# en Java programmeurs, die gewend zijn desktop applicaties te bouwen.
En nog eens nee, omdat Macromedia naast Flex Flex Builder beschikbaar heeft: een IDE vergelijkbaar met Dreamweaver MX (zie figuur 1) en waarmee op een relatief eenvoudige (en snelle!) manier Rich Internet Applications ontwikkeld, getest en gecompileerd kunnen worden.

Figuur 1. Macromedia Flex Builder IDE

Dus het ontwikkelen van RIA’s is een eitje?
Dat nou ook weer niet.
Met name wanneer u gewend bent om PHP, ASP.Net of ColdFusion te programmeren zult u zich de kost moeten geven af te stappen van het oude ‘klik-en-wacht’ idee. Tegelijk zult u merken dat ontwikkeling van RIA’s met Flex minder ‘lineair’ is en belangrijk meer overeenkomsten vertoont met 'normale' applicatieontwikkeling dan met het aloude webontwikkeling. Niet langer gebonden zijn aan de request/respons en de page-refresh metafoor is even wennen.

Tegelijk zult u zich moeten realiseren dat Rich Internet Aplications ontwikkelen met MXML niet hetzelfde is als een webpagina maken. Weliswaar kan Flex geïntegreerd worden in een website, maar is het eindresultaat niet hetzelfde als wat u met PHP, ASP.Net, ColdFusion of JSP bereikt. Zelfs niet met wat u met Servlets realiseert, omdat ook Servlets nog steeds gebonden zijn aan het request/respons paradigma.

En - voor Flash designers -: MXML (Flex) is geen Flash.
Hoewel Flex is ontstaan uit Flash en u met Flash Remoting een identiek product kunt afleveren, blijkt Flash Remoting in de praktijk toch te ver af te staan van het ‘denkraam’ van de programmeurs. Movies, frames, layers, framerates, scenes, timelines: het zijn pure animatiebegrippen, klip en klaar voor Flash designers, maar programmeurs hebben daar duidelijk geen kaas van gegeten (het motief waarom Macromedia Flex ontwikkeld heeft).

Is Flex daarmee de vervanging voor ColdFusion, ASP.Net, JSP?

Nee. Flex heeft ColdFusion, ASP, Java nodig voor back-end processing. In figuur 2 heb ik dat proberen duidelijk te maken:

• Een gebruiker roept een Flex MXML URL aan;
• Flex genereert een SWF;
• De SWL wordt client-side uitgevoerd in Flash Player;
• De client-side SWF doet (eventueel) via het web aanroepen om (aanvullende) gegevens en data;
• En de SWF gebruikt deze data binnen de applicatie.

Op dit punt wordt integratie met (bijvoorbeeld) CF (en met name CFC’s) duidelijk:

Figuur 2. Application flow met ColdFusion als een Flex back end

Platform AFhankelijk?

Noop!
Van oorsprong is Flex, net zoals ColdFusion, Java gebaseerd, dus onafhankelijk van het besturingssysteem waarop het draait. Er bestaan versies voor Linux, Windows, Solaris, Unix en meer. Volgend op Flex voor J2EE komt er een .Net versie. En terwijl de Flex versie ‘native’ is ten opzichte van het besturingssysteem blijft de programmeertaal: MXML daarvan onafhankelijk.

Wat heeft u nodig om Flex applicaties te ontwikkelen?

Altijd de eerste vraag die bij mij op komt.
(En wat u daarbij even voor ogen moet houden zijn de processtappen die nodig zijn om uiteindelijk een SWF bestand te ontwikkelen: Ontwikkeling in MXML (eventueel aangevuld met ActionScript) > Compileren tot SWF > publiceren op het web):

De ingrediënten:

En wat heeft de gebruiker nodig?
Een webbrowser en Flash Player 7.
En met een integratie van 98% op alle webbrowsers - en het gemak waarmee de Flash Player plug-in voor zelfs de meest verstokte digibeet binnen te halen valt - moet dit, dacht ik, geen probleem zijn ;-)

Figuur 3. Flex, in de web directory van Jakarta Tomcat Server
- al was het alleen maar om te bewijzen dat het kan! -

Resumerend: terwijl webapplicaties op dit moment voornamelijk geschreven lijken te zijn voor webprogrammeurs ;-) wordt het niet alleen op de desktop, maar ook op Internet tijd de gebruiker aan het woord te laten!
Flex biedt daarvoor veelbelovende mogelijkheden.

Presentaties en demo's:

Een Flex presentatie en demo vindt u op de Labs site van Adobe.
Voorbeelden van Flex en Rich Internet Applications vindt u op: http://www.macromedia.com/devnet/flex/example_apps.html

En een paar Flex ontwikkelingen op de valreep:
(1) IBM heeft aangekondigt zowel Flex ondersteuning te bieden binnen haar (free-ware) Eclipse IDE als binnen de WebSphere Application Development suite.
* SAP en Macromedia werken op dit moment samen om het Flex-framework te integreren in SAP NetWeaver. Op die manier kunnen organisaties Rich user interfaces voor SAP-oplossingen creëren, wat moet leiden tot een bekend rijtje: verbeterde gebruikservaring, verhoogde productiviteit van medewerkers, grotere klanttevredenheid.
* De Flash Player plug-in beperkt zich niet alleen meer tot webbrowsers alleen. De Flash Vitual Machine kan tegenwoordig ook al gevonden worden op mobieltjes, in PDA’s, set-top boxes voor digitale TV, tot aan Sony Playstations aan toe!