2

I have a simple web app which lists a private group of people and the last message they posted.

I'm currently just polling by using Ajax to hit a php script every 30 seconds, which gets all people and latest messages then returns as JSON. I parse that and update the DOM.

Not very efficient since most of the time, nothing has changed but it still gets all data each 30 seconds.

  1. Is there anything basic I can do, just with the code to improve this?

  2. Should I use something like pusher.com?

There are a lot of tutorials out there on implementing long polling but I'd like to keep this simple as possible.

3
  • When polled, instead of returning the same data over and over every 30 seconds if nothing's changed, could you not have a special return code which tells the Javascript to not make any changeds to the web page? Commented Nov 5, 2012 at 2:13
  • @phillid has the right idea. Even better would be to just leverage the http protocol's + web browsers excellent support for caching and conditional http requests. Commented Nov 5, 2012 at 2:28
  • @rambo coder, thanks I like the sound of that. Can you point me in the direction of an example or more info? Commented Nov 5, 2012 at 2:35

3 Answers 3

2

when you use request http every 30 second it's possible many resource will be use, if there are 1000 users and more i think it's not good for web server,

i have suggestion using Nodejs , node js is javascript server a platform built on Chrome's JavaScript runtime for easily building fast,and support longpolling ,and non block request.

with nodejs you can build your webserver that can be handle many users and for realtime application.

there are many framework can be implement with node js

  1. socket.io
  2. express

and this is simple tutorial if you want to try that.. http://martinsikora.com/nodejs-and-websocket-simple-chat-tutorial

Sign up to request clarification or add additional context in comments.

Comments

0

Without having to change much of the infrastructure, you can return a simple message indicating whether anything has been changed or not.

So, if http://localhost/example/request is returning:

{
    "phoneNumbers": [
        {
            "type": "home",
            "number": "212 555-1234"
        },
        {
            "type": "fax",
            "number": "646 555-4567"
        }
    ]
}

on each request, you can instead return the following if nothing has been updated:

{
    "updated": false
}

Additionally, you can also have updated: true indicating it's been updated:

{
    "updated": true,
    "phoneNumbers": [
        {
            "type": "work",
            "number": "111-222-3333"
        }
    ]
}

Overall, all you will have to do is check for the updated property of the returned object on each query. You only need to parse the response if updated is true

In the grand scheme of things though, the overhead caused by each HTTP request. Every time you poll, a new request is made to the browser. Having a lot of concurrent users will start introducing performance issues. I would suggest looking at real-time web frameworks such as Node.js (as viyancs mentioned) as they maintain a persistent connection for each user to allow "pushing" data (rather than polling) hence reducing the HTTP overhead.

2 Comments

Thanks, So basically on each poll, it will update a 'last_polled' datetime field on the current logged-in user record, then if if stuff has changed since that time, it will be updated:true. So it's an extra MySQL query but will reduce the bandwidth. Am I following correctly?
Yes, that's the idea. This way, you will be saving bandwidth by sending over the JSON only when it is updated and not every single time.
0

In such a case, a better solution would be to use XHR Long Polling. It works somewhat similar to what you're doing right now, i.e. by making AJAX requests.

Here's how it works:

You make the AJAX request as you right are now.
The server side script only returns (echoes) when there is an update. If there isn't one, it keeps looping and waits for an update. This keeps the AJAX request pending.
When there is an update, your server side script returns, your client side JS updates the DOM, and immediately issues a new AJAX request.

PS - For this to work, you'll have to make sure the script isn't set to timeout after 30sec.

In psuedo-code, this is what your server side script will look like

$newInfo = false;

while ($newInfo === False) {
    $newInfo = getNewInfo(); // a method that returns the new info. False if nothing has changed
    // sleep here for a bit
    usleep(500000);
}

// will only reach here when something has changed
echo json_encode($newInfo);

2 Comments

Will this be ok if there are a lot of users active on the site at once (i.e. potentially 400+ with the page open). Won't it max out the number of apache connections or something? (hosted on apache on mac os server)
This is probably not the most scalable option. Google used to use this initially for GChat within the browser, however I imagine they used a large cluster of powerful servers behind a load balancer.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.