13-11-06_ajax development with jsf

8/4/2019 13-11-06_ajax Development With Jsf

1/44

Copyright 2006 Virtua, Inc. JSF Central - http://www.jsfcentral.com. 1

Ajax Development with JSF

Look Ma, no JavaScript!

Kito D. [email protected]

Principal ConsultantVirtua, Inc.

http://www.virtua.com


2/44


Kito D. Mann

Consultant, architect, mentor, trainer Author, JavaServer Faces in Action

Founder, JSF Central

http://www.jsfcentral.com

JCP Member JSF 1.2, JSP 2.1, Design-Time API for JavaBeans,

Design-Time Metadata for JavaServer FacesComponents, WebBeans, etc.

Experience with Java since its release in 1995

Web development since 1993


3/44


Agenda

JavaServer Faces from 1,000 feet The JSF programming model

Ajaxian Faces

JSF 1.2 and beyond

Summary

Q&A


4/44


Agenda


Ajaxian Faces

JSF 1.2 and beyond

Summary

Q&A


5/44


Standard web user interface (UI) framework forJava

JSF 1.0: Standardized through Java CommunityProcess (JCP) in 2004 (JSR 127)

JSF 1.2: Standardized through JCP in 2006 (JSR 252)

Part of Java EE 5.0

Specification consists of:

Server side UI component and event model

Set of basic UI components

Basic application infrastructure

Can automatically synchronize UI components withapplication objects

Includes basic Dependency Injection container

What is JavaServer Faces?


6/44


Extensive tool support

Sun, Oracle, IBM, BEA, Exadel, Borland, JetBrains,Genuietc, others

Enables RAD-style approach to Java web

development Facilitates third-party UI component market

Built on top of Servlet API

Works with JSP, but does not require it

What is JavaServer Faces?


7/44


JSF and Struts


8/44


JSF Application Architecture

What is Java Server Faces?


9/44


The IDE Effect

Designed to facilitate easy-to-use IDE integration Since JSF is a standard, vendors more likely to create

tools

All major IDE vendors support JSF

Level and style varies Caveat:

Generated artefacts

Does not require tools


10/44


Sun Java Studio Creator


11/44


BEA Workshop Studio


12/44


M7/BEA NitroX


13/44


Oracle JDeveloper


14/44


Oracle JDeveloper


15/44


Exadel Studio Pro


16/44


User interface (UI) components Renderers

Backing beans

Validators

Converters Events and listeners

Navigation

Expression language

Messages

Key JSF Concepts


17/44


Agenda


Ajaxian Faces

JSF 1.2 and beyond

Summary

Q&A


18/44


UI components

Renderers

Validators

Converters

Expression language

Messages

Backing beans

Navigation

Views JSP, Facelets, Clay

Backing beans

POJOs

Configuration

faces-config.xml

Component libraries Custom

components

Key artifactsKey concepts


19/44


Backing beans

External services

(database, EJBs, Spring, web services)

Model objects

(application logic)

Custom Component Libraries

Third-party Libraries

(Spring, Log J, Shale, Facelets)

Third-party Component Libraries

JavaServer Faces Framework

(FacesServlet)

Servlet API

Views

(JSP, Facelets, Clay)

Web Resources

(images, stylesheets)

Web Configuration

(web.xml)

JSF Configuration

(faces-config.xml)

Java EE Web Application

Java EE Web Container

Server ideClient ide

Client Devices

High-level Architecture


20/44


JSF Applications are Web Applications

Must run in a web server with a Java webcontainer

JSF 1.0/1.1:

Servlet API 2.3 or higher

JSP 1.2 or higher or

JSP alternative such as Facelets or Struts Shale Clay

JSF 2.0:

Servlet API 2.3 or higher

JSP 2.1 or higher or

JSP alternative such as Facelets or Struts Shale Clay


21/44


Must include a JSF implementation Java EE 5 application servers include an implementation

(JSF 1.2)

Different implementations of JSF exist

Apache MyFaces

JSF Specification version 1.1

Working on 1.2

Sun Reference Implementation

JSF Specification versions 1.1 and 1.2

Vendors such as IBM, Oracle, Sun usually packagedwith IDE or Java EE server

Usually based on Reference Implementation

JSF Applications are Web Applications


22/44


Agenda


Ajaxian Faces

JSF 1.2 and beyond

Summary

Q&A


23/44


Ajaxian Faces

JSFs architecture makes it easy to add Ajaxsupport

Components and renderers are separate

PhaseListeners can be invoked during requestprocessing

Enables transparentAJAX support

Same programming model with or without AJAX


24/44


Ajaxian Faces

Three AJAX integration strategies: Add AJAX support to existing components:

Ajax4jsf

AjaxAnywhere

DynaFaces

Integrate AJAX support into JSF components Simplica ECruiser DataTable

Infragistics NetAdvantage for JSF

Exadel RichFaces Visual Component Platform

TeamDev QuipuKit

Backbase Java Edition ICEsoft ICEfaces


25/44


Ajaxian Faces

Wrap existing AJAX widgets

jMaki

DojoFaces

Full listing of products athttp://www.jsfcentral.com/products/


26/44


Ajax4Jsf

Adds Ajax support to any JSF view Originally developed by Exadel

Open sourced this year (java.net)

Features: Can add Ajax support to any JSF component with

JavaScript events Can define regions of the page (or entire page) that can

be updated via AJAX

Status component

Polling component

MediaOutput component ActionListeners and ValueChangeListeners invoked via

Ajax

Also features AjaxListeners


27/44


Ajax4Jsf


28/44


Ajax4Jsf


29/44


Simplica ECruiser DataTable

DataTable (Grid) component with integratedAJAX support

Ajax features:

Sortable headers

Inserting or deleting rows

Pagination

Ajax Loading

Drag and Drop

Resizable columns

Simplica working on a full suite of components


30/44


Infragistics NetAdvantage for JSF

Suite of bread-and-butter components: Tree, Table, Menu, Tabs, MenuBar, Input controls

Full Ajax support

Dynamic loading of data sets

Updating part of the page with a selection

All components can send Ajax requests and updateother components dynamically


31/44


TeamDev QuipuKit

Suite of bread-and-butter components: Chart, Data Table, DynamicImage, Collapsable Panel,

Modal Popups, Tabs, TreeTable, Input controls

Full Ajax support

Enhanced Ajax validation

Can dynamically update components

Dynamic loading of data


32/44


ICEsoft ICEfaces

Innovative take on Ajax browser/serverintegration Direct-to-DOM: maintains copy of DOM on server which

is synchronized with DOM on the client

Requires a persistent connection between client andserver

Supports Ajax Push

Three elements: Framework

Implemented as a JSF RenderKit

Ajax bridge

Component suite Chart, Data Table, DynamicImage, Collapsable Panel,

Modal Popups, Tabs, TreeTable, Input controls


33/44


ICEsoft ICEfaces


34/44


jMaki

Provides JSF and JSP wrappers for popular AJAXwidgets

Originally written by Greg Murray, Servlet 2.4spec lead

Currently open-sourced on Java.net

Supports widgets from:

Dojo, Scriptaculous, Yahoo!, Google, and others

Caveats

Requires JDK 1.5x or higher

Use without Glassfish not documented

JSF not supported for all widgets

Not as tightly integrated with JSF as other solutions


35/44


jMaki

Easy to create new widgets


36/44


Cant we all get along?

ICEfaces requires a custom RenderKit for eachcomponent set

Includes standard JSF components and ICEfaces customcomponents

Can not use any other components on the same page

Other components can be used on separate pages

Backbase doesnt work with other components

Uses single-page model

Ajax4jsf and DynaFaces duplicate functionality

Ajax4jsf is more mature

Exadel and ICEsoft involved with DynaFaces


37/44


Which one?

Pick a component suite Tight integration with JSF

No incompatibility problems within the same suite

Well documented and supported

Choose as few as possible (preferably just one)

How much AJAX do you need? Other suites (such as WebGalileo Faces and ApacheMyFaces Tomahawk have limited AJAX support as well)

Use Ajax4Jsf Works well with Apache MyFaces Tomahawk

Powerful Ajax support with open source components

Tomahawk has poor documentation, but a thrivingcommunity

Works with other components too


38/44


Which one?

If you need AJAX push, choose ICEfaces Well documented

Free version available

Enterprise addition provides support and enhancedscalability

Use jMaki for eye candy or Web 2.0 componentslike Google Maps

Dont forget tools support!


39/44


Agenda


Ajaxian Faces

JSF 1.2 and beyond

Summary Q&A


40/44


JSF 1.2 and Beyond

One problem with JSF 1.x Ajax support: The request processing lifecycle

JSF 1.2 provides specific Ajax support JSF 1.2 Reference Implementation available now

Requires either a Java EE 5 server (with JSP 2.1) or

Facelets (open source JSP replacement) MyFaces working on JSF 1.2

JSF 2.0 will incorporate features from: DynaFaces

Single, integrated API for Ajax component developers

Will include JavaScript bindings Apache Shale

JBoss Seam

Facelets


41/44


Agenda


Ajaxian Faces

JSF 1.2 and beyond

Summary Q&A


42/44


Summary

JavaServer Faces is the standard Java EE webframework

It is a component-based framework

Provides a simple, cohesive programming

model JSFs architecture lends itself to Ajax

development

Ajax development with JSF doesnt requireJavaScript!

Same programming model with or without Ajax


43/44


Summary

Three different approaches to Ajaxdevelopment with JSF

Integrate Ajax support into the components

Wrap regular JSF components with Ajax support

Wrap pure Ajax widgets with Ajax support

Many different component suites and solutionsexist currently

JSF 1.2 makes Ajax integration easier forcomponent developers

JSF 2.0 will provide a single mechanism forAjax integration for component vendors


44/44


Resources

JSF site http://java.sun.com/javaee/javaserverfaces/

JSF Central product directory

http://www.jsfcentral.com/products

Ajax component suite comparison http://www.theserverside.com/tt/articles/article.tss?l=J

SFComparison

Ajax-JSF Comparison Matrix

http://www.ajaxjsf.net/

13-11-06_ajax development with jsf

Documents