lightstreamer-client-web
Advanced tools
This package includes the resources needed to write a Lightstreamer client.
The Lightstreamer Client Web SDK enables any JavaScript application running in a web browser to communicate bidirectionally with a Lightstreamer server. The API allows to subscribe to real-time data pushed by a server, to display such data, and to send any message to the server.
Install the package using npm
npm install lightstreamer-client-web
The package contains a variety of library formats to suit the needs of the major development flavors. For TypeScript users, the file types.d.ts declares the API types exported by the library.
| UMD | CommonJS | ES Module | |
|---|---|---|---|
| Full | lightstreamer.js lightstreamer.min.js | lightstreamer.common.js | lightstreamer.esm.js |
| Core | lightstreamer-core.js lightstreamer-core.min.js | lightstreamer-core.common.js | lightstreamer-core.esm.js |
Full: builds with all the modules in the SDK
Core: builds with only core modules (Widgets and Mobile Push Notifications are excluded)
UMD: UMD builds can be used directly in the browser via a <script> tag.
CommonJS: CommonJS builds are intended for use with older bundlers like Browserify or Webpack 1.
ES Module: ES module builds are intended for use with modern bundlers like Webpack 2+ or Rollup.
Development vs. Production Mode: UMD libraries are provided in two variants: minified for production and un-minified for development. Since CommonJS and ES Module builds are intended for bundlers, they are provided only in un-minified form. You will be responsible for minifying the final bundle yourself.
Below are some of the most common ways to include the library.
You can include the downloaded library with a <script> tag pointing to the installation folder.
The data attribute data-lightstreamer-ns sets the namespace containing the library modules
(if you want to inject the modules directly in window object, simply remove the data attribute).
Alternatively, you can get the library from unpkg CDN: https://unpkg.com/lightstreamer-client-web/lightstreamer.min.js.
A plain version of the library, lightstreamer.js, is also available in the package.
---------- index.html ----------
<html>
<head>
<script src="node_modules/lightstreamer-client-web/lightstreamer.min.js" data-lightstreamer-ns="Ls"></script>
<script>
var sub = new Ls.Subscription("MERGE",["item1","item2","item3"],["stock_name","last_price"]);
sub.setDataAdapter("QUOTE_ADAPTER");
sub.setRequestedSnapshot("yes");
sub.addListener({
onItemUpdate: function(obj) {
console.log(obj.getValue("stock_name") + ": " + obj.getValue("last_price"));
}
});
var client = new Ls.LightstreamerClient("http://push.lightstreamer.com","DEMO");
client.connect();
client.subscribe(sub);
</script>
</head>
</html>
To use the API objects as AMD-compliant modules, import Require.js loader before importing the client library (you can also use the plain version lightstreamer.js).
---------- index.html ----------
<html>
<head>
<script src="https://requirejs.org/docs/release/2.3.6/minified/require.js"></script>
<script src="node_modules/lightstreamer-client-web/lightstreamer.min.js"></script>
<script>
require(["LightstreamerClient","Subscription"],
function(LightstreamerClient,Subscription) {
var sub = new Subscription("MERGE",["item1","item2","item3"],["stock_name","last_price"]);
sub.setDataAdapter("QUOTE_ADAPTER");
sub.setRequestedSnapshot("yes");
sub.addListener({
onItemUpdate: function(obj) {
console.log(obj.getValue("stock_name") + ": " + obj.getValue("last_price"));
}
});
var client = new LightstreamerClient("http://push.lightstreamer.com","DEMO");
client.connect();
client.subscribe(sub);
});
</script>
</head>
</html>
To set a namespace prefix for the module names, configure the property ns of the special module lightstreamer.
---------- index.html ----------
<html>
<head>
<script src="https://requirejs.org/docs/release/2.3.6/minified/require.js"></script>
<script src="node_modules/lightstreamer-client-web/lightstreamer.min.js"></script>
<script>
require.config({
config : {
"lightstreamer" : {
"ns" : "Ls"
}
}
});
require(["Ls/LightstreamerClient","Ls/Subscription"],
function(LightstreamerClient,Subscription) {
var sub = new Subscription("MERGE",["item1","item2","item3"],["stock_name","last_price"]);
sub.setDataAdapter("QUOTE_ADAPTER");
sub.setRequestedSnapshot("yes");
sub.addListener({
onItemUpdate: function(obj) {
console.log(obj.getValue("stock_name") + ": " + obj.getValue("last_price"));
}
});
var client = new LightstreamerClient("http://push.lightstreamer.com","DEMO");
client.connect();
client.subscribe(sub);
});
</script>
</head>
</html>
In modern browsers, you can import the library as an ES6 module.
<html>
<head>
<script type="module">
import {Subscription,LightstreamerClient} from '../node_modules/lightstreamer-client-web/lightstreamer.esm.js';
var sub = new Subscription("MERGE",["item1","item2","item3"],["stock_name","last_price"]);
sub.setDataAdapter("QUOTE_ADAPTER");
sub.setRequestedSnapshot("yes");
sub.addListener({
onItemUpdate: function(obj) {
console.log(obj.getValue("stock_name") + ": " + obj.getValue("last_price"));
}
});
var client = new LightstreamerClient("http://push.lightstreamer.com","DEMO");
client.connect();
client.subscribe(sub);
</script>
</head>
</html>
A basic usage of Webpack bundler requires the installation of webpack and webpack-cli packages.
To create the application bundle imported by index.html, run the command webpack in the directory where webpack.config.js resides.
---------- webpack.config.js ----------
const path = require('path');
module.exports = {
mode: 'production',
entry: './main.js',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
}
};
---------- main.js ----------
import {Subscription, LightstreamerClient} from 'lightstreamer-client-web';
var sub = new Subscription("MERGE",["item1","item2","item3"],["stock_name","last_price"]);
sub.setDataAdapter("QUOTE_ADAPTER");
sub.setRequestedSnapshot("yes");
sub.addListener({
onItemUpdate: function(obj) {
console.log(obj.getValue("stock_name") + ": " + obj.getValue("last_price"));
}
});
var client = new LightstreamerClient("http://push.lightstreamer.com","DEMO");
client.connect();
client.subscribe(sub);
---------- index.html ----------
<html>
<head>
<script src="dist/bundle.js"></script>
</head>
</html>
A basic usage of Rollup.js bundler requires the installation of rollup and rollup-plugin-node-resolve packages.
To create the application bundle imported by index.html, run the command rollup -c in the directory where rollup.config.js resides.
---------- rollup.config.js ----------
import resolve from 'rollup-plugin-node-resolve';
export default {
input: './main.js',
output: {
file: 'dist/bundle.js',
format: 'iife'
},
plugins: [ resolve() ]
};
---------- main.js ----------
import {Subscription, LightstreamerClient} from 'lightstreamer-client-web';
var sub = new Subscription("MERGE",["item1","item2","item3"],["stock_name","last_price"]);
sub.setDataAdapter("QUOTE_ADAPTER");
sub.setRequestedSnapshot("yes");
sub.addListener({
onItemUpdate: function(obj) {
console.log(obj.getValue("stock_name") + ": " + obj.getValue("last_price"));
}
});
var client = new LightstreamerClient("http://push.lightstreamer.com","DEMO");
client.connect();
client.subscribe(sub);
---------- index.html ----------
<html>
<head>
<script src="dist/bundle.js"></script>
</head>
</html>
A basic usage of Browserify bundler requires the installation of browserify package.
To create the application bundle imported by index.html, run the command browserify main.js -o dist/bundle.js.
---------- main.js ----------
var Ls = require('lightstreamer-client-web');
var sub = new Ls.Subscription("MERGE",["item1","item2","item3"],["stock_name","last_price"]);
sub.setDataAdapter("QUOTE_ADAPTER");
sub.setRequestedSnapshot("yes");
sub.addListener({
onItemUpdate: function(obj) {
console.log(obj.getValue("stock_name") + ": " + obj.getValue("last_price"));
}
});
var client = new Ls.LightstreamerClient("http://push.lightstreamer.com","DEMO");
client.connect();
client.subscribe(sub);
---------- index.html ----------
<html>
<head>
<script src="dist/bundle.js"></script>
</head>
</html>
The library requires Server 7.1 and breaks the compatibility with Server version 7.0. However, if Web Push Notifications are not used, compatibility with Server version 7.0 is still ensured.
Q: The library is too big. Is there a way to make it smaller?
You can build a custom library comprising only the modules you need. Refer to the Github project for further information.
FAQs
This package includes the resources needed to write a Lightstreamer client.
We found that lightstreamer-client-web demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Socket's package search now displays weekly downloads for npm packages, helping developers quickly assess popularity and make more informed decisions.
Security News
A Stanford study reveals 9.5% of engineers contribute almost nothing, costing tech $90B annually, with remote work fueling the rise of "ghost engineers."
Research
Security News
Socket’s threat research team has detected six malicious npm packages typosquatting popular libraries to insert SSH backdoors.