The document discusses requirements for extreme rich internet applications (RIAs) and approaches for developing them. It outlines how RIA technologies have evolved to provide more desktop-like experiences within a browser. Main approaches include Ajax, Adobe Flex, Microsoft Silverlight, and JavaFx. The document also provides demos of example applications built with these technologies and combinations thereof. It notes many tradeoffs to consider when choosing an approach, such as interoperability, openness, tools available, and project timelines.

1. Extreme RIA
Developing RIA Solutions in an Evolving Landscape
Christophe Jolif
Principal Architect
ILOG

2. Agenda
 Requirements
 Main Approaches
 Demos
 Summary
ILOG S.A. © 2008. All rights reserved. 2

3. Agenda
 Requirements
 Main Approaches
 Demos
 Summary
ILOG S.A. © 2008. All rights reserved. 3

4. Requirements
 People want the “desktop application
experience” in a browser environment
 They want nice looking, animated applications
 They want responsiveness
 They want off-line capabilities
 They want desktop integration
 They want advanced visualization
ILOG S.A. © 2008. All rights reserved. 4

5. Definition
 Extreme RIA is advanced visualization on many
Web technologies
 With these additional requirements
 Ability to synchronize a lot of data between client and
server
 Ability to smoothly display a lot of objects on the
screen
 Ability to provide complex mouse interactions with
the objects
ILOG S.A. © 2008. All rights reserved. 5

6. Requirements
Typical Ajax-Based Examples of Extreme RIAs
ILOG S.A. © 2008. All rights reserved. 6

7. Requirements
Typical Flex-Based Examples of Extreme RIAs
ILOG S.A. © 2008. All rights reserved. 7

8. Requirements
Typical Silverlight-Based Examples of Extreme RIAs
ILOG S.A. © 2008. All rights reserved. 8

9. Requirements
 We can't provide the full desktop-like experience yet,
but we come closer every year
 “They want nice looking, animated applications”
 SVG, Flash
 “They want responsiveness”
 Ajax, client-side updates
 “They want off-line capabilities”
 Google Gears, AIR
 “They want desktop integration”
 AIR, HTML 5.0 DnD
 “They want advanced visualization”
 home grown or 3rd party Extreme RIA components
ILOG S.A. © 2008. All rights reserved. 9

10. Agenda
 Requirements
 Main Approaches
 Demos
 Summary
ILOG S.A. © 2008. All rights reserved. 10

11. Main Approaches
 Ajax
 Ajax + Server-Side Generated Raster Images
 Ajax + Client-Side Vector Graphics
 Adobe Flex
 Microsoft Silverlight
 Sun Java(Fx)
 Others
ILOG S.A. © 2008. All rights reserved. 11

12. Ajax
 Ajax (XHR + XML + HTML + CSS) is not always
enough, technically
 We need more graphics capabilities than what
HTML + CSS can render
 Two choices:
 The graphics comes from the server (raster)
 The graphics is client-side (vector)
 Via the browser (SVG, VML, HTML 5)
 Via a plugin (Flash, Silverlight, JavaFx)
ILOG S.A. © 2008. All rights reserved. 12

13. Ajax + Server-Side Generated Raster Images
 Pros:
 No plugin, ok with deprecated & mobile browsers
 This works everywhere
 Cons:
 Limited server-side scalability due to intensive CPU + memory
consumption to generate raster images
 Limited client-side feedback / interaction
 Possible workaround using local feedback with VML or SVG
 No true UI Framework & interoperability standards
 Any standardizations effort in these areas are welcome
(OpenAjax Alliance,W3C WAF WG)
 Development tools just starting to emerge or linked to particular
frameworks:
 Aptana, Visual Studio, Eclipse ATF (not much progress?)
ILOG S.A. © 2008. All rights reserved. 13

14. Ajax + Client-Side Vector Graphics
 Pros:
 No plugin, works (nearly) everywhere
 Cons:
 Requires dual code path:
 VML (IE) vs SVG or Canvas (Mozilla, Webkit, Opera)
 Might be solved using DojoX 2D wrapper
 Limited client-side scalability due to poor JavaScript performance
 Mozilla is working on it for Firefox with Tracemonkey and Tamarin(?)
 Google is working on it for Chrome with V8
 Apple has already made improvements with SquirrelFish
 No true UI Framework & interoperability standards
 Any standardization effort in these areas is welcome
(OpenAjax Alliance,W3C WAF WG)
 Development tools just starting to emerge or linked to particular
frameworks:
 Aptana, Visual Studio, Eclipse ATF (not much progress?)
ILOG S.A. © 2008. All rights reserved. 14

15. Adobe Flex
 Pros:
 quot;Standardquot; UI Framework with development tool (Flex Builder)
 Greater productivity
 Code has better browser portability (versus Ajax)
 ActionScript 3.0 has better performance than JavaScript:
 Still not as good as Java or.NET, however
- Flash Player 10 will improve this with Vector<> class
 Long running task management requires custom code
 Cons:
 Lacks a proper designer tool chain
 Will be introduced in Flex 4 with Thermo
 Requires plugin installation
 But Flash Player is quite ubiquitous: 99% (97.7% for version 9+) of
quot;mature marketsquot; computers according to Millward Brown survey
for Adobe.
ILOG S.A. © 2008. All rights reserved. 15

16. Microsoft Silverlight
 Pros:
 Provides quot;Standard” UI Framework
 Plus a development tool (Visual Studio)
 Works with a proper designer tool chain (Expression Suite)
 But still quite immature
 Like Flex, the code easily ports across browsers
 All .NET languages can be used
 Threading can be used
 Cons:
 Still in beta
 Contains a limited set of predefined controls
 This will improve a bit in the final release
 Still lacks a 3rd party platform for deployment and development:
 Linux for deployment and MacOS/Linux for development tools
 Requires plugin installation
 Penetration below Flash Player but should benefit from Microsoft ubiquity
ILOG S.A. © 2008. All rights reserved. 16

17. Sun Java(Fx)
 Java Desktop platform power brought to the RIA world
 Pros:
 JavaFX is a recycling of Java with
 More rich client & media APIs
 The promise of a faster initial download & plugin installation
 quot;Standardquot; UI Framework with a good development tool (NetBeans)
 As with Flex and .NET, it ports across browsers better than Ajax
 Cons:
 Still in beta
 Limited set of predefined controls
 This should improve in final release
 Lacks a proper designer tool chain
 To come: better NetBeans integration with Adobe Illustrator & Photoshop
 Developers must learn a new scripting language
 Requires plugin installation:
 JRE penetration figures: 85.1% of quot;mature marketsquot; computers according to Millward
Brown survey conducted for Adobe
 Plugin initial download to get latest JRE + JavaFX runtimes is quite big
 Sun is working on lightning installation with JRE incremental download/installation
ILOG S.A. © 2008. All rights reserved. 17

18. Others
 Curl
 quot;Standardquot; UI Framework with development tool (Curl IDE)
 Commercial licensing for the platform itself
 Uncommon scripting language
 XUL
 Mainly based on standard technologies with only limited
additions for building UI
 Works only on Gecko-based browsers
 OpenLaszlo
 Choose your deployment target: Ajax or Flash
ILOG S.A. © 2008. All rights reserved. 18

19. Combining Technologies
 Extreme RIA Applications often require developers to
combine various technologies
 Client-side mashups are well known:
 Ajax to Ajax
 Flex to HTML can be done through the ExternalInterface object
 Flex to Ajax can go one step further with Flex-Ajax Bridge
 Silverlight to HTML transparent using HtmlPage object
 But server-side mashup is also an issue:
 Standard JSF versus PPR JSF versus quot;Ajax-Pushquot; JSF
 Ajax requests and Portlet Integration
ILOG S.A. © 2008. All rights reserved. 19

20. Agenda
 Requirements
 Main Approaches
 Demos
 Summary
ILOG S.A. © 2008. All rights reserved. 20

21. Ajax Demos
 A Flow Diagram Editor
 Traffic Monitoring, with a Google Maps Mashup
 IceFaces Ajax Push Mashup
ILOG S.A. © 2008. All rights reserved. 21

22. Adobe Flex Demos
 Olympics Calendar
 Density and Climate HeatMap
 Project Schedule
ILOG S.A. © 2008. All rights reserved. 22

23. Microsoft Silverlight Demos
 Project Schedule
 Organization Chart
 CIA Fact Book
ILOG S.A. © 2008. All rights reserved. 23

24. Agenda
 Requirements
 Main Approaches
 Demos
 Summary
ILOG S.A. © 2008. All rights reserved. 24

25. Summary
 RIA technologies have made great progress
 New technologies pop up every year
 Should slow down, now that major players are in the field
 Choices are difficult to make, based on:
 Interoperability with existing HTML/CSS site / Ajax app
 How open is the chosen solution?
 Development Tools
 Designer / Developer workflow
 Is extensibility needed?
 Project release date (can't rely on beta)
 Deployment issues
 Development team background
ILOG S.A. © 2008. All rights reserved. 25

26. For more information
Ajax: RIA sites:
 http://www.openajax.org/  http://www.riasphere.org/ (coming 10/28)
 http://ajaxian.com/  http://www.insideria.com/
 http://www.asp.net/ajax/ RIA demos were build using:
 http://dojotoolkit.org/  http://jviews.ilog.com
 http://code.google.com/webtoolkit/  http://elixir.ilog.com
Adobe Flex: My blog:
 http://www.adobe.com/flex  http://blogs.ilog.com/elixir/author/cjolif
 http://flex.org/
Microsoft Silverlight:
 http://www.microsoft.com/silverlight/
 http://silverlight.net
Sun JavaFx:
 http://www.javafx.com/
 http://openjfx.org
ILOG S.A. © 2008. All rights reserved. 26

27. Questions & Answers
Thank You