Home » Source Code » A pattern for real-time web application architecture

A pattern for real-time web application architecture

2016-05-17 03:00:40
The author
Download(s): 0
Point (s): 1 
Category Category:



Ok, we have various widgets on a page and want them update in real-time. We can have a message broker object ($.rta) with which we subscribe our widgets for update events. var aWidget = (function() { return { name : 'aWidget', module : 'aModule', init : { $.rta.subscribe(this, function(e, data){ }); } }});

Since all my widgets are derived by $.jsa.WidgetAbstract (Please find details in JS Application Design , I extended the class by $.jsa.RealTimeWidgetAbstract, which made the following interface: ``` var aWidget = function(settings) { return $.jsa.extend({ name : 'aWidget', module : 'aModule', subscribeRta : function(e, data) {}

  }, $.jsa.RealTimeWidgetAbstract, settings);

}; ``` Pretty easy, is not it? Well, but the message broker is assumed to communicate somehow with the server. There is a bunch of trick called COMET and couple of HTML5 approaches (Server-Sent Events and WebSockets). All can serve, so you find examples and comparison in my article WebSockets vs Server-Sent Events vs Long-polling . In this particular case I’m using long-polling, but leaving place for any other implementation. You can plug it in as an adapter manually.

Long-polling is no real full-duplex asynchronous messaging channel, but a trick based on ability of XMLHttpRequest to wait until the server eventually responds. That is an emulation of server pushing events to the browser. Thus, we don’t have open channels, but make a long-waiting request, passing the message queue onto the server controller. The controller serves the queue in a loop until an update for any of queued widgets is met. The RTA communication bridge gets update data, fires the event for the updated widget and repeats the request. To make it true, when subscribing widgets we actually populate the message queue and start requesting the server only when the queue is complete by $.rta.connect("path to the controller script");

Ok, we have widgets objects and the broker, which is supposed to run on background. It can be done by using a web worker. Let’s put our relatively resource-intensive functionality which makes long-polling requests into a worker. So it will be a “black-box” to which we provide once message queue as a parameter query and controller path (everything for the post request) and keep receiving updates back through the listener function.

Sponsored links

File list

Tips: You can preview the content of files by clicking file names^_^
Name Size Date
01.96 kB
screen.css1.81 kB2011-12-21|12:05
01.96 kB
jquery.rta.js3.88 kB2011-12-21|12:06
worker.rta.js991.00 B2011-12-21|12:06
demo.js1.85 kB2011-12-21|12:06
jquery.jsa.js3.71 kB2011-12-21|12:06
01.96 kB
ModuleSession.php854.00 B2011-12-21|12:06
App.php1.93 kB2012-11-06|10:16
View.php269.00 B2011-12-21|12:06
01.96 kB
NotificationModule.php2.49 kB2011-12-21|12:06
MonitorModule.php1.48 kB2011-12-21|12:06
Interface.php227.00 B2011-12-21|12:06
01.96 kB
NotificationModule.phtml366.00 B2011-12-21|12:06
MonitorModule.phtml420.00 B2011-12-21|12:06
package.json695.00 B2012-08-21|08:57
bootstrap.php320.00 B2011-12-21|12:06
facadeController.php1.79 kB2011-12-21|12:06
index.php2.08 kB2011-12-21|12:06
Sponsored links


(Add your comment, get 0.1 Point)
Minimum:15 words, Maximum:160 words
  • 1
  • Page 1
  • Total 1

A pattern for real-time web application architecture (11.91 kB)

Need 1 Point(s)
Your Point (s)

Your Point isn't enough.

Get 22 Point immediately by PayPal

Point will be added to your account automatically after the transaction.

More(Debit card / Credit card / PayPal Credit / Online Banking)

Submit your source codes. Get more Points


Don't have an account? Register now
Need any help?
Mail to: support@codeforge.com


CodeForge Chinese Version
CodeForge English Version

Where are you going?

^_^"Oops ...

Sorry!This guy is mysterious, its blog hasn't been opened, try another, please!

Warm tip!

CodeForge to FavoriteFavorite by Ctrl+D