Flex on Rails: the Good, the Bad and the Ugly

The speaker Background in Java, content management, mobile Interests in Rich UI (Flex, WPF) and agile development (Rails, Sling) Co-founder of viibee.com Evangelist for Day Software

Background in Java, content management, mobile

Interests in Rich UI (Flex, WPF) and agile development (Rails, Sling)

Co-founder of viibee.com

Evangelist for Day Software

The project: viibee.com video-based dating platform Focus on fun and interaction Because: finding a partner is visual Plus: social match making

video-based dating platform

Focus on fun and interaction

Because: finding a partner is visual

Plus: social match making

Flex: what and why Flash for developers Has the “right” development paradigms Construct UI in xml Programming in actionscript similar to WPF, XUL, … Deployment, deployment, deployment! Runs in Flash Player (compiles to swf file) Integrated solution excellent for gfx heavy stuff and animations Why not JS? The Flash player can do some tricks

Flash for developers Has the “right” development paradigms

Construct UI in xml

Programming in actionscript

similar to WPF, XUL, …

Deployment, deployment, deployment!

Runs in Flash Player (compiles to swf file)

Integrated solution excellent for gfx heavy stuff and animations

Why not JS? The Flash player can do some tricks

Rails: what and why? Ruby-based framework for database-driven web sites MVC architecture, convention-over-configuration Extremely efficient, focuses on developer productiveness Very agile (when you need a server in a hurry…) viibee is self-funded

Ruby-based framework for database-driven web sites

MVC architecture, convention-over-configuration

Extremely efficient, focuses on developer productiveness

Very agile (when you need a server in a hurry…)

viibee is self-funded

My experiences on how to integrate these two best-of-breed technologies? Need to know about Flex and/or Rails This talk is not about scaffolding an mxml file

The Good The Good

Client-server communication Flex/Rails is more like client-server than like web Good news: the Rails server only needs to server data, not “the whole UI” Need a data exchange mechanism Flex Client Rails Server

Flex/Rails is more like client-server than like web

Good news: the Rails server only needs to server data, not “the whole UI”

Need a data exchange mechanism

Client-server communication Good stuff: RESTful approach possible chose the classic: xml over http JSON would have saved some pain, but was not working as expected at beginning of project Next best alternative would have been AMF Flex Client Rails Server xml over http

Good stuff: RESTful approach possible

chose the classic: xml over http

JSON would have saved some pain, but was not working as expected at beginning of project

Next best alternative would have been AMF

XML/HTTP vs. AMF XML/HTTP Proven Cacheable on client and server (but watch out for browser dependencies) Easy to debug Implicit API Re performance: everything is asynch (unlike a typical web app) But : requires code for model serialization and deserialization AMF Binary, faster Less code through shared model Harder to debug/understand requires: web orb component Might need AMF anyway: for video recording and playback

XML/HTTP

Proven

Cacheable on client and server (but watch out for browser dependencies)

Easy to debug

Implicit API

Re performance: everything is asynch (unlike a typical web app)

But : requires code for model serialization and deserialization

AMF

Binary, faster

Less code through shared model

Harder to debug/understand

requires: web orb component

Tools Eclipse: FlexBuilder and RadRails Same ideas: unit tests , MVC, ant and svn (hence Trac)

Eclipse: FlexBuilder and RadRails

Same ideas: unit tests , MVC, ant and svn (hence Trac)

Tools Silos less probable, essential for agile development

Silos less probable, essential for agile development

The Bad The Bad The Bad

Rails development is really DRY

Now prepare to get wet

Wet? Why? The model is shared between client and server Change the model in the db Rails will pick it up, but in the client you need to… Adjust the xml parser Adjust the client-side value objects Adjust the client-side model code Probably adjust the delegate Plus: db and client need to be in sync So you need some versioning system for the communication Wanna buy a wet suit?

The model is shared between client and server

Change the model in the db Rails will pick it up, but in the client you need to…

Adjust the xml parser

Adjust the client-side value objects

Adjust the client-side model code

Probably adjust the delegate

Plus: db and client need to be in sync

So you need some versioning system for the communication

Wet? Why? You will need something like Cairngorm – a client-sided MVC Coming from Rails: this is a shock. Feels like Java EE is back. But if you do not use it you are likely to reinvent Cairngorm

You will need something like Cairngorm – a client-sided MVC

Coming from Rails: this is a shock. Feels like Java EE is back.

For example, adding a method in Rails controller means in Cairngorm Create a new command Create Cairngorm event Add event and command to Cairngorm controller Possibly create a new value object Create a new responder Possibly add a method for parsing response Add method to delegate Add entry in services.xml

Create a new command

Create Cairngorm event

Add event and command to Cairngorm controller

Possibly create a new value object

Create a new responder

Possibly add a method for parsing response

Add method to delegate

Add entry in services.xml

And some minor issues Slower development (compile cycles) i18n configuration is split out over different systems Slower deployment (uploads)

Slower development (compile cycles)

i18n configuration is split out over different systems

Slower deployment (uploads)

The Ugly The Ugly

Model state on the client X=0 X=0 X=1 X=1 User interaction When? After UI change? Before UI is changed? Constraints?

Shared model state on the client 2 1 Example use cases: Chat Inbox update If you stick to http: requires comet, polling or dealing with inconsistent data

Example use cases:

Chat

Inbox update

My Conclusion More good than bad Rails is a good backend choice for Flex apps XML/HTTP works good enough for us and stays out of the way Keep state to UI logic if possible, do not spread out model state Develop vertically, no silos

More good than bad

Rails is a good backend choice for Flex apps

XML/HTTP works good enough for us and stays out of the way

Keep state to UI logic if possible, do not spread out model state

Develop vertically, no silos

Questions?