Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 4.0

...

FlexJS

...

is

...

the

...

name

...

for

...

a

...

next-generation

...

Flex

...

SDK

...

that

...

has

...

the

...

goal

...

of

...

allowing

...

applications

...

developed

...

in

...

MXML

...

and

...

ActionScript

...

to

...

not

...

only

...

run

...

in

...

the

...

Flash/AIR

...

runtimes,

...

but

...

also

...

to

...

run

...

natively

...

in

...

the

...

browser

...

without

...

Flash,

...

on

...

mobile

...

devices

...

as

...

a

...

PhoneGap/Cordova

...

application,

...

and

...

in

...

embedded

...

JS

...

environments

...

such

...

as

...

Chromium

...

Embedded

...

Framework

...

used

...

in

...

the

...

Adobe

...

Common

...

Extensibility

...

Platform

...

.

...

FlexJS

...

has

...

the

...

potential

...

to

...

allow

...

your

...

MXML

...

and

...

ActionScript

...

code

...

to

...

run

...

in

...

even

...

more

...

places

...

than

...

Flash

...

currently

...

does.

...

The

...

primary

...

motivation

...

for

...

FlexJS

...

is

...

the

...

leveraging

...

of

...

existing

...

Flex

...

code

...

bases.

...

While

...

Flash

...

is

...

expected

...

to

...

run

...

in

...

browsers

...

that

...

run

...

on

...

computers

...

with

...

traditional

...

keyboards

...

for

...

years

...

to

...

come,

...

existing

...

Flex

...

customers

...

are

...

finding

...

that

...

they

...

want

...

their

...

applications

...

to

...

run

...

in

...

places

...

that

...

Flash/AIR

...

will

...

not

...

run

...

because

...

some

...

of

...

their

...

end

...

users

...

are

...

now

...

allowed

...

to

...

use

...

devices

...

like

...

tablets

...

as

...

their

...

only

...

computer.

...

The

...

cost

...

of

...

migrating

...

an

...

application

...

is

...

high,

...

and

...

the

...

risks

...

around

...

quality

...

control

...

are

...

significant,

...

especially

...

when

...

migrating

...

to

...

a

...

less-strict

...

language

...

like

...

JavaScript.

...

A

...

Connect

...

presentation

...

on

...

FlexJS

...

is

...

available

...

here .

Overview

FlexJS is based on the concept of parallel frameworks. The framework components will have both an AS and JS version, and a next-generation compiler knowns as Falcon will translate MXML and AS to JS and link in JS "classes" instead of AS classes to create the JS output.

Gliffy Diagram
sizeL
nameFlexJS Workflow

Because ActionScript and JavaScript are based on ECMAScript, most code written in AS translates well to JavaScript. This is because, in most applications, the vast majority of code a Flex customer has written is not actually dependent on Flash. The underlying components like Button and DataGrid probably have dependencies on Flash, but there are equivalents in HTML and other JS frameworks. Thus to the extent a code base consists of assembling a bunch of UI controls into a view and integrating the view with ActionScript to business logic also written in ActionScript, it should be possible to have that code base leverage Flash-dependent controls in a SWF and leverage HTML-dependent controls without Flash in the browser.

Status

FlexJS is currently a prototype. A simple POC example that allows you to choose a stock and get its price is here . Right-click and choose View Source to see the MXML and ActionScript used in the example. The MyInitialView.mxml contains the UI and uses view states, databinding and custom CSS just like a regular Flex-based Application. Then go here to view the app running in the browser without Flash. It is cross-compiled from the exact same source that created the Flash SWF version. If you right-click on this version, you will see that there is no entry about the Flash Player in the context menu which is proof that it does not use Flash, and you can choose View Source to see the minified JS output from the FlexJS compiler known as Falcon. Also note that both the SWF and non-SWF versions are much smaller than any version you could create with the current Flex SDK and start up much faster.

You can try the developing code with the prototype by following these instructions .

Schedule and Resources

Apache projects, including Apache Flex, are primarily staffed by volunteers working in their spare time. As such, a schedule of milestone dates is not practical. The next major goal is to create an alpha-level release, hopefully by the end of 2013, but how soon that happens depends entirely on the number of folks who have time to contribute. There is still a fair amount of work to convert the prototype to alpha stage. Anyone with the time and energy is welcome to join in this effort.

To get to an alpha-level release, the following tasks need to be completed.

  1. Compiler integration with Flash Builder project options
  2. Launch Configurations for creating new Applications and Views.
  3. Custom CSS property support
  4. Minimal Implementation of DataGrid
  5. Minimal Implementations of Charts

We also could use resources to help build out an automated testing suite, documentation, and examples. A prototype of a Selenium-based automated testing engine for testing the JS side has been contributed but more tests need to be written and it would be interesting to find a way to leverage existing tests from the Flex SDK that are written in MXML and not Java.

Participation in any form is encouraged and welcomed. To follow the development of FlexJS, please subscribe to the Apache Flex mailing list dev@flex.apache.org. This is a high traffic list, but we try to mark all FlexJS discussion with the subject "[FlexJS]".

Summary

FlexJS should provide the lowest-cost and quickest path to future-proofing existing Flex code bases, and provide similar developer-productivity and quality control advantages that the current Flex SDK provided.

For more details and information see FlexJS FAQ.

Wiki Markup
{pagetree2:@self} | http://experts.adobeconnect.com/p4k5wln0wls/]. 

h3. Overview
FlexJS is based on the concept of parallel frameworks.  The framework components will have both an AS and JS version, and a next-generation compiler knowns as Falcon will translate MXML and AS to JS and link in JS "classes" instead of AS classes to create the JS output.

{gliffy:name=FlexJS Workflow|align=left|size=L|version=3}

Because ActionScript and JavaScript are based on ECMAScript, most code written in AS translates well to JavaScript.  This is because, in most applications, the vast majority of code a Flex customer has written is not actually dependent on Flash. The underlying components like Button and DataGrid probably have dependencies on Flash, but there are equivalents in HTML and other JS frameworks. Thus to the extent a code base consists of assembling a bunch of UI controls into a view and integrating the view with ActionScript to business logic also written in ActionScript, it should be possible to have that code base leverage Flash-dependent controls in a SWF and leverage HTML-dependent controls without Flash in the browser.

h3. Status
FlexJS is currently a prototype.  A simple POC example that allows you to choose a stock and get its price is [here | http://people.apache.org/~aharui/FlexJS/DataBindingTest/bin-release/DataBindingTest.html].  Right-click and choose View Source to see the MXML and ActionScript used in the example.  The MyInitialView.mxml contains the UI and uses view states, databinding and custom CSS just like a regular Flex-based Application.  Then go [here | http://people.apache.org/~aharui/FlexJS/DataBindingTest/bin/js-release/] to view the app running in the browser without Flash.  It is cross-compiled from the exact same source that created the Flash SWF version.  If you right-click on this version, you will see that there is no entry about the Flash Player in the context menu which is proof that it does not use Flash, and you can choose View Source to see the minified JS output from the FlexJS compiler known as Falcon.  Also note that both the SWF and non-SWF versions are much smaller than any version you could create with the current Flex SDK and start up much faster.

You can try the developing code with the prototype by following [these instructions | https://cwiki.apache.org/confluence/display/FLEX/Using+FlexJS+with+Adobe+Flash+Builder]. 

h3. Schedule and Resources
Apache projects, including Apache Flex, are primarily staffed by volunteers working in their spare time.  As such, a schedule of milestone dates is not practical.  The next major goal is to create an alpha-level release, hopefully by the end of 2013, but how soon that happens depends entirely on the number of folks who have time to contribute.  There is still a fair amount of work to convert the prototype to alpha stage.  Anyone with the time and energy is welcome to join in this effort.

To get to an alpha-level release, the following tasks need to be completed.
# Compiler integration with Flash Builder project options
# Launch Configurations for creating new Applications and Views.
# Custom CSS property support
# Minimal Implementation of DataGrid
# Minimal Implementations of Charts

We also could use resources to help build out an automated testing suite, documentation, and examples.  A prototype of a Selenium-based automated testing engine for testing the JS side has been contributed but more tests need to be written and it would be interesting to find a way to leverage existing tests from the Flex SDK that are written in MXML and not Java.

Participation in any form is encouraged and welcomed.  To follow the development of FlexJS, please subscribe to the Apache Flex mailing list dev@flex.apache.org.  This is a high traffic list, but we try to mark all FlexJS discussion with the subject "[[FlexJS]]".

h3. Summary
FlexJS should provide the lowest-cost and quickest path to future-proofing existing Flex code bases, and provide similar developer-productivity and quality control advantages that the current Flex SDK provided.

For more details and information see [FlexJS FAQ].
 
{pagetree2:@self}