HTML 5 real time data table

1.3k Views Asked by At

I am looking for a solution to draw a table on a webpage reflecting some server side data, but somehow in real time (as soon as the data is received, it is displayed on the webpage). The data in the table will represent details of trades. On a daily basis, I expect there will be more than 50000 trades. Currently, there is a desktop application of this platform and I have a source code, which represents these trades on a console. The only thing that I need for now is to represent this data on a webpage rather than a console. So it sounds very simple and straightforward, but I don't have a previous experience in this area, and therefore I am stuck right now. I know signalR, server-sent events are the good points to start, but I don't really know how to apply them. I would appreciate, if someone gave me some suggestions or explained to me how to start.

3

There are 3 best solutions below

0
On

I would use a WebSocket enabled real-time message broker like Realtime Messaging (the company I work for). Your HTML5 page would use the JavaScript SDK to subscribe a data channel where your server-side/desktop app would publish the trade data.

Whenever the page receives a new message it just updates the UI using jQuery/AngularJS or any other JavaScript framework of your liking.

0
On

I have solved a similar problem using WebSockets and DataTables. A little low-tech, but works like a charm.

0
On

... and another technology solution: WAMP does fast PubSub over WebSockets. For a usage demo (including live updates to a table) see https://demo.crossbar.io/editform/index.html

Full disclosure: I work on WAMP & some of the open source projects in the ecosystem. However, it fits your requirements + is open source.