It has been buzzing around the community lately. A great deal of attention has come my way as well. Today I received an interesting question from Yuvaraj Thiagarajan. He wants to know what Javeline PlatForm is exactly, and how it relates to other frameworks. Rather than answering it in the comments, I wanted to give a thorough answer in this article.
What is Javeline PlatForm?
Can Javeline be used as a stand-alone client-side framework for developing javascript applications without the need for using any other Javascript libraries? I am trying to understand what Javeline Framework actually is and how it compares to other frameworks like Dojo, YUI, jQuery or Sproutcore.
Yes, Javeline PlatForm(JPF) is a complete thick client development framework for browser based applications. It has been in development for about 8 years, and is used in many commercial projects (applications used by millions of people a month). That said, the solutions that JPF solves are limited (= specific) and can be divided into two categories:
fig 1. Layers in architecture.
- User Interface pleasures (look & feel)
- Developer power
Let me give you an overview of the solutions that Javeline PlatForm has implemented in these two categories to give you a real understanding of the breadth. This list won’t be complete, but it will represent a certain (hopefully useful) depth of description:
User Interface pleasures
| look | |
|---|---|
| 50 UI components | Components like tree, list, tab, etc. You can find these components in the SDK. A single component can have multiple skins. For instance a list component can also function as an icon list, thumbnail list, or any other view you might want to give it. |
| Complete control over skin | Each component is fully skinnable (Both HTML and CSS). This makes it very easy to give the UI a custom look or Brand the application for a customer. With the same ease one can create a Windows, OSX, Office2008, iPhone or Coca Cola look. |
| Runtime Skin Switching | Change the look of a component or of the entire application by pressing a button, without reloading the application. |
| Runtime Language Switching | Switch the language of your application easily by pressing a button. Instantly the interface is changed to the language of choice |
| feel | |
| Immediate validation feedback | Give the user direct notifications when he/she does something wrong. This makes interaction with the UI fast and pleasurable. |
| Optimized for speed | Speed and scalability are two very hard problems in Ajax land. PlatForm solves this, proven in several commercial deployments |
| Drag&Drop | When a user drags&drops an item, JPF makes sure that they are actually dragging the internal representation of the object. This makes the UI always intuitive and removes consistency worries for the developer. |
| Undo/Redo | Undo/Redo is a great interactive feature for the more advanced application. JPF provides this feature to the developer using a simple call on the API. |
Developer power
| Standard skinsets included | JPF comes with standard skin sets. Currently a windows like set is included. JPF 0.99 will include a special JPF skinset. JPF 1.0 will also include an OSX skinset. |
| Declarative GUI building | Set up the GUI as if you’re writing simple HTML (ex.: <j:jml />). Just as easy. |
| SmartBindings | SmartBindings provide a way to encode how data is transformed to representation, and how changes done by the user are encoded back in the data. It also helps in synchronizing these changes back to the server. |
| Property Bindings | These bindings can link the value of a textbox to the position of slider. When the slider moves you’ll see the position set in the textbox. |
| Three different Positioning Solutions | JPF supports Anchoring, Alignment and position using a grid (similar to a table in HTML). |
| Dockable windows | Docking similar to Visual Studio, Aptana and other IDE’s. |
| Abstracted Datasource logic | JPF provides a consistent way to tell the API where to retrieve and store its data. |
| Transaction management | I should probably write a separate article on this. Transaction management for the UI is useful when one wants to edit a subset of the loaded data, such that this action can be cancelled or undone as a single atomic action. Think about a property window with several inputs. When the user presses the cancel button on the bottom of the window the action should be cancelled (not updated to the dataset), if the user clicks on apply it should be recorded as a single task on the undo stack. In short, JPF makes it very simple for a developer to implement this. |
| State management & Backbutton support | This feature is especially useful when implementing a JPF application that looks and functions like a classic website. It helps getting control and overview of the different page like states. You might want to read this blog article on state management together with controlling the backbutton. |
| Offline support | JPF can detect when an application looses connection to the internet. It will save all the communications to the server. When the connection is re-established it will synchronize the changes to the server. When using Gears or Javeline DeskRun JPF can save the application such that it can be started without a connection to the internet. |
| Declarative form validation | By setting different attributes on input widgets you can specify which constraints the data entered has to adhere to. When these constraints are violated an error message will be displayed to the user. |
| Back-end integration | JPF incorporates TelePort, a library specifically designed for any communication to external sources. It is capable of speaking a variety of protocols: XML-RPC, JSON-RPC, SOAP among others. You can also simply use REST for retrieving or sending data. |
| Forms building using XForms standard (and XML Schema) | XForms has some advantages for creating forms declaratively. JPF supports parts of the XForms spec. Full compliance is in the works. |
| Portal/Dashboard solution | This is quite a nice solution for creating those iGoogle like dashboards. The portal widget works nicely together with the window component loading both config and body from separate xml files. It is quite a optimized solution that has been deployed for the French Canadian Web Account System of Vonage |
| Synchronize data between clients | This is a core feature of JPF build in on a low level (the same as undo). It uses something called Remote SmartBindings. Basically it can serialize data changes and sent them to other clients via a server. This is a nice feature for any collaborative application. |
| Partial UI loading/rendering | You can configure which parts of the UI are rendered during init, and which ones are loading when the user needs them. Moreover you can choose to load extra user elements from the server at a time later than init. This gives a developer the flexibility to optimize how an application functions. |
| JSLT/XSLT support to databound template HTML parts | JSLT is a way to transform XML similar to XSLT but using a syntax close to Javascript, with the ability to call custom JS functions. This makes the transformation feel more like a template language like PHP. |
| Chunked data loading | The advantage of Ajax is the possibility to only load the data that you need, when it is needed. So you can load a little bit of data each time, making the transfer really quickly, optimized and localized. |
| Works the same across browsers | JPF has been tested on Safari 2+, Opera 9.1+, FF 1.5+ and IE6+. All functions have been abstracted such that developers can run with it, without having to think about browser differences. |
| Build in debugging tools | JPF tries to make debugging as straight forward as possible. The debug screen shows a log, gives a stack trace and allows you to evaluate javascript on the fly. |
| LGPL licensed | The open source way. |
From these lists it might become clear what the focus of Javeline PlatForm is. There are also some specific problems in JavaScript world which JPF doesn’t solve. I’ll try to give a list here detailing what these problems are, and which libraries solve them. JPF aims to play nice together with these libraries. (N.B. This list is by no means complete)
Problems JPF doesn’t solve
| Animation/Effects | JPF does have a small animation class, used mostly for small transitions in the GUI components. However, there are many specialized animation libraries which offer more out of the box functionality. | Scriptaculous, YUI, Moo.Fx, jQuery plugins |
| Object Oriented programming in JS | JPF adds destructors, an event system, property binding and inheritance to JavaScript Classes. Still other libraries specialize in giving the developer a more thorough OO programming environment. | Prototype, Mootools |
| HTML selection and manipulation | JQuery, Dojo | |
| Syntax Highlighting | SyntaxHighlighter | |
| Charting, 2D Graphics (SVG/VML/Canvas), 3D Graphics | Dojo, ejschart, Flash, Silverlight, JavaFX |
Many of the popular Javascript projects started out helping the developer with their daily programming tasks. During the popularity of Ajax, the last couple of years, these libraries have been extended with lots of plugins. I think that jQuery, prototype, mootools all have components, animation and backbutton support added to them as plugins. Dojo, YUI and Extjs are frameworks which have been built out of the need for consistent widgets, when there were no or little Open Source projects around to provide them. A lot of technology has been donated to the Dojo Toolkit, solving a huge spectrum of Ajax problems, ranging from animation to 2D rendering, widgets, internationalization and offline support.
The evolution of Javeline PlatForm has been somewhat different, because of the way we sought to solve the problems. We have gone against the open source mantra of releasing early and often and choose to release very late. We didn’t feel it would be right to have the community suffer for the dozens of architectural changes that were necessary. JPF is an interconnected set of UI solutions in the core, on top of which widgets are implemented. This makes JPF very fast, both in start-up and runtime. It also makes widget development a breeze.
Besides runtime speed, JPF is architected to improve development speed. The starting point for this is to make building a GUI just as easy as building a pure HTML page. This is called declarative development (using custom tags like <j:tree />). Together with Javeline SmartBindings, it is really easy to quickly prototype an application. On top of this, JPF has a large Javascript API which drives the more advanced logic like skin, language or layout switching and undo/redo.
So, to conclude this is what JPF focuses on:
- Fast browser based applications
- Quickly prototyping using the <j:jml /> syntax
- Fast development and execution based on an optimized architecture
I hope this answers the questions thoroughly.
