HOW TO CHOOSE A WEB FRAMEWORK

and be surprised

Jose Mara Arranz Santamara

Agosto 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

THE PROBLEM OF CHOOSING Choosing the appropriated web framework which fits your requirements and needs, conveniences, desires, tastes is not an easy task

Jose Mara Arranz

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

THE PROBLEM OF CHOOSING These slides propose and advocate some criteria to pick the right framework
Advocating for freedom of choice, freedom of design, robust, security Discarding options (that is, frameworks)

May be you do not agree with everyone

I must to try :)
Jose Mara Arranz 3 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

Click

Frameworks, Frameworks, Frameworks!!

Jose Mara Arranz

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CALM! you will see, THERE ARE NOT VERY MANY!

Many of them are very similar Some strong criteria are very important Most of frameworks can be classified by groups

Jose Mara Arranz

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: JVM in server The Java platform is the most robust, secure, speediest and richest for web development

Jose Mara Arranz

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Pure Web Client

Flash/Flex (and other RIA plugins)

Will be replaced by HTML 5 in a short future HTML/CSS/JS is more flexible and open than Flash/Flex Data applications do not need to be so baroque SEO compatibility is not easy
Jose Mara Arranz 7 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Client-Centric?? Coding in JavaScript

Unmanageable when code grows
Not typed, not compiled, not true OOP Hard to organize Hard to debug and test Tends to generated cryptic code

Hard to divide the work to do

Hard to divide the code in archives

Slooow Impossible for Single Page Interface apps.

Jose Mara Arranz 8 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Client-Centric?? (cont.)

Coding in JavaScript
Do you really want to code this way?

Jose Mara Arranz

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Client-Centric?? (cont.) Coding in JavaScript: the myth of Rich Interface Application = JS Library
RIA = beautiful web, Single Page Interface, with movements and opacity changes Beautiful Web
Good design of HTML, CSS, images (nothing to do with JS)

Single Page Interface

Partial changes of the page (client-centric is not implied)

Movements and opacity changes

Funny games with style attributes and timers The only case a JS library is very useful

Jose Mara Arranz

10

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Client-Centric?? (cont.)

Coding in JavaScript
NO THANKS!!

Jose Mara Arranz

11

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Client-Centric?? (cont.)

GWT
Allows coding JS in Java GWT compiles Java code as JavaScript sent to the client Visual logic (and some business logic) is executed only in client Solves the problem of coding in JS BUT MORE PROBLEMS REMAIN

Jose Mara Arranz

12

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Client-Centric?? (cont.)

Visual Design is programmatic or with specific IDEs

Bye web designers

Components black-boxed
Almost only CSS customization

Cryptic generated JS
Only debugging in Java
Jose Mara Arranz 13 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Client-Centric?? (cont.) Paranoid server

No confidence with client (and everything is there) Duplicity of checking/validations

Client-server custom communication data bridges (GWT-RPC) Duplicity of data management in client and server SOFEA: utopian approach
Impossible sending SQL from browser Eternal fight about what is on each side
Jose Mara Arranz 14 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Server-Centric
In server-centric business logic and visual logic are executed in server
The server generates markup and/or JavaScript
No need of JavaScript programming

ClientCentric

Data and visual state are together Safer Better options for freedom of web design (templates) Easier Search Engine Optimization compatibility Rule: life in server is more comfortable
Jose Mara Arranz 15 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

LETS LOOK BACK

JVM in server Pure Web Client Server-Centric

Jose Mara Arranz

16

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

Click

Frameworks, Frameworks, Frameworks!!

Jose Mara Arranz

17

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Dynamic Language?? Initially are very productive But they become a problem when
The source code grows (1000 classes?) Several persons in the same code IDEs cannot help very much

Slooow
http://www.codecommit.com/blog/java/groovys-performance-is-not-subjective
Jose Mara Arranz 18 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Dynamic Language?? (cont.)

Can you live without a true Find Usages of NetBeans? Can you live without refactoring tools?

Jose Mara Arranz

19

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Java Lenguage

The compiler gives us robust and speeder code
Compiler is your friend

Tools like Find Usages and Refactor (NetBeans)

Allow us to manage thousand of classes Developer knows how changes affect to any part of the code

Jose Mara Arranz

20

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Single Page Interface

In Single Page Interface (SPI) a web site/application runs into the same page (no reload)
By using AJAX (or similar) we get new markup or JavaScript for partial updates

Event based programming and only partial changes designed and coded
The same as desktop applications

Jose Mara Arranz

21

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Single Page Interface (cont.)

No more unexpected Back/Forward/Reload and double form-submitting
No more post-redirect Back/Forward buttons of browser can optionally work in SPI and remain SPI and deterministic

No more unexpected caching (GET) No more unexpected form autofill

Changing values provided by the server on page load

No more stupid full page rendering when anything is changed

Avoiding annoying blinking and scrolling Increased performance
Jose Mara Arranz 22 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Single Page Interface (cont.)

No more includes into includes into includes
Templates ONLY containing initial page or page fragments More tolerance to visual changes

No more direct access to internal pages

No more problems when the same user opens two pages
Pages of a SPI application DO NOT share state by default Session is NO longer the place to save temporal data

No more problems with modal windows

Browsers do not like them (hack) In SPI you can simulate modal windows

Jose Mara Arranz

23

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Single Page Interface (cont.)

End users increased productivity!

Example: showed errors while introducing data

FACT: no one desktop application is paged (multi-frame)

No, a wizard is a single modal window, the same frame (=page) is kept

The SPI concept is NOT NEW

http://devedge-temp.mozilla.org/viewsource/2003/inner-browsing/index_en.html

SPI is much more than a bit of AJAX

If the web framework is not SPI oriented the page must change to load new AJAX based components
Jose Mara Arranz 24 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Single Page Interface (cont.)

Click

Standard < v2.0 (no AJAX)

Another reason to discard both again

Jose Mara Arranz 25 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

LETS LOOK BACK

JVM in server Pure Web Client Server-Centric Java Language Single Page Interface

Jose Mara Arranz

26

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

Click

Frameworks, Frameworks, Frameworks!!

Jose Mara Arranz

27

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Not a forced web Tools like EclipseRAP and AjaxSwing are interesting for quickly porting desktop applications to web
The result is a forced web application

Jose Mara Arranz

28

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic

Allows division by role between developers and web designers
Two clear roles: visual design, logic programming (visual and business logic) Reusing of visual design (visual patterns) Reusing of visual logic => OOP
Can be very independent of concrete visual design

Absolute control of layout when markup is alive

Jose Mara Arranz 29 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

JSF flavours. NO!

Jose Mara Arranz

30

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.) JSF flavours. NO!
Black-boxed components
Visual aesthetic is imposed Hard to change, is what you get

Mixed visual design and logic (lots of Java bindings and EL expressions)
Too much Java Reflection, security risk
Struts security hole (in ONGL): http://struts.apache.org/2.2.1/docs/s2-005.html Spring security hole: http://securityreason.com/securityalert/7526

Specific visual editors needed (= FAILURE)

Jose Mara Arranz 31 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

ZK? . NEITHER!
Similar to JSF

I don't think UI Designer would have patient to learn how to polish his web site in ZUL file, they want CSS and HTML
http://stackoverflow.com/questions/327328/any-real-world-experience-of-the-zk-ajaxframework

Jose Mara Arranz

32

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

Vaadin? NO TEMPLATING!
Visual design fully programmatic!

Jose Mara Arranz

33

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

Wicket to the rescue?

Wicket does not mix markup with Java code and adds no special syntax to your markup files http://wicket.apache.org/meet/features.html Lets see AJAX Tree and TreeTable ex.
Where is the tree markup? => Black Box!

(again)
Jose Mara Arranz 34 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

LETS LOOK BACK

JVM in server Pure Web Client Server-Centric Java Language Single Page Interface Not a forced web Templates based on plain HTML with no logic
Jose Mara Arranz 35 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

Click

Frameworks, Frameworks, Frameworks!!

Jose Mara Arranz

36

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

REMOVING ALL DISCARDED FRAMEWORKS

Jose Mara Arranz

37

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

Frameworks, Frameworks, Frameworks!!

Jose Mara Arranz

38

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

NO ONE??!!

Jose Mara Arranz

39

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

ANOTHER CHANCE TO JSF (with AJAX), ZK and Vaadin

Jose Mara Arranz

40

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Push Templates

In a push template the contained markup is the visual pattern managed by Java code pushing data to the template (this is not executable)
Java code has complete control of the lifecycle of instances, begin and end of transactions Promotes visual reusing and OOP IoC/DI is not imposed (optional)

Example: Wicket load phase (no AJAX)

But Wicket is fully discarded
Jose Mara Arranz 41 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Push Templates (cont) JSF flavours and ZK

Executable (pull) templates Java objects controlled by template

Vaadin
Template? What is a template?

Jose Mara Arranz

42

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

REMOVING ALL DISCARDED FRAMEWORKS

Jose Mara Arranz

43

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

NO ONE??!!

Jose Mara Arranz

44

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

ANOTHER CHANCE TO JSF (with AJAX), ZK and Vaadin

Jose Mara Arranz

45

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Easy Creation of Custom AJAX Components

Answer to the fine but can it do? JavaScript minimum or nothing New markup defined as markup (sort of template)
Not as JavaScript We can decide what elements send events Event processing in server can insert/modify/remove our markup
Jose Mara Arranz 46 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Easy Creation of Custom AJAX Components (cont.) JSF pre 2.0
Tons of hacks Markup management with client JavaScript
https://bpcatalog.dev.java.net/ajax/textfield-jsf/design.html http://www.oracle.com/technetwork/java/javaee/tutorial-jsp-140089.html http://media.techtarget.com/tss/static/articles/content/JSFReference/JSFReferenceCH11.pdf

JSF post 2.0

Simplified creation of composite components WOW a new sort of include was invented! AJAX calls standardized. WOW! The same annoying JavaScript
http://www.ibm.com/developerworks/java/library/j-jsf2fu-0410/index.html

Jose Mara Arranz

47

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Easy Creation of Custom AJAX Components (cont.) ZK

There is some example beyond adding AJAX listeners to markup on load time? New markup management again with JavaScript in client
http://docs.zkoss.org/wiki/Component_Development_Tutorial http://www.zkoss.org/doc/compdevguide

Jose Mara Arranz

48

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Easy Creation of Custom AJAX Components (cont.)

Vaadin
According the manual is not an easy task. The reference manual is sincere:
Creation of new widgets involves a number of rather intricate tasks
http://vaadin.com/book/-/page/gwt.html

A new GWT component must be created, another one for server, code for client/server coordination and data communication, several registries Positive: fortunately management of new markup is Java based (GWT) but pure programmatic (bye web designers)
Jose Mara Arranz 49 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

LETS LOOK BACK

JVM in server Pure Web Client Server-Centric Java Language Single Page Interface Not a forced web Templates based on plain HTML with no logic Push Templates Easy Creation of Custom AJAX Components
Jose Mara Arranz 50 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

Click

Frameworks, Frameworks, Frameworks!!

Jose Mara Arranz

51

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

REMOVING ALL DISCARDED FRAMEWORKS

Jose Mara Arranz

52

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

NO ONE??!!

Jose Mara Arranz

53

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

ANOTHER CHANCE TO JSF (with AJAX), ZK and Vaadin

Jose Mara Arranz

54

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Not Steep Learning Curve

The framework should provide an easy API and development style Providing in a short period of time, the necessary skills to develop Single Page Interface applications
Jose Mara Arranz 55 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Not Steep Learning Curve (cont.)

All frameworks compete with the longest and rich list of components
Are they hiding that custom component development is a very cumbersome task?

A custom tag or custom API is needed for a simple button or text box
Hundreds of custom tags including the basics Web knowledge thrown away

Beyond already made components there is no very much hope (complex task)

Jose Mara Arranz

56

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

REMOVING ALL DISCARDED FRAMEWORKS

Jose Mara Arranz

57

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

NO ONE??!!

Jose Mara Arranz

58

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

ANOTHER CHANCE TO JSF (with AJAX), ZK and Vaadin

Jose Mara Arranz

59

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Free of XML and declarative programming

XML based configuration and declarative programming:
Hard to reuse, no very much OOP Friend of tools, usually become foe for developers Hard to debug, error detection on runtime Rigid relative to the imperative alternative Fight against rigidity with tons of custom elements and attributes (trying to cope with any casuistic) Usually enormous archives (hard to work with)

Jose Mara Arranz

60

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Free of XML and declarative programming

JSF and ZK
Full of XMLs for configuration and custom tags (a kind of declarative programming)

Vaadin
Is not free of XML based registries

Jose Mara Arranz

61

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

NO ONE??!!

Jose Mara Arranz

62

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

ANOTHER CHANCE TO JSF (with AJAX), ZK and Vaadin

Jose Mara Arranz

63

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Single Page Interface in many mobile browsers

Is there anybody out there?

There is more life beyond iPhone and Android

64

Jose Mara Arranz

64

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

ANOTHER CHANCE TO JSF (with AJAX), ZK and Vaadin This will be the last one!!

Jose Mara Arranz

65

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: SPI SEO compatible

The division between a web application and web site is blur today
FaceBook, Twitter (both SPI) are they sites or apps?

Notwithstanding be indexed by web crawlers is absolutely necessary (SEO compatible)

Avoiding site duplication for SEO

This implies any SPI state should be bookmarkable and in the same time generated with markup
Jose Mara Arranz 66 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: SPI SEO compatible

SPI SEO compatible WHAT?

67

Jose Mara Arranz

67

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

LETS LOOK BACK

JVM in server Pure Web Client Server-Centric Java Language Single Page Interface Not a forced web Templates based on plain HTML with no logic Push Templates
Jose Mara Arranz 68

Easy Creation of Custom AJAX Components Not Steep Learning Curve Free of XML and declarative programming SPI in many mobile browsers SPI SEO compatible

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

Click

Frameworks, Frameworks, Frameworks!!

Jose Mara Arranz

69

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

NO ONE??!!

Jose Mara Arranz

70

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

REALLY??!!

Jose Mara Arranz

71

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

NO, not true MISSING ONE!!!

Jose Mara Arranz 72 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

Is ItsNat really compliant with all previous criterions?

Jose Mara Arranz

73

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: JVM in server / Java Language ItsNat is coded with Java in server
Other JVM languages are not excluded for development ItsNat applications

CRITERION: Pure Web Client 100% web technology

Optional SVG applet based on Batik SVGWeb support for SVG in IE (v6-v8)
Jose Mara Arranz 74 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Server-Centric
In ItsNat user JavaScript code is not needed
In spite of developers can easily inject custom JavaScript from server In spite of custom JS code and JS libraries can fit together with ItsNat
Generated markup is CLEAN of ItsNat artifacts (id and onXXX attributes not used by ItsNat) Markup layout is absolutely controlled by developers, jQuery /Dojo can play with style attributes for visual effects (movements, opacity)
Jose Mara Arranz 75 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Single Page Interface ItsNat strongly supports the SPI paradigm But nothing prevents you of page navigation
There is a utility called Referrers Form auto-fill of browsers is automatically canceled (load time) to ensure all data shown are given by the server
Jose Mara Arranz 76 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Not a forced web Developers have absolute control of layout including in SPI No aesthetic is imposed, no pixel based desktop simulation Swing is optionally used only because its data/selection models (view independent)
Jose Mara Arranz 77 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic

Templates are normal plain HTML files, no custom tags, no expression languages, no Java bindings
Fully suitable for web designers and pure HTML/XHTML WYSIWYG tools New HTML fragments to be inserted into the page with AJAX are plain XHTML/HTML too

Visual logic is executed using Java W3C DOM APIs in the server (including events)
Any change performed to the DOM in server is replicated to the client (custom JavaScript is generated and sent to the client)
Jose Mara Arranz 78 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

Event listeners are Java W3C DOM Event listeners registered in server
Receiving W3C DOM Events

ItsNat SIMULATES A JAVA W3C BROWSER IN THE SERVER

The client page is a clone of server This is not new, actually ALL of server-centric frameworks DO the same (JSF, ZK, Vaadin browser) by using techniques VERY ARTIFICIAL AND RIGID!!
Jose Mara Arranz 79 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

Jose Mara Arranz

80

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

The page (client and server) can be partially changed with new plain HTML markup Three ways to add new markup to a page in SPI
1. Markup Fragment 2. String containing markup converted to DOM through ItsNatDocument.toDOM(String) 3. Creating elements through W3C DOM Java API

Jose Mara Arranz

81

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

1. Markup Fragment
Is a type of template, only the content in <body> is loaded and can be inserted by DOM API in server

http://www.innowhere.com:8080/itsnat/feashow_servlet?itsnat_doc_name=feashow.main&featur e=feashow.core.domutils.markupFragments.ex

Jose Mara Arranz

82

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.) 2. String containing markup converted to W3C Java DOM by
ItsNatDocument.toDOM(String)

http://www.innowhere.com:8080/itsnat/feashow_servlet?itsnat_doc_name=feas how.main&feature=feashow.core.domutils.toDOM.ex

Jose Mara Arranz

83

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

3. Through W3C DOM Java API

http://www.innowhere.com:8080/itsnat/feashow_servlet?itsnat_doc_name=fe ashow.main&feature=feashow.core.man.htmlExampleInManual.ex

Jose Mara Arranz

84

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Templates based on plain HTML with no logic (cont.)

Because templates are plain HTML and can be freely modified
Because MARKUP IS ALIVE as DOM

ItsNat easily allows to convert any paged web site or app web to Single Page Interface
Clone of ElCorteIngles.es as SPI: http://www.innowhere.com:8080/insites/ Clone of an ExtJS application: http://www.innowhere.com:8080/inexperiments/inexpservlet? itsnat_doc_name=extjsexample

Jose Mara Arranz

85

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Push Templates

ItsNat templates are not executable, view logic is fully based on Java
Java logic manages the template markup and pushes (injects) data to the template

ItsNat provides the template as DOM to Java code on load time

Java code absolutely controls object instances, transaction demarcation and view modification in any order Nothing prevents of using IoC/DI frameworks, they are not imposed
Jose Mara Arranz 86 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Push Templates

Called per page load

Document lifecycle is the same as the client page

Jose Mara Arranz

87

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Easy Creation of Custom AJAX Components

Components are the typical form of visual layout, visual code and associated events In ItsNat components are NOT needed because any HTML element is a component
Any element can receive events Can contain other elements (=components) Can change its data (text nodes) and appearance (CSS, formatting nodes)
Jose Mara Arranz 88 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Easy Creation of Custom AJAX Components (cont.) Do we need components for reusing in ItsNat? NO!!
A markup fragment (or string converted toDOM() o Java DOM code) and a Java class with DOM management and event listeners => can be reused without some kind of component registration

Jose Mara Arranz

89

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Easy Creation of Custom AJAX Components (cont.)

Anyway ItsNat provides a component system and some components
Component = binding of a data model, a selection model (usually Swing), a pluggable layout and some registered event listeners Text boxes, lists, tables, trees Layout pluggable (pattern based): NO black box

And a mechanism for new components

Implementing ItsNatComponent And registering (with code) a CreateItsNatComponentListener

Jose Mara Arranz

90

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Easy Creation of Custom AJAX Components (cont.) Component creation is so easy like binding a plain HTML pattern
Defined as markup fragment, toDOM o Java DOM code
The HTML pattern (layout) can be defined outside the component and be plugged on component creation

with a data (and selection) model and predefined actions (Java) and DOM (AJAX) events
http://www.innowhere.com:8080/itsnat/feashow_servlet?itsnat_doc_name= feashow.main&feature=feashow.comp.other.customComponent.ex

Jose Mara Arranz

91

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Not Steep Learning Curve

ItsNat has two levels:
1. 2. Core Components

The Core level is basically DHTML in the server

Java W3C DOM Core/HTML APIs Java W3C DOM Events Enough to create sophisticated SPI applications

Components are optional

Form components very useful (text box, select)
Jose Mara Arranz 92 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: Free of XML and declarative programming

ItsNat configuration is fully based on code
Provides maximum freedom, flexibility and reusing => OOP and automatic adaptation to environment

100% XML and declarative programming free Nothing prevent of building declarative layers on top
Config. and registries based on XML, custom tags Configuration based on DI frameworks (Spring, Guice) ItsNat is consciously a low/middle level framework

Jose Mara Arranz

93

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: SPI in many mobile browsers

Desktop Browsers
Adobe AIR HTML Component, Arora, Google Chrome, FireFox 1+, Internet Explorer v6,7,8, Internet Explorer v9, Moblin 2.0, Opera 9+, QtWebKit (Qt 4.4), Safari 3+.

Mobile Browsers
Android 1.0+, BlackBerry JDE 4.6+ (Flip, Bold, Storm etc), Bolt, Fennec 1.0a1 (a.k.a FireFox Mobile), Pocket IE 6 (Windows Mobile 6 and 6.1), IE Mobile 6 (since Windows Mobile 6.1.4), iPhone/iPod Touch 2.0+, Iris 1.0.8+, Minimo 0.2, Motorola Symphony 1.1, NetFront 3.4+, Opera Mini 4.x, Opera Mobile 8.6x (WinMob and UIQ), 9.5, 9.7 and 10, S60WebKit (since S60 3rd), S40WebKit (since S40 6th), Palm Pre webOS, QtWebKit of Qt for Embedded Linux (Qt v4.4) and Windows CE, SkyFire 1.0 and UCWEB (Java and WinMob).

SVG Plugins
Adobe SVG Viewer v3 and v6 beta, Renesis Player v1.1.1, Savarese Ssrc SVG (adds XUL to MSIE too), SVGWeb, and Batik as applet.
Jose Mara Arranz 94 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: SPI in many mobile browsers (cont.) Pocket IE support of Windows Mobile 6.0 y 6.1 is INCREDIBLE
In later versions (>= 6.1.4) IE Mobile is much better

Jose Mara Arranz

95

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

CRITERION: SPI SEO compatible

ItsNat has a render mode on page load called Fast Load
In this mode any change made to the initial template DOM when the page is loading, do not generate JavaScript Final DOM tree is rendered as markup

The same Java DOM code can generate markup (load phase) or JavaScript (events)
ElCorteIngles.es as SPI SEO compatible: http://www.innowhere.com:8080/insites/

Jose Mara Arranz

96

August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

EPILOGUE ItsNat has many more characteristics some of them are unique
Pure SVG and embedded SVG in XHTML/HTML, remote control of other users, server-sent events, integrated functional testing, modal layers, iframe auto-binding in server, extreme mashups, remote templates, client JavaScript integration
Jose Mara Arranz 97 August 2010

HOW TO CHOOSE A JAVA WEB FRAMEWORK

... and be surprised

ItsNat LINKS Project Home

http://www.itsnat.org

Online Demo
http://www.innowhere.com:8080/itsnat/

The Single Page Interface Manifesto

http://itsnat.sourceforge.net/php/spim/spi_manifesto_en.php

Jose Mara Arranz

98

August 2010