Home/ Questions/Q 7509073
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-29T22:47:58+00:00

We’ve just started using Backbone and I’m trying to get a handle on a

  • 0

We’ve just started using Backbone and I’m trying to get a handle on a nice way to structure my application.

So we have a web application that’s essentially a trading platform. In ASCII art, the interface (and data), looks like this:

Market name

------------------------------------
Contract 1 | 12 / $100 | 15 / $150 |
------------------------------------
Contract 2 | 40 / $400 | 42 / $650 |
------------------------------------
Contract 3 | 46 / $620 | 47 / $700 |
------------------------------------

Where each contract is a child of a market, and the two cells next to each contract are the current BUY and SELL price and “quantity” (amount of money available). There may be more than 1 Market per page, and it might be in a different template (i.e a list view with only a single “favourite” quote instead of the entire list of contracts etc.)

We aren’t using Routing as this stuff is read-only on the frontend and initial payload is via HTML, the rest comes in on WebSockets.

The interface is highly variable, for instance: the two cells there (BUY / SELL) can be arbitrary depth, i.e show 3 ticks on each side. Or might only show one side (the available BUY quotes).

What I’ve currently got is a Backbone Model for Market, Contract, and Quote. Then I have a MarketContracts collection for the list of contracts, and a MarketDepthQuoteCollection for the BUY/SELL lists (collapsed as a single list).

The market > contract > quote hierarchy is strongly tied to the way the data is represented in the API, so that’s non-negotiable.

Updates to the interface land as WebSockets messages containing a JSON structure like:

{marketid: [{contractid: [[buy quotes], [sell quotes]]}],...}

as this is the most compact way to represent the data over the write without using a binary format.

Is there a better way to structure this and tie up all my listeners nicely? Ideally I want the Contracts and Quotes listening for Market model changes to update themselves, and I need to easily hand off state changes from Websockets to each quote in the table.

I’m also confused about where Views fit into this to make my life easier.

Are there any good example apps or advice? I’ve been struggling to find information.

Edit: here’s a screengrab of the interface I’m talking about. It shows one whole market and part of a second market:

Market interface with quotes

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    So, you have a collection of Markets; each with a collection of Contracts; each with a collection (or two) of Quotes. This seems pretty logical. You could look into using Backbone-relational.

    I would suggest using pretty granular views. Since a Market contains a collection of Contracts, your MarketView will create/display a collection of ContractViews. And each ContractView will create/display a collection of QuoteViews.

    This way, when a QuoteModel changes, only the QuoteView listening for its change events will need to be updated.

    Now, how you get your data into your models might require some adapter to parse it, since your data comes periodically via a websocket (and all in a big chunk). Normally, you would call the fetch template method for some model or collection only when you want new data. But, as long as you get the new data into the model attributes via set() or reset(), the views listening will update.

    Here are some good links:

    http://aaronhardy.com/javascript/javascript-architecture-backbone-js-views/
    https://github.com/addyosmani/backbone-fundamentals

    • 0