+ All Categories
Home > Technology > Push to the limit - rich and pro-active user interfaces with ADF (Oracle Open World 2011)

Push to the limit - rich and pro-active user interfaces with ADF (Oracle Open World 2011)

Date post: 17-May-2015
Category:
Upload: lucas-jellema
View: 5,345 times
Download: 3 times
Share this document with a friend
Description:
Visual appeal and desktop-like reaction to user input were key elements in Web 2.0, powered by AJAX. The next generation user interface is active - presenting data and events in real time, driven by server push technology. This session demonstrates how ADF Active Data Service (ADS) and the BAM Data Control are leveraged to create an active UI. Messages arriving on JMS, through HTTP, from Complex Event Processing and from email servers are pushed to the browser, updating charts, tables and even causing popups to open. The session demonstrates a Chat implementation integrated in a Fusion Web application. It also shows how Database Query Result Change Notification and ADS allow events to be pushed from database all the way to user interface.
Popular Tags:
51
PUSH TO THE LIMIT – RICH AND PRO-ACTIVE USER INTERFACES WITH ADF Lucas Jellema – AMIS (Nieuwegein, The Netherlands) Oracle Open World 2011
Transcript
Page 1: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

PUSH TO THE LIMIT – RICH AND PRO-ACTIVE USER INTERFACES WITH ADF

Lucas Jellema – AMIS (Nieuwegein, The Netherlands)

Oracle Open World 2011

Page 2: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

OVERVIEW

• Real time architecture• Push – ADF middle tier to browser

– Active Data Service– Custom Push– Push triggering pull

• Push – Database to middle tier• Push all the way across the tiers• Client to Client Push

Page 3: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

ASYNCHRONOUS COMMUNICATION IN THE REAL WORLD• “I’ll get back to you”• “Don’t call us,…”• Low fuel warning in car• “Please let me know”• “Return to sender – address unknown” • Newspaper delivery• Next instruction from car navigation system• Telephone ringing• Alarm clock buzzing• Parking sensors beeping• Fire alarm screaming

Page 4: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

ASYNCHRONOUS INTERACTIONS AND PUSH IN THE IT LANDSCAPE

• More timely information– Notification as soon as possible

• Proactive offering– Do not ask and you shall be given

• Lower load on back end – don’t call us (all the time) …– Stop hitting the F5 button!

• Multi-channel information manipulation and dissemination– Changes and events come in from everywhere

• Decouple system components through generic infrastructure for handling events and push– Yet integrate

Page 5: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

PUSHING IT … INTO THE USER INTERFACE• Automatically refreshing (part of) a page

– Update table– Redrawing chart

• Displaying popup to alert user to an event– Arrival of message (email or chat)– Signing in or out of contact (presence)– Lock or release of some resource– Notification

• Changing status of items on the page– Highlight change indicator– Show icon– Change text to italic

• Play a sound

Page 6: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

Web Browser

RDBMS

JEE Application Server

Mobile Device

Email Server Chat ServerRDBMS

JEE Application

Server

Web Browser

3 rd party

Mobile Device

Complex Event Processor

NonJava

Server

Page 7: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

THE ‘ONLY TELL WHEN ASKED’ GAME

Page 8: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

INTRODUCING ADF ACTIVE DATA SERVICE• Built in mechanism in ADF to push updates

from the middle tier to the browser– active UI components that refresh upon

reception of the push (table, image, output text, DVT graphs)

– client side infrastructure to process received push messages

– a multiplexed (multi-event) channel to push to client – leveraging WebLogic Server push capabilities• Long poll today, WebSockets or SPDY tomorrow

– server side infrastructure to manage active beans and turn events into pushed messages

– Active data control: • BAM Data Control for push from BAM’s Active Data

Cache all the way to data bound UI components

Page 9: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

OVERVIEW OF ADS INFRASTRUCTURE

Page 10: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

USING ADF ACTIVE DATA SERVICE TO EMBED CHAT CLIENT IN WEB APPLICATION

• Instant Messaging should be instant– Requirement to push incoming messages to client

• Common IM protocol is XMPP (over TCP)– Extensible Messaging and Presence Protocol

• XMPP Java Libraries help to connect to and communicate with XMPP servers– For example Smack

• To embed chat in in ADF application we need to– consume messages over XMPP – and push them to the Web Client

• The ADS approach:– Use ‘active’ UI Components– Bind them to bean that

implements ActiveDataModel– Turning the IM messages

into entries in ActiveDataModel

Page 11: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

EXAMPLE OF ADS: GOOGLE TALK

Web Browser

JEE Application Server

Page 12: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

EXAMPLE OF ADS: GOOGLE TALK

Web Browser

JEE Application Server

Page 13: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

PUSH TROUGH ACTIVE DATA SERVICE

Web Browser

MessageReceiver

ADS

Page 14: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

PUSH TROUGH ACTIVE DATA SERVICE

Web Browser

MessageReceiver

ADS

Page 15: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

INTRODUCING BUSINESS ACTIVITY MONITORING• Operational Business Intelligence• Data fed in from many sources:

– RFID sensors, BPEL, Database Triggers, RSS, ODI

• Real Time insight • Dashboard• Live updates• Looking for threshold crossing, exceptions,

trends, missing events• Display visually and turn into alerts &

notifications

Page 16: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

INTRODUCING BUSINESS ACTIVITY MONITORING

ADF Application

Page 17: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

EMBEDDING REAL TIME DISPLAYS IN ADF BASED ON BAM DATA CONTROL• Configure connection to BAM Server• Create BAM Data Control

– Based on Data Objects inActive Data Cache

• Drag & Drop Data Control’scollections & attributes toADF Faces pages– Just like ADF BC

Data Control– However:

BAM Data Control is active

Page 18: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

LIVE VOLLEYBALL REPORTING

JMS Q

ueueBAM

Web Browser

Data Object

Page 19: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

CREATE BAM DATA CONTROL

Page 20: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

PROGRAMMATIC CROSS TIER INTERACTION

Web Browser

JEE Application Server

Page 21: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

Client

Server (middle tier)

Database

JavaScript Components

ComponentsBeans & Objects

activeOutputText

Active DataModel

activeOutputText

push

serverListener

Bean

Load JSON, CSS, Image, XML, JSRequest

data orPush message

push (DB QRCN)

Object

clientListener

componentuser action

serverListener

partial page

refresh

partialSubmit autoSubmit

JavaScript Function

Queue Custom Event

componentcomponent

manipulate

pollsetPropertyListener

userorprogrammaticaction

add JS toexecute (ERKS) add

componentsas partial target

ERKS ‘ppr script’

partial triggers, added targets

actionListener, valueChangeListener,

…Listener

componentcomponent

prop

erty

chan

ge

Full pagereload

CLIENT SERVER INTERACTIONS VV.

Page 22: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

THE PUSH-TO-NUDGE TRICK(MATTHIAS WESSENDORF)

activeOutputText

Active Bean

clientListenertype=propertyChange

Client Listener Function

Active data

Event Handler

Servlet

JMS Listener

Scheduled Job

•Show popup•Update field value•Modify style property•Call Server (PPR)

& Event Listener

Page 23: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SIMPLE NUDGE TO CLIENT

Page 24: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SIMPLE NUDGE TO CLIENT

Page 25: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

CLIENT TO CLIENT PUSH – SLIDE SYNCHRONIZATION

Page 26: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

CLIENT TO CLIENT PUSH – SLIDE SYNCHRONIZATION

Page 27: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)
Page 28: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

activeImageBean

activeImageBean

Page 29: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

CROSS TIER PUSH – ARCHITECTURE PATTERN

event handler

Scheduled Poll Job

listener listener listener

register

Push Receptor

Payload Retriever

‘Events collector’

Page 30: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

CROSS GAP PUSH MECHANISMS

• Many channels are available to push messages from one entity to another, – across application, technology and location

boundaries• JMS• (one way) WebService (SOAP or REST)• “HTTP Channel”• WebSockets• Http Call to Servlet• XMPP

Page 31: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

CLIENT TO CLIENT PUSH

• Usually really a combination of– Client-to-Server– and Server-to-the-other-Client push

• Exception: Blue Tooth, Near-Field Communication

Page 32: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SERVER TO MOBILE PUSH:MULTIPLEXED, SEMI-POLL BASED

Page 33: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

PUSH FROM DATABASE TO MIDDLE TIER • Middle tier asks database – through JDBC,

ODBC, SQL*Net, HTTP, …– The database is reactive only – not pushy at all

• Some mechanisms allow the database to take the initiative and start to push– Database Query Result Change Notification– Http calls from utl_http or JSP– Table with Multiplexed Poll

Page 34: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

THE HOLLYWOOD PRINCIPLE: QUERY RESULTSET CHANGE NOTIFICATION

POJO / ADF BC

Page 35: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

CACHE REFRESH TRIGGERED BY DB

PL/SQL

POJO / ADF BC

SQL query

Register

DatabaseChange

Notification

Oracle RDBMS invokes

Java Listener with event

details

Page 36: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SHARED APPLICATION MODULES

• Regular Application Module instances are session level – i.e. not shared across (web) sessions

• Shared Application Module instances are shared across sessions like an Application Scope Managed Bean– Used for Static Data Sets: Look Up Data and

Reference Tables

• Sessions can reuse the data from a shared Application Module without having to access the database– And without loading the data in session level memory

scope

• View Accessors can be used to access data in the Shared Application Module’s VOs– For example for use in LOVs or Validation Rules

Page 37: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SHARED APPLICATION MODULE INSTANCE

Page 38: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

AUTO REFRESH FOR VIEW OBJECTS• ViewObjects in a Shared Application Module

can be registered for auto refresh– Typically such application wide VOs are near-

static– Whenever the underlying data set changes (in

the database), the VO rowset should be refreshed

• By setting Auto Refresh (to true) for the ViewObject, the VO will be refreshed whenever the database is changed– ADF registers the VO query with the Database

(11g) Result Set Change Notification mechanism through JDBC

– Note: the VO should not have an Order By clause nor select a Date column

Page 39: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

STEPS FOR AUTO REFRESH ENABLING• Create Shared Application Module

– New application module that is added to list of Application Level instances in the Project properties

• Create the ViewObject that queries the ‘static data’ and add to Shared Application Module

• Set the Auto Refresh property to true for VO instance

• Database must be 11g (and have parameter compatible set to 11.1.0 or above)– database user must have the Change

Notification privilege• To piggy back changes to page, set

changeEventPolicy to autoPPR on data binding

Page 40: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SET AUTO REFRESH FOR VIEWOBJECT• Set Auto Refresh

for ViewObject

• Grant Change Notification todatabase user

Page 41: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

DEMO: DATABASE PUSH TO VIEW OBJECT IN ACTION

DBQRCN

Page 42: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

AUTO-PPR FOR IMMEDIATE REFRESH OF DATA BOUND COMPONENTS

• To have ADF automatically refresh data bound components when underlying value binding has changed its value

• Set changeEventPolicy=ppr on iterator– Refresh as piggy back on any request cycle– No partialTriggers attribute required!

Page 43: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

JEE Application Server

RDBMS

ALTERNATIVE DATABASE TO MIDDLE TIER PUSH IMPLEMENTATION

event handler

Scheduled Poll Job

listener listener listener

register

Push Receptor

Payload Retriever

‘Events collector’

servlet

utl_http

trigger

Application scope bean

Session scope bean

Page 44: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

CROSS TIER PUSH

Web Browser

RDBMS

JEE Application Server

trg

job

servlet

activeOT

evt lsnrCache

refresher

table

Page 45: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

INITIATE ‘NORMAL’ PPR CYCLE IN WHICH TO REFRESH UI COMPONENTS

activeOutputText

Client Listener Function

Bean

someComponent

serverListener

PPR request

retrieve data

clear cache

RDBMS

refre

sh p

age

component

Entity

View

IteratorAuto ppr

clientListenertype=propertyChange

Page 46: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SERVER PUSH CHALLENGES

• How to push against the ‘one way direction’ and despite limitations– HTTP and JDBC are request/response – not

response only– Browser limit of only two channels to one server

• Server side ‘event handling’– Session has to have an active life beyond

requests• Or requests have a life beyond response

– Higher load on the server– How to handle the (potential) volume of

‘concurrent’ channels and the number of open threads• NIO, Servlet 3.0, Jetty Continuations, Tomcat

Advanced I/O

Page 47: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SERVER PUSH CHALLENGES (2)

• Where do events to push actually come from?– Who perceives/receives (real-time) events (on

the server side)– How are they tied in to the appropriate

sessions?• Client (consumer) side: how to

asynchronously receive events and how to process them/turn them into action and UI updates

• How to correlate an asynchronously received message with a previously sent request or a subscription– For example: mobile phone showing SMS or

WhatsApp messages in a conversation thread style

Page 48: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

FUTURE DEVELOPMENTS

• The real time enterprise• The event driven enterprise• Further evolution of push notification at

every tier– Mobile perhaps leading the way

• Infrastructure and frameworks providing push mechanisms– Such as Active Data Service

• Servlet 3.0, Java NIO, WebSockets,SPDY, XMPP and other lighter weight solutions for bi-directional communication over TCP– And broad support in browsers

and application servers

Page 49: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SUMMARY

• Push – Pro active or at least real time user interface– Real time user to user interaction– Decrease load on infrastructure (refresh over and

over)• Real push hardly exists

– Smart poll/pull is often underlying implementation– Piggy backing, Multiplexing, decoupling etc. are

required to scale• ADS is powerful

– Especially with the ‘nudge now you do a fine grained fetch or refresh’ pattern

• Database can push too – using DBQRCN, HTTP, ….

• ADF can push to Android or iOS– Using Google and Apple Push Notification Services– ADF Mobile should support push notification as well

Page 50: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

SESSION PLUGGING

• Sunday – Gold Nuggets in ADF (S32502)3.15-4.15, Moscone West-2000

• Tuesday – Reaching Out from PL/SQL (S08625 )10.15-11.15, Mariott Marquis, Salon 7

• Tuesday – (JavaOne) Cross Tier Push Architecture (Don’t call us, we’ll push you) (S24722)4.30-5.15 PM, Hotel Nikko, Monterey I/II

• Wednesday – Push to the Limit: Rich and Proactive User Interfaces with Oracle ADF (S08620)5-6 PM, Mariott Marquis, Golden Gate A

• Thursday – Instant Agility in Oracle Fusion Middleware through Design Time @ Run Time (S08623)4-5 PM, Moscone West – 2020

Page 51: Push to the limit - rich and pro-active user interfaces with ADF  (Oracle Open World 2011)

Recommended