This project includes a special version of Lightstreamer Stock-List Demo that demonstrates two important features of Lightstreamer: bandwidth management and frequency management
JavaScript HTML CSS
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
build_r.js
src
.gitattributes
.gitignore
README.md
screen_bandwidth.png
screen_bandwidth_large.png

README.md

Lightstreamer - Bandwidth and Frequency Demo - HTML Client

This project includes a special version of Lightstreamer - Stock-List Demos - HTML Clients that demonstrates two important features of Lightstreamer: bandwidth management and frequency management.

Live Demo

Demo ScreenShot

View live demo

Details

Use the Max Bandwidth slider to dynamically change the maximum bandwidth granted for the current session. The client will notify the server of the new bandwidth and the server will change the update frequency on the fly, to respect the bandwidth limit. You can see that with a bandwidth as ridiculous as 0.5 kilobits per seconds, Lightstreamer is still able to deliver updates to the page, thanks to the very optimized network protocol used.

Use the Max Frequency slider to dynamically change the maximum update rate of each item in the Subscription. The client will notify the server of the new frequency limit and the server will change the update frequency on the fly, to respect the frequency limit.

You can see how the bandwidth and frequency constraints act on different levels. The bandwidth constraint is applied to the whole session, that is, to the global update flow for this page. On the other hand, the frequency constraint is applied to each row (Item) individually. Both the constraints set an upper bound, which is dynamically managed by Lightstreamer Server. Note that, thanks to MERGE mode, the updates are not queued and delayed, but resampled and conflated. In other words, when an item has a chance to be updated (based on a round-robin algorithm), it will receive the very latest state available, not an old one.

Click on the link under the table (Next/Previous 15) to dynamically switch between two lists of fifteen items and see how the initial snapshot is loaded, still respecting the bandwidth limit.

The demo includes the following client-side functionalities:

  • Two Subscriptions containing 15 items each, subscribed to in MERGE mode, feeding a DynaGrid alternately, according to the selected list.

Install

If you want to install a version of this demo pointing to your local Lightstreamer Server, follow these steps:

  • Note that, as prerequisite, the Lightstreamer - Stock- List Demo - Java Adapter has to be deployed on your local Lightstreamer Server instance. Please check out that project and follow the installation instructions provided with it.
  • Launch Lightstreamer Server.
  • Get the lightstreamer.js file from the Lightstreamer 5 Colosseo distribution and put it in the src/js folder of the demo (if that is the case, please create it). Alternatively, you can build a lightstreamer.js file from the online generator. In that case, be sure to include the LightstreamerClient, Subscription, DynaGrid, ConnectionSharing, and StatusWidget modules and to use the "Use AMD" version.
  • Get the require.js file form requirejs.org and put it in the src/js folder of the demo.
  • Get the zip file from script.aculo.us and put the prototype.js, scriptaculous.js, and slider.js files in the src/js/scriptaculous folder of the demo.

You can deploy this demo to use the Lightstreamer server as Web server or in any external Web Server you are running. If you choose the former case, please create the folders <LS_HOME>/pages/demos/BandwidthDemo then copy here the contents of the src folder of this project.
The client demo configuration assumes that Lightstreamer Server, Lightstreamer Adapters, and this client are launched on the same machine. If you need to target a different Lightstreamer server, please search this line:

var lsClient = new LightstreamerClient(protocolToUse+"//localhost:"+portToUse,"DEMO");

in lsClient.js and change it accordingly.

The demo is now ready to be launched.

Build

The html application can be optionally built, to reduce the number and size of the files to be downloaded by the browser, using r.js. A ready-made configuration file for the build process of the demo is available in the build_r.js folder of this project.

The build is configured to use Google Closure compiler to minify the files. To run it as-is, you need to download rhino js.jar file, compiler.jar from the closure compiler project, and r.js from RequireJS. You also need a Java Virtual Machine installed on your system.

Once ready, from the build_r.js folder, run

java -cp compiler.jar;js.jar org.mozilla.javascript.tools.shell.Main r.js -o app.build.js

As an alternative, it is possible to customize the build file to use UglifyJS; in this case, it can be built using node.js instead of using the JVM.

See Also

Lightstreamer Adapters Needed by These Demo Clients

Related Projects

Lightstreamer Compatibility Notes

  • Compatible with Lightstreamer JavaScript Client library version 6.0 or newer.