Tuesday Jun 09, 2009

JavaFX Book Arrives!

Since the beginning, the deadlines set forth for producing our book have been aggressive to say the least.  Ultimately, we wanted them to be physically available for sale at the JavaOne 2009 conference.  These things arrived literally hot off the press, having been flown in the opening day of the show.  This effort was not in vain; the results are in.  According to our friends at Digital Guru, JavaFX was definitely the hot topic of the week and JavaFX - Developing Rich Internet Applications was the best seller.  Furthermore as of 9:52AM Eastern Time 09-June-2009, Amazon reports that its sales rank is a very respectable 21,873.  Not bad for just a few days showing.

These sales were no doubt fueled by Larry Ellison's cameo appearance during the first JavaOne keynote.  Clearly hampered by what he could and could not say due to Oracle's pending acquisition of Sun, Larry went out of his way to promote the future of JavaFX.  He must have mentioned it a half dozen times during his 10 minute or so appearance.  On behalf of Eric and the other Jim, thanks bud.



Friday May 01, 2009

JavaFX Book Available Online at Safari.com

Our book, entitled JavaFX: Developing Rich Internet Applications, having gone through the copyedit and proof stages, is now available online at Safari @ http://my.safaribooksonline.com/9780137013524.  Please feel free to provide feedback/comments on any aspect of the book that you've chanced to read.  We're still on schedule to have hardcopies available at the Java ONE show which will start on June 2.  If you plan on attending, please stop by the Addison-Wesley/Pearson/SMI Press booth.  Happy reading.


Monday Apr 06, 2009

Node Count and JavaFX Performance

In a recent blog entry entitled Best Practices for JavaFX Mobile Applications (Part 2), Michael Heinrichs espouses that keeping the scenegraph as small as possible helps JavaFX applications perform optimally. Regardless what version of JavaFX you're using, this is sage advice.  Having spent some time trying to create components for a scoreboard-like application, I was concerned over the amount of CPU time being consumed by the clock component pictured directly below.


You can click on the preceding image to run this mini application via Java WebStart.   By placing your mouse over any of the digits and typing in, via keyboard input, a valid number, you can set the clock.  Clicking on the "START/STOP" text will toggle the clock on and off.  Like many scoreboard clocks, when the time remaining is less than one minute, 10ths of seconds are displayed.  It is during this phase, when digits are being updated every tenth of a second, that this application can be especially taxing.  You can imagine how troublesome this clock might be if it were to be part of say a hockey scoreboard which could have an additional 4 penalty clocks ticking simultaneously.

The major factor affecting performance appears to be the sheer number of nodes in the scenegraph that require recalculation for every clock tick.  For this first implementation, each of the five clock digits is comprised of 27 BulbNodes, (my naming) which are switched on or off depending upon what value needs to be displayed.

In an effort to see how decreasing the node count might effect performance, this second implementation of the clock component uses the same underlying framework, except that each digit is now composed of 7 LED SegmentNodes (my naming again) instead of 27 BulbNodes.   You can run this version of the clock component by clicking on the image that follows.


For our final example, in order to truly minimize node count, each digit is represented by a single ImageView node. When the value of a digit changes, a new Image is displayed.  By caching all of the possible digit values (blank, 0-9) you can very quickly switch images.  No doubt, prettier images can be created, but I think you get the point.  Click on the image that follows to try this version.


The Results

The slower the compute platform, the more pronounced the differences in performance should be.  Thinking along those lines, a very modest 1.4 GHz Pentium M laptop was chosen as the test environment to compare CPU utilization for these applications.  OpenSolaris provides an easy-to-use well-known command-line tool called vmstat(1M), which was chosen as the mechanism to analyze the individual applications. In contrast, the Performance Tab which is part of the Windows Task Manager, seemed to produce wild performance variations.

For each run,  the clocks were set to one minute, and run until the time expired.  The data shown below represents the average CPU utilization, after startup, for each of the three implementations.  In particular we'll look at the following fields returned by vmstat:

  • us - percentage usage of CPU time in user space
  • sy - percentage usage of CPU time in system space
  • id - percentage usage of CPU time idling
The sum of (us + sy + id) should approximate 100%.


Number of Nodes per Digit
CPU Utilization
Implementation 1: BulbClockNode
 27 BulbNodes
 us: 22%  sy: 2%  id: 76%
Implementation 2: LEDClockNode
 7 SegmentNodes
 us: 9%    sy: 2%  id: 89%
Implementation 3: ImageClockNode
 1 ImageNode
 us: 3%    sy: 2%  id: 95%


The JavaFX engineering team is well aware of this limitation, and hopes to redesign the underlying scenegraph plumbing in the future.  Regardless, it's still a good idea to take into consideration the size of your scenegraph.

JavaFX book status:  Our upcoming book, JavaFX: Developing Rich Internet Applications, is in copy edit.  Coming soon: Rough cuts of certain chapters will be available on Safari.

Thursday Mar 19, 2009

Bindstorming

It is within our nature, even in the most infinitesimal way, to leave our mark on this world before we exit it.  I'd like to coin the following term, heretofore unseen in the JavaFX space, and submit it as my humble contribution to the human collective:

bindstorm \\'bïnd•storm\\ (noun): condition where a multitude of JavaFX bind recalculations severely hampers interactive performance

Yeah, I know, using the word you wish to define inside its definition is bad, but there is precedent for this: (1) Fancy-schmancy, hoity-toity college dictionaries do it all the time. (2) Mathematicians and computer scientists call this recursion: that mysterious concept which developers use to impress others of their programming prowess.

Don't get me wrong, JavaFX binding is incredibly powerful.  Heck, we dedicated a whole chapter to it in our soon-to-be-released book JavaFX: Developing Rich Internet Applications.  But binding does come with a price, and like most anything else, over-consumption can lead to abuse.

Consider this use case: you've got a JavaFX application with dozens or maybe even hundreds of Nodes that are part of the scenegraph.  Each of the Nodes are ultimately sized and positioned in proportion to height and width instance variables that are passed on down.  If you define width and height at startup and have no interest in a resizeable interface, then you stand a good chance of avoiding the use of many bind expressions.  The one potential twist here is that if you're sincerely interested in a non-resizeable application, but want it to consume the entire screen, what do you do?  As screens come in all shapes and sizes, you may not know what the resolution is at start time.  JavaFX has an elegant solution for this which uses binding.

Here's a simple application which defines a Rectangle and Circle that fill the entire screen.  You can click anywhere within the Circle to exit the application.  Notice the number of binds required to get this to work.

import javafx.stage.\*;
import javafx.scene.\*;
import javafx.scene.shape.\*;
import javafx.scene.paint.\*;
import javafx.scene.input.\*;

function run() : Void {
    var stage: Stage = Stage {
        fullScreen: true
        scene: Scene {
            content: [
                Rectangle {
                    width: bind stage.width
                    height: bind stage.height
                    fill: Color.BLUE
                }
                Circle {
                    centerX: bind stage.width / 2
                    centerY: bind stage.height / 2
                    radius: bind if (stage.width < stage.height) then
                            stage.width / 2 else stage.height / 2
                    fill: Color.RED
                    onMouseClicked: function(me: MouseEvent) {
                        FX.exit();
                    }
                }
            ]
        }
    }
}

Imagine what this would look like if you had lots of complex custom components with many more dependencies on height and width.  In addition to the potential performance impact, this could be error-prone and cumbersome to code.  To avoid the over usage of binding and the potential for a bindstorm, applications of this sort could be re-written as follows:

import javafx.stage.\*;
import javafx.scene.\*;
import javafx.scene.shape.\*;
import javafx.scene.paint.\*;
import javafx.scene.input.\*;

function run() : Void {
    var AWTtoolkit = java.awt.Toolkit.getDefaultToolkit ();
var screenSizeFromAWT = AWTtoolkit.getScreenSize (); Stage { fullScreen: true scene: Scene { content: [ Rectangle { width: screenSizeFromAWT.width height: screenSizeFromAWT.height fill: Color.BLUE } Circle { centerX: screenSizeFromAWT.width / 2 centerY: screenSizeFromAWT.height / 2 radius: if (screenSizeFromAWT.width <
screenSizeFromAWT.height) then
screenSizeFromAWT.width / 2
else screenSizeFromAWT.height / 2 fill: Color.RED onMouseClicked: function(me: MouseEvent) { FX.exit(); } } ] } } }

We achieve the same effect as the first example by first making a call to a method in the java.awt.Toolkit package.  With this information we can statically define our scenegraph without the use of binding.

There is one caveat to this solution.  As the AWT (Advanced Windowing Toolkit) is an integral part of Java SE, this code should be portable across all JavaFX desktops.  However, if you wish to deploy a JavaFX Mobile solution, the AWT calls would likely change.  Is there a mechanism that might work across both models?

As a final thought, while we're on this theme of coining terms, my compadres Jim Clarke and Eric Bruno, co-authors of the aforementioned JavaFX book, jokingly asked what word could be used to describe this scenario:

"Condition where binds lead to binds that leads back to the original bind, ending up in a Stack fault?"

BindQuake? BindTsunami? Bindless? BindSpin? BindHole (BlackHole)? BindPit?


        
    

Tuesday Feb 24, 2009

Registering Multiple Actions (or Handlers) in JavaFX

Java developers, especially those performing any type of GUI work, will ultimately encounter Java's event-driven programming paradigm.  In short, if programmers want to act upon some kind of event they bundle up a chunk of code into a Java method, typically referred to as a handler, and register the handler with that event.  Whenever that event occurs, the handler code will automatically be executed.

JavaFX provides a similar mechanism.  For a straightforward example, the code below defines a simple timer in JavaFX with a resolution of 1 second.  Each time a second expires, the function specified by the action instance variable will be executed.  Here's what it looks like:

import javafx.animation.\*;

public class SimpleTimer {
    public def timeline = Timeline {
        repeatCount: 5
        interpolate: false
        keyFrames: [
            KeyFrame {
                time: 1s
                action: function () : Void {
                    println("tick");
                }
            }
        ]
    }
}

Adding a run() function, as follows, to the bottom of this source will enable you run an instance of this timer:

function run() : Void {
    var s = SimpleTimer{};
    s.timeline.playFromStart();
} 

The output from this run looks like this:

tick
tick
tick
tict
tick 

It's all well and good if you only need a single action.  What if you wanted to perform multiple actions and/or dynamically add or subtract a number of actions?  We can enhance our previous SimpleTimer class to dynamically register and unregister handlers by taking advantage of two of JavaFX's features: sequences and function pointers.

Our new class provides more flexibility:

  • It defines an instance variable called duration, which enables the user to specify the resolution of a clock tick at object instantiation.
  • It defines two additional public functions called registerHandler() and unRegisterHandler() which take a function pointer (a handler) as an argument.  By registering a handler, the function will be included in the list of handlers to be executed each time the specified duration expires.
  • A handler is registered by inserting it's function pointer argument into an internal sequence of function pointers called handlers[].
  • A handler is similarly unregistered by deleting it's function pointer argument from the handlers[] sequence.
  • The action instance variable, which is part of the KeyFrame instance, now calls an internal function called runHandlers()runHandlers() sequentially executes the functions found in the handlers[] sequence.
Here's the new class:
import javafx.animation.\*;

public class Timer {
    /\*\*
     \* User-definable:  specifies the length of time for one cycle.
     \*/
    public var duration = 100ms;

    public def timeline = Timeline {
        repeatCount: Timeline.INDEFINITE
        interpolate: false
        keyFrames: [
            KeyFrame {
                time: duration
                action: runHandlers
            }
        ]
    }

    // Holds the list of handlers to run
    protected var handlers: function() [];

    /\*\*
     \* Add the function, represented by the handler argument, to the list
     \* of handlers.  These will run when the elapsed time, specified
     \* by the duration instance variable, expires.
     \*/
    public function registerHandler(handler : function()) : Void {
        for (func in handlers) {
            if (handler == func) {
                return;  // handler already registered -- skip
            }
        }
        insert handler into handlers;
    }

    /\*\*
     \* Remove the function, represented by the handler argument, from
     \* the list of handlers.
     \*/
    public function unRegisterHandler(handler : function()) : Void {
        delete handler from handlers;
    }

    protected function runHandlers() : Void {
        for (handler in handlers) {
            handler();
        }
    }
} 

To test this class out, we'll add a run() function at the script level.  The run() function creates a Timer instance and registers two handler functions, decrementTenthsRemaining() and processTicks().  Here's the code:

function run() : Void {
    var t = Timer {};
    var tenthsRemaining = 100;
    var decrementTenthsRemaining = function() : Void {
        tenthsRemaining -= 1;
    }
    var processTick = function() : Void {
        if (tenthsRemaining mod 10 == 0) {
            println("seconds left: {tenthsRemaining / 10}");
        }
        if (tenthsRemaining == 0) {
            t.timeline.stop();
        }
    };
    t.registerHandler(decrementTenthsRemaining);
    t.registerHandler(processTick);
    t.timeline.play();
}

And this is the output from the run:

seconds left: 9
seconds left: 8
seconds left: 7
seconds left: 6
seconds left: 5
seconds left: 4
seconds left: 3
seconds left: 2
seconds left: 1
seconds left: 0

Shameless Promotion:  Keep up to date with the latest status of our upcoming JavaFX Book entitled JavaFX: Developing Rich Internet Applications at jfxbook.com.


Tuesday Feb 17, 2009

JavaFX Book Coming to a Theatre Near You

Despite the considerable attention JavaFX has garnered, publications (i.e. books) that discuss JavaFX in any detail are few and far between, and anything that has been published, as good as it may have been, is unfortunately hopelessly out of date.  The reality is that up until recently, the JavaFX platform has been a moving target.  With the advent of JavaFX 1.1 however, the platform has stabilized to the point where you should begin to see legitimate books appearing on the subject.

Jim Clarke, Eric Bruno and I have been working steadfastly on a book entitled JavaFX: Developing Rich Internet Applications, which should be among the first -- if not the first -- of these new books.  From our standpoint the content is nearly finished.  What remains is the editing and publication process which takes a few additional months to complete.  Plans call for this book to be available in time for the JavaOne 2009 Conference, if not earlier.

We also plan on making rough cuts of certain chapters available on Safari.  As soon as these are ready, we'll let you know.  Finally, check out our website, jfxbook.com, dedicated to the book.  There you will find additional resources that accompany the book, including sample code and applications.  One such application is a JavaFX version of the popular Sudoku game, pictured below.

Visit jfxbook.com and give it a try.

About

Jim Connors

Search

Categories
Archives
« July 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
  
       
Today