SetInterval () and load () functions and traffic problems

2

So guys .. I know the code below is pretty unnecessary, but I just need to know one thing, actually an answer ...

The code below in my site serves to make refresh in an update icon that shows the number of notifications in case any friend user has liked or commented something like yours, like Facebook. However, I believe that every refresh is opening another port because in the site statistic it shows that it is having 1900,000 views per day which ends up increasing site by stopping the server.

So the question: this setInterval() with a load() that searches a file in refresh_notif.php for every refresh in half a second time '1000' is bad for > site ?

var auto_refresh = setInterval(
  function () {
    var urlLikes = $("#url_s").val();
    $('#4sNotificationsJewel').load(urlLikes +'/refresh_notif.php?user=<?php print $user_id; ?>').fadeIn("slow");
}, 1000);
    
asked by anonymous 18.06.2015 / 15:18

2 answers

2

You can use Server-Sent Events instead of pooling. ..

Client-side :

var evtSource = new EventSource("ssedemo.php");

//Once you've instantiated your event source, you can begin listening for messages
evtSource.onmessage = function(e) {
  var newElement = document.createElement("li");

  newElement.innerHTML = "message: " + e.data;
  eventList.appendChild(newElement);
}

//You can also listen for events, using addEventListener()
evtSource.addEventListener("ping", function(e) {
  var newElement = document.createElement("li");

  var obj = JSON.parse(e.data);
  newElement.innerHTML = "ping at " + obj.time;
  eventList.appendChild(newElement);
}, false);

Server-side :

<?php

date_default_timezone_set("America/New_York");
header("Content-Type: text/event-stream\n\n");

$counter = rand(1, 10);
while (1) {
  // Every second, sent a "ping" event.

  echo "event: ping\n";
  $curDate = date(DATE_ISO8601);
  echo 'data: {"time": "' . $curDate . '"}';
  echo "\n\n";

  // Send a simple message at random intervals.

  $counter--;

  if (!$counter) {
    echo 'data: This is a message at time ' . $curDate . "\n\n";
    $counter = rand(1, 10);
  }

  ob_flush();
  flush();
  sleep(1);
}

Browser Support :

Chrome : 9

Firefox : 6.0

Internet Explorer : Nops

Opera : 11

Safari : 5

Polyfills (Supports IE8 +)

    
18.06.2015 / 15:50
1

Obviously the longer this interval, the better to reduce server traffic. You can do something like switch to setTimeout and increase the interval whenever you look for notifications and not find anything; something like

var currentInterval = 1000;

function handleRefresh() {
    /* puxa o dado... */
    if (alguma_novidade) {
        currentInterval = 1000;
    } else {
        currentInterval = Math.min(currentInterval + 1000, 60 * 1000);
    }
    setTimeout(handleRefresh, currentInterval);
}

The maximum threshold between notification queries and the "acceleration" you increase the range depends on tradeoff between reducing server load, improving the user experience, and how the statistical distribution is between notifications that arrive on your system.

(I think I can do something with WebSockets and such to make the server push notifications to the client, but I do not know how to do this; the above solution relieves you in the meantime.)

    
18.06.2015 / 15:28