JavaFX as JSF 2.0 VDL

JavaFX as JSF 2.0 view description language.

Preface

The JavaFX language has been developed for Rich Internet Applications. The project FAQ says:

“JavaFX is an expressive rich client platform for creating and delivering rich Internet experiences across all screens of your life. JavaFX 1.0 was released on December 4, 2008. As of February 1st, 2009, there had already been over 100,000 downloads of the tools and SDK. Today, JavaFX is available on over 50 million desktops.” In spite of that is really means applets or Java Web Start applications, I was a curious: Is that would be useful for web applications also ? Take look at the description from the OpenJFX compiler site:

What is JavaFX Script?

1. automatic update (bind)

2. list comprehensions (sequences)

3. easy-to-use

4. runs on JVM

5. interacts smoothly with Java

6. easy natural object graph creation (object literals)

7. graphics centric

8. single threaded

9. focused on small to medium scale applications

10. curly-brace language

Ok, take a look for these features :

1. Bind. This is most attractive for me as capability for the JSF Ajax . Instead of manual definition for ‘dirty’ parts of page; as it implemented in the RichFaces, JSF 2.0 and some other projects, or analyzing differences in the rendered HTML code as the IceFaces project does, application can update these parts of page only where model values was changed. That would simplify application development on the same way as for Swing.

2. Not sure how is that applicable for a web application.

3. That is always necessary.

4. I.e. in the same environment as JSF works.

5. Good for JSF/JEE applications too.

6. Very attractive for JSF application because of the tree-like view structure.

7. Not web advantage.

8. That doesn’t mean real single threaded implementation, I guess, because JavaFX GUI is based on Swing which uses threads, but hides thread manipulation from the application developer. It would be funny for web applications if we could put discrete requests processing behind developer’s concern.

9. Really, that is a main target for JSF applications too.

10. Not sure about that.

So, at least seven from ten JavaFX features are applicable to JSF Web. But additional advantages are pure object-oriented language, type safety …

Implementation idea

The one of the new JSF features is pluggable View Declaration Language. Chapter 7.6 of the Java Server Faces Specification says:”A View Declaration Language (VDL) is a syntax used to declare user interfaces comprised of instances of JSF UIComponents.”. The simplest way to integrate JavaFX with JSF is ViewDeclarationLanguage implementation that creates tree of JSF UIComponents from the JavaFX script. For example, if user requests page “ http://foo.com/bar/baz.fx” that implementation should execute “/bar/baz.fx” script from the web application content or load and execute pre-compiled “bar.baz” class. The script should create the tree of JSF UIComponents in the same way as any other JSF VDL does. Really, in the research prototype VDL implementation expects instance of the special “ JavaFXHandler” interface that creates UIComponent instances in the “ apply” method. That simplifies script content and allows to cache results between requests. Therefore, a simple JavaFX page would seem like this ( that is part of JSF 2.0 version of the guess number example page ):

import org.richfaces.javafx.*;

View {
  children:[
    Head {
      children:[
         Title {
              value: "GuessNumber 2.0&amp"
         },
         StyleSheet {
              value: "css/styles.css"
         }
      ]
    },
    Body {
         bgcolor:WHITE
       children:[
          Form {
              id: "helloForm&amp"
            children:[
               H2 {
                      value: "{userNumberBean.greeting}"
               },
               Image {
                  src:"{resource['images/wave.med.gif']}"
                  alt:"Hello!"
               }
               InputText {
                  label:"User Number",required:true
                  value: bind userNumberBean.userNumber
                  id:"userNo"
                  converter: NumberConverter {integerOnly:true}
                  validators: [
                                 GuessNumberValidator {
                                     min:userNumberBean.minimum
                                     max:userNumberBean.maximum
                                 }                                 

                              ]
               },
               CommandButton {
                  value: bind userNumberBean.userNumber
                  id:"submit"
                  action: Action {viewId:"response",redirect:true}
               }
          }
       ]
    }
  ]
}