Desktop AJAX

Chris Jolley, Robert Bergman 1/12/2007

Ajax
Asynchronous Javascript And XML Acronym coined by Jesse James Garret, Adaptive Path Widespread use triggered by Googles online applications: gmail, maps.. Widespread use also triggered by more powerful browsers and client computers Zero-footprint rich user interface, still a web page

New Weblogic Portal Feature

In 9.2 we added the ability to Ajaxify a Portlet. asyncContent=[ajax|iframe] In 10.0 we give you the ability to Ajaxify the entire desktop

asyncMode=[enabled|disabled|compat_9_2]
These technologies are mutually exclusive
enabled turns on for desktop off for portlets

disabled turns off for desktops and portlets

compat_9_2 off desktop on for portlets

Enabling These Features

AsyncContent on portlet Attribute on <netuix:portlet asyncContent=ajax/> Crack open the .portlet file or IDE

AsyncMode on the Desktop

Attribute on the <netuix:desktop asyncMode=enabbled/> Crack open .portal file of IDE Enable via the admin tools

Enable from the Admin tools

What are the benefits

The idea is to only send back the content that has changed. Reduce/eliminate page reloads Increase speed/responsiveness Enhance usability Make applications more interactive No modifications to existing applications Working with standards

Desktop asyncMode=enabled

First Request

Browser
Http

Portal Servlet
text/html

DOM

subsequent

ajax.js

XHR

Portal Servlet
JSON

Portlet asyncContent=[ajax|iframe]

Browser

http

Portal Servlet
html

DOM

N+1

async.js

XHR/iframe

Portal Servlet
html

DOM

async.js

XHR/iframe

Portal Servlet
html

When to use which

Both give quicker response times Portlet AsyncConent
Enable for just that portlet (maybe portal does not work with entire desktop enabled) Long Running Portlets dont want to hold up entire page N + 1 requests

Desktop AsyncMode
Inter portlet communication Need context information (eg. PageBackingContext)

Newer Web sites

1 request

Http Request

text/html

First request, links wrapped in tag, Browser Refresh, Redirects, Page change links

XHR Request

application/json ajax.js Subsequent requests

What works/doesnt
While the goal is to just enable this feature and have everything work as before, only quicker. Reality Do Work

WSRP Threading

Redirects Look and Feel Changes

Cache
IPC All Portlet Types Nested Books

Tree Optimization
Customizations Themes Portlet States/Modes

XHTML

Limitations and
May never Work
Portlets that expect to be refreshed without any interaction Developer can call new method PortletBackingContext.setRenderOnAjaxRequest(boolean); Some javascript page events: onload(), onunload(), onbeforeunload() Next release mimic these events Delete button with old style look and feels

Disable
<render:context asyncContentDisabled="true">
Adds request param _portlet.async=false DesktopBackingContext.setAsyncMode(String mode);

Working With Other AJAX frameworks

Challenges
Some frameworks tend to want to own the entire page does not work well with portals or mashups.

Multiple instances of a portlet on the same page

Namespacing issue Javascript versioning issues Synchronization of client and server.

Working through standards

JSR286, JSR301, WSRP, and the OpenAjax Alliance -- to resolve these specific issues and to enable integrating other AJAX frameworks with WebLogic Portal.

Recommendation
near-term, we suggest using a framework like Dojo, as this has been used by many developers to create portlet content using AJAX. Use WLPs additional AJAX features like drag and drop tags

Demo