Your SlideShare is downloading. ×
0
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Reverse ajax in 2014
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Reverse ajax in 2014

830

Published on

Reverse Ajax …

Reverse Ajax
Libraries, techniques and support in 2014

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
830
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
22
Comments
0
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Reverse Ajax Techniques, libraries and support in 2014
  • 2. Ajax (Asynchronous JavaScript and XML) • Group of interrelated Web development techniques used on the client-side to create asynchronous Web applications. • With Ajax, Web applications can send data to, and retrieve data from a server asynchronously (in the background) without the need for a page reload. • It is a browser feature accessible to a web page through the JavaScript. • Though the name includes XML, nearly anything can be transfered with an Ajax request. • The most commonly used data is JSON, which is close to JavaScript syntax and consumes less bandwidth. • Ajax requests are stateless by default, and can only be opened from the client to the server.
  • 3. Reverse Ajax • Reverse Ajax is essentially a concept for sending data from the server to the client. • It can be simulated with a repeated Ajax request from client – simple polling, piggyback polling. • Comet – umbrella term for various techniques for Reverse Ajax • Coined by Alex Russel in 2006. • It can be simulated with a long-held Ajax request from client . • Server can send events to the client without the client specifically requesting it. • Also known as Ajax Push, Two-way-web, HTTP Streaming, and HTTP server push, • First implementations appeared in 2000 with Pushlets and LightStreamer media server
  • 4. Reverse Ajax Basic polling techniques
  • 5. Reverse Ajax – simple polling
  • 6. Reverse Ajax – simple polling • Basic Ajax with regular interval requests (every few seconds). • To get the server events as soon as possible, the polling interval (time between requests) must be as low as possible. • If interval is reduced, the client will issue many more requests, many of which won't return any useful data, and will consume bandwidth and processing resources for nothing. • Advantages: It's really easy to implement and does not require any special features on the server side. It also works in all browsers. • Disadvantages: This method is rarely employed because it does not scale at all. Example: 100 clients each issuing polling requests for 2 seconds, where 30% of the requests returns no data.
  • 7. Reverse Ajax – piggyback polling
  • 8. Reverse Ajax – piggyback polling • Piggyback polling removes all redundant requests (which return no data) • There is no interval • Requests are sent when the client needs to send a request to the server • The difference lies in the response, which is split into two parts:  the response for the requested data  server events, if any • Advantages: Less resource consumption. Works in all browsers, does not require special features on the server side. • Disadvantages: You have no clue when the events accumulated on the server side will be delivered to the client.
  • 9. Reverse Ajax – Comet
  • 10. Reverse Ajax – Comet • Request is sent to the server and kept alive for a long time, until a time-out or a server event occurs. • When the request is completed, another long-lived Ajax request is sent to wait for other server events. • With Comet, web servers can send the data to the client without having to explicitly request it. • The server can push events on the clients by immediately committing (completing) the responses, or it can accumulate them and send bursts. • Special features are required on the server side to handle all of these long-lived requests (Servlet 3.0 or Websockets) • Implementations of Comet can be separated into two types: those using streaming mode, and those using long polling.
  • 11. Reverse Ajax Comet - Streaming Mode
  • 12. Comet – Streaming mode • In streaming mode, one persistent connection is opened • It requires a way to separate the different responses coming through the same connection on the client side. • Technically speaking, two common techniques for streaming include:  Forever Iframes (hidden Iframes) or  Multi-part feature of the XMLHttpRequest object used to create Ajax requests in JavaScript.
  • 13. Comet – Forever Iframes • Forever Iframes technique involves a hidden Iframe tag put in the page with its src attribute pointing to the servlet path returning server events. • Each time an event is received, the servlet writes and flushes a new script tag with the JavaScript code inside. • The iframe content will be appended with this script tag that will get executed. • Advantages: Simple to implement, and it works in all browsers supporting iframes. • Disadvantages: There is no way to implement reliable error handling or to track the state of the connection, because all connection and data are handled by the browser through HTML tags. You don't know when the connection is broken on either side.
  • 14. Comet – Multi-part XMLHttpRequest • This technique uses the multi-part flag supported by some browsers (Chrome, Firefox) on the XMLHttpRequest object. • An Ajax request is sent and kept open on the server side. Each time an event comes, a multi-part response is written through the same connection • On the server side it is required to set up the multi-part request, suspend the connection and return responses asynchronously (Servlet 3.0) • Advantages: Only one persistent connection is opened. This is the Comet technique that saves the most bandwidth usage. • Disadvantages: The multi-part flag is not supported by all browsers. Some widely used libraries, such as CometD in Java, reported issues in buffering. For example, chunks of data (multi-parts) may be buffered and sent only when the connection is completed or the buffer is full, which can create higher latency than expected.
  • 15. Reverse Ajax Comet - HTTP long polling
  • 16. Comet - HTTP long polling • The long polling mode involves techniques that use repeated long-held client requests. • When client initiates a connection, it is kept open by the server, and as soon as an event occurs, the response is committed and the connection is closed. • New long-polling connection is reopened immediately by the client waiting for the new events to arrive. • You can implement HTTP long polling by using  Script tags  XMLHttpRequest object.
  • 17. Comet – Script tags • Similar to the iframe technique, the goal is to append a script tag in your page to get the script executed. • The server will: suspend the connection until an event occurs, send the script content back to the browser, and then reopen another script tag to get the next events. • Advantages: Because it's based on HTML tags, this technique is easy to implement and works across domains (by default, XMLHttpRequest does not allow requests on other domains or sub-domains). • Disadvantages: Similar to the iframe technique, error handling is missing, and you can't have a state or the ability to interrupt a connection.
  • 18. Comet - XMLHttpRequest long polling • Recommended method to implement Comet • Client opens an Ajax request to the server and waits for the response. • The server requires specific features on the server side to allow the request to be suspended (Servlet 3.0). • As soon as an event occurs, the server sends back the response in the suspended request and closes it. • The client then consumes the response and opens a new long-lived Ajax request to the server. • On the back end, the code also uses the Servlet 3 API to suspend the request, as in HTTP streaming, but without multi-part handling.
  • 19. Comet - XMLHttpRequest long polling • Advantages: It's easy to implement on the client side with a good error- handling system and timeout management. This reliable technique also allows reusing connections on the server side, since connections are not persistent (a good thing, when you have a lot of clients on your application). It also works on all browsers; you only make use of the XMLHttpRequest object by issuing a simple Ajax request. • Disadvantages: There is no main disadvantage compared to other techniques. But, like all techniques we've discussed, this one still relies on a stateless HTTP connection, which requires special features on the server side to be able to temporarily suspend it. • Several well-known libraries implement Comet in Java and Javascript:  DWR  CometD  Atmosphere
  • 20. Reverse Ajax Libraries
  • 21. DWR • DWR – direct web remoting • Well known library for integration between client-side JS and server-side Java code • Reverse Ajax Modes  Early Closing Mode (default, low performance for large number of clients)  Full Streaming Mode (Not available to IE users)  Long Polling (best option)  Piggyback mode • Advantages: Highly configurable and stable library. • Disadvantages: Development is slow, Websocket support is uncertain.
  • 22. Atmosphere • Atmosphere is a Java technology framework that provides a common API for using the Comet and WebSocket features of many of the web servers, including Tomcat, Jetty, GlassFish, Weblogic, Grizzly, JBossWeb, JBoss, and Resin. • Atmosphere has been around for more than two years, and it is still in active development. It is used in large web applications such as JIRA • Advantages: Atmosphere's strength remains on the server side: it provides a standardized API that covers all of the different solutions and ways to communicate with WebSockets or Comet. • Disadvantages: Atmosphere does not use a protocol between the client and server, like DWR and CometD.
  • 23. CometD – our choice • CometD framework is an event-driven communication solution based on HTTP. It provides a Java server part and a Java client part, plus JavaScript client libraries based upon jQuery and Dojo. • It has been around for several years. It supports WebSockets. Reverse Ajax Mode is implemented with XMLHttpRequest long-polling. • All of the components communicate through a bus to send notifications and receive events. All communication is asynchronous. • Advantages: CometD offers a complete solution, from client and server side, and also from a standalone Java client to a server. The framework is well- documented and is easy to use. It supports many features - reconnection, reliable timeout detection, error handling, low-latency communication ... • Disadvantages: CometD currently does not support any Servlet 2.5 containers other than Jetty for Comet (Tomcat), and it does not support Glassfish/Grizzly WebSocket
  • 24. Websockets Overview
  • 25. Websockets • WebSockets, which comes from HTML5, is a new technique for bidirectional, full-duplex communication. • The connection is opened through a HTTP Upgrade request (HTTP request with special headers), called a WebSockets handshake. • The connection is then kept alive, and data is exchanged between both sides directly. • Best option for bidirectional communication, future standard • Supported in Chrome 14+, Firefox 6+, Safari 6+, IE 10+ • Supported on Tomcat 8, JBoss 8, Glassfish 3, Jetty 7 • Supported in CometD along with long polling.
  • 26. References IBM Developerworks: Reverse Ajax series http://www.ibm.com/developerworks/library/wa-reverseajax1/ Javabeat: An introduction to Comet and Reverse Ajax http://www.javabeat.net/introduction-to-comet-and-reverse-ajax/ DWR: Reverse Ajax http://directwebremoting.org/dwr/documentation/reverse-ajax/ CometD: http://docs.cometd.org/reference/ Atmosphere Framework: http://async-io.org/
  • 27. References Oracle: Asynchronous Notifications with Servlet 3.0 http://www.oracle.com/webfolder/technetwork/tutorials/obe/java/async- servlet/async-servlets.html Javabeat: Asynchronous Servlet http://www.javabeat.net/asynchronous-servlet-servlet-3-0/ Google groups: CometD users https://groups.google.com/forum/#!topic/cometd-users Wikipedia: Comet http://en.wikipedia.org/wiki/Comet_(programming)#Implementations

×