Polling request for updating Backbone Models/Views

I need to find a way to update a web App implemented with backbone.

The use case will be the following:
I have several Views, and each View, or maybe model/collection related to this view, needs to make different polling request to the server at different time for discovering some change.

I am wondering what is the most general way to:

1) implement the Traditional Polling Request
2) implement the Long Polling Request
3) implement the HTML5 web socket

P.S.:
1) The server is written in PHP.
2) For now I am looking for a solution without using HTML5 WebSockets because maybe with PHP is not so simple.

Here’s my simple code (1) using Traditional Polling Request.

(1)

// MyModel
var MyModel = Backbone.View.extend({
    urlRoot: 'backendUrl'
});

// MyView
var MyView = Backbone.View.extend({

    initialize: function () {
        this.model = new MyModel();
        this.model.fetch();
        this.model.on('change', this.render);
        setTimeout(function () {
            this.model.fetch();
        }, 1000 * 60 * 2); // in order to update the view each two minutes
    }
});

Backbone collection not updating with JSONP request

I just recently started using Backbone.js and I’m working on an app now using Brunch that does a JSONP request to an external API to populate my collection and models. I’m following these previous pos

Kill a polling HTTP request

I have a Runnable running inside a ThreadPoolExecutor long polling on an http request using the HttpClient . So I am doing the request in a very way : httpClient = new HttpClient(new MultiThreadedHtt

How to prevent useless ajax request when polling collections in backbone.js?

I’ve search internet for days to find an optimized solution for having a live collection in backbone.js. think of a virtual room (e.g chat room) and I wanted to show who is in that room. right now I f

Long polling (pending request) for JSF

I need to implement long polling or pending request for a chatroom. I tried a4j:push, but it seems doesn’t work like a real long polling approach (see the following discussion: https://community.jboss

jquery php long polling request issue

I’m making a chat which is based on long polling (something like this )with PHP and jQuery. once whole page is downloaded in browser, a function makes a long polling request to the back-end with some

Recall Long Polling AJAX Request When it Fails/Network offline

I am implementing a successful long polling within PHP/Node.js application. I have created a routine to launch the long polling AJAX request after the waking up of the computer (after sleep mode) as b

Polling a Collection with Backbone.js

I’m trying to keep a Backbone.js Collection up-to-date with what’s happening on the server. My code is similar to the following: var Comment = Backbone.Model.extend({}); var CommentCollection = Backbo

How do I stop a jQuery long-polling request?

I’m using… $.getJSON(url + &callback=?, function (b) { ……. }); for a long-polling request. Sometimes it is necessary that I stop the current request being made. Is this possible?

add request header on backbone

My server has a manual authorization. I need to put the username/password of my server to my backbone request inorder for it to go through. How may i do this? Any ideas? Thank you

Advantage of COMET over long request polling?

I’ve been wondering if there is a real advantage to using COMET / push-technologies over the much simpler polling with long requests where the server will wait a certain maximum time for new events to

Answers

I’m not sure what you are asking here, but here’s some thoughts:

1) Your code seems to contradict what you’ve written in the title. Using setTimeout (or setInterval) for continuous polling is something different then long polling. Actually it is a (normal) polling. The difference is that with long polling client starts an AJAX request and he waits. The server decides when to respond. And it should respond only when new data is available. And immediatly after the respond client starts a new polling request.

Side note: creating (relatively) efficient long polling server is not an easy task, be aware of that.

2) How you handle client side (i.e. where you put long polling logic) doesn’t really matter as long as you know what’s going on inside your code. Of course keep in mind that maybe in a future you would like to make some changes to the code, so keeping it separate would probably be a best choice. Here’s the architecture that I would choose:

  • Independent script which creates global EventManager object (this script should load as the first one). Such object will have the following methods: .bind and .trigger and it will, erm… manage events. 🙂 Here’s for example how the implementation may look like:

Implementing events in my own object

  • Independent script which handles long polling. Whenever the data is received from the server (i.e. the AJAX long polling request finally ends) it calls EventManager.trigger(‘long_polling_data’, res);. Then you need to bind to this event inside your backbone view or wherever you like.

Side note: additional bonus with this architecture is that if you decide to switch to WebSockets or any other technique (for example: JSONP polling) then you will only have to implement the logic for the other technique. The main code will only use long_polling_data event, so no additional changes will be required (you may want to change the name of the event :] ).

3) Although you say that you don’t want to use WebSockets I have to comment on this. 🙂 You know that world is constantly evolving. You should forget about long polling techniquesl. Using WebSockets and XMLSocket (a.k.a. FlashSocket) as a fallback is much more efficient and it is a lot simplier to implement the server side.

I hope I helped a bit, sorry for any language mistakes and good luck with your project!

Implement it in your Model the polling handler, check this example:

// MyModel
var MyModel = Backbone.Model.extend({
  urlRoot: 'backendUrl',

  //Add this to your model:
  longPolling : false,
  intervalMinutes : 2,
  initialize : function(){
    _.bindAll(this);
  },
  startLongPolling : function(intervalMinutes){
    this.longPolling = true;
    if( intervalMinutes ){
      this.intervalMinutes = intervalMinutes;
    }
    this.executeLongPolling();
  },
  stopLongPolling : function(){
    this.longPolling = false;
  },
  executeLongPolling : function(){
    this.fetch({success : this.onFetch});
  },
  onFetch : function () {
    if( this.longPolling ){
      setTimeout(this.executeLongPolling, 1000 * 60 * this.intervalMinutes); // in order to update the view each N minutes
    }
  }
});

// MyView
var MyView = Backbone.View.extend({

    initialize: function () {
        this.model = new MyModel();
        this.model.startLongPolling();
        this.model.on('change', this.render);
    }
});

I know you state in your question that you are not looking to use websockets with php (due to it being not so simple), however, I have found it to be relatively straightforward.

  1. I used http://pusher.com/ which is a web sockets app with fallbacks. (I am not connected with the company by the way).
  2. include https://github.com/squeeks/Pusher-PHP on the server/api
  3. include <script src=”http://js.pusherapp.com/1.12/pusher.min.js”></script> on the client side.

The client and server channel can be set up to speak with each other using web sockets.