Bergmans Mechatronics LLC Bookmark and Share
  Home Combustion Control System HTML 5 WebSockets Project Portfolio LabVIEW Corner About BML
   
   
 

HTML5 WebSocket Application Research

 

A recent advancement in the field of Internet technology is the HTML5 WebSocket communications protocol which enables real-time, bi-directional data exchange between browsers and servers.  BML has been doing research into the use of WebSocket with the goal of exploring the possibility of demand for real-time, browser-accessible networked software applications.

 
WebSocket News
  • New GroupVote: A Real-Time, Multi-User Voting System Prototype (WebSocket demo app developed during MobileHackDays)
  • collectdViewer: High Frequency Server Monitoring in the Browser using WebSocket
  • A guide to quickly getting up to speed on WebSockets in the Cloud: Installation of a Kaazing WebSocket Gateway on an Amazon EC2 Micro Instance (1.3 MB PDF)
  • Visit labsocket.com to learn about BML's system to extend LabVIEW to the browser without plug-ins (Site includes videos, free downloads and tech details)
  • SportJury, the first application using BML's LabSocket system and the first commercial LabVIEW application employing WebSockets!
    Read the White Paper.
    BML WebSocket Lab
  • HTML5 WebSocket Interface to a MySQL Database
    Quick Links
  • One-day HTML5 WebSocket Workshop
  • EarthControl game on Facebook
  • BML presentation on use of WebSocket to enable a Facebook game:
    "EarthControl: A Real-Time, Multi-User Facebook Game Enabled by HTML5 WebSocket" (423 kB)
  • Kaazing Corporation website
     

    Traditional Browser-Server Interface

       
     

    The traditional communication protocol between a web browser and web server involves, in simplified terms, the browser creating a request for data and the web server software generating a response, normally, in the form of a web page.  In a typical arrangement, the browser resides on the user's desktop computer and the server software executes on a web server computer in a remote hosting facility.  A back-end application on the server may also generate or process data as part of this interaction.

     

    Traditional Browser-Server Interface
    Traditional Browser-Server Interface

     

    Bi-Directional Data Exchange Enabled by WebSocket

       
     

    The draft of the latest standard of HTML 5, contains definitions for the WebSocket communications protocol. The bi-directional nature of the protocol is significant because it means that data can be transferred or "pushed" from the server to the browser without a request for an update from the browser.  One common application example given for this type of data transfer is providing real-time updates of stock prices within a website.

       
     

    Communications using WebSocket require two components: i) WebSocket-compatible server software to handle the exchange of data between the browser and an application on the server; and, ii) a browser which is capable of processing WebSocket.

    Kaazing Corporation (www.kaazing.com) of Mountain View, CA, has developed the Kaazing Gateway Server software which, in addition to acting as a normal web server, is a gateway or exchange for transferring WebSocket data between a browser and back-end applications on the server, as shown at right.

     

    WebSocket Enabled Interface WebSocket Interface
     

    Most browsers currently in use, such as Internet Explorer 7.0, do not support the HTML 5 standard.  For these browsers, Kaazing has developed browser-side libraries which can interact with the Kaazing Gateway to emulate the implementation of a WebSocket connection between the browser and server. 

    By transferring data over WebSocket through the Kaazing Gateway server, software on the browser and the back-end application can exchange data on a continuous basis. This new relationship between browser and back-end application offers the possibility of developing an entirely new class of Internet application. An example of this type of application and a discussion about the characteristics of WebSocket-enabled applications follow.

    A more detailed description of the Kaazing Gateway server architecture and comparisons of WebSocket with other bi-directional communications techniques is available in this overview by Kaazing.

     

     

    EarthControl - A WebSocket Technology Demonstration

       
     

    As a demonstration of the intriguing capabilities of WebSocket technology, BML has developed a multi-player, real-time game named "EarthControl" which runs within the Facebook social networking website.  Although this is an entertainment application, the architecture of the program uses many of the elements that a technical or business application might employ and therefore this demonstration has relevance to the implementation of more serious applications.
     
    The objective of EarthControl is for players to
    maneuver their ships in space, collect barrels of oil and score points by returning their oil-laden ships to Earth. Players can shoot their opponents using "plasma balls" to capture oil on-board the target ship.

    A screenshot and video of EarthControl are shown at right. The video depicts an earlier version of the game, but is still representative of the basic strategy and action of the current revision.

     
    EarthControl Screenshot
     
     
    EarthControl Video
     

    Behind the scenes, operation of the application is as follows. Players in an EarthControl game generate ship control and fire commands using the arrow keys and space bar, respectively, on the keyboard. These commands are sent via WebSocket and the Kaazing Gateway server to a STOMP (Streaming Text Orientated Messaging Protocol) server. The STOMP server then passes the command to the specific EarthControl game instance to which the player has been assigned.

    Open receiving a keystroke signal from a browser, the game instance computes the resulting coordinates of each of ship and plasma in the game and sends this complete coordinate data set out to each browser, again using WebSocket via the STOMP server and the Kaazing Gateway. 

    Each group of eight players is assigned to an instance of the EarthControl game software, as illustrated at right. An administrator program assigns incoming users to empty positions in an existing game instance or starts a new game instance if no existing positions are available. Scoring and other user data is managed by a MySQL database on the server. 

     

     

    EarthControl Architecture
    EarthControl Architecture
    (Click to Enlarge)


    A notable aspect of this application is that WebSocket and the Kaazing Gateway enable data transmission rates and response times which give the impression that the application is being hosted on the user's local computer.  This performance can be achieved even when the physical distance between users and the server is thousands of miles.

    Typical server data transmission rates for this application are as follows.  When a ship or plasma is in motion, the server transmits an approximately 340 character long string representing the coordinates of objects in the playing field to each browser at a rate of about 10 Hz.  This represents a data rate of about 3400 bytes/sec. The time delay between user input and response on the browser is nearly imperceptible and is estimated to be less than 100ms.

    These performance characteristics enable relatively smooth motion of objects in the playing field and give players the ability to accurately control their ships.

    Additional information about EarthControl is available in BML's technical presentation entitled "EarthControl: A Real-Time, Multi-User Facebook Game Enabled by HTML5 WebSocket" (423 kB).

    WebSocket - Enabling Technology for a New Type of Application?
    From a more general perspective, the significance of WebSocket technology is that entirely new types of applications can now be created which use a browser as a real-time user-interface and the server for data processing and data exchange between users.

    This arrangement is similar conceptually to the architecture of a by-gone computing era in which multiple remote "dumb"-terminals were used to interact with a mainframe computer.  Today, however, large numbers of sophisticated browsers can interact with low-cost commodity servers and high data rate transmission between browsers and servers essentially removes the effect of distance between these elements of an application.
     
    While it is currently unclear what applications, other than stock updates, real-time chat, and on-line games, will be made possible by this technology, characteristics of these new applications could include the following:

    • simultaneous display of data from a server to a large number of users
    • simultaneous data input from a large number of users to a server
    • high-speed, low-latency inter-user communication and data transfer
    • user's browser-based experience "feels" identical that of a desktop application
    • nearly unlimited amounts of data processing and storage on server

    The fact that WebSocket offer the potential for new  levels of connectivity between increasingly powerful and ever-cheaper network elements suggests that this is a technology worth further investigation. Please feel free to contact BML if you would like to discuss WebSocket in general; concepts for WebSocket applications; or, the development of a custom application using this technology.

     

     

    Back to Top of Page Top


    © 2004-2011 Bergmans Mechatronics LLC