Таймер JavaScript в качестве буфера - PullRequest
Новая
       12

Таймер JavaScript в качестве буфера

0 голосов
/ 01 апреля 2011

У меня есть слайдер, который отправляет свое значение на веб-сервер, используя следующую строку кода: 

window.location = "http://172.20.2.1:83/trigger/1?" + value;

Этот код находится в моей функции TestSlider (значение), которая вызывается из события onchangeиз диапазона.

Проблема, конечно, когда я перемещаю ползунок, я отправляю огромные объемы данных на веб-сервер.

Я хотел бы создать буфер, который отправляет самое последнее значение.Я создал функцию таймера, которая на данный момент мне нравится, когда она запускается один раз в секунду.Он должен принимать открытую переменную Value и просто на мгновение записать ее в журнал.

Проблема, с которой я сталкиваюсь, заключается в том, что она все еще записывает огромные объемы данных в журнал, поэтому, конечно, это приведет к сбою моего веб-сервера.

Вот мой JavaScript: 

    //Put a timer in to work as buffer. This should stop the lpc crashing. I think its 
    //as a result of to much data. 
    var c=0;
    var t;
    var timer_is_on=0;


    // Holy Smoke Hacked...liked a pro! 
    calculateHost();
    var ip = getControllerIP();
    var triggerNumber = 1;
    var Value;




    function timedCount()
    {


        //console.log("Timer Ticked: " + c + "URL : " + url); //Write tick value and url to log.
        c=c+1; //Add 1 to tick value.
        t=setInterval("timedCount()",10000); //Set the old interval. 

        console.log(c);

    }

    function doTimer()
    {

          timer_is_on=1;
          timedCount();


    }   


    function testSlider(value)
    {

        var url = (ip + "/trigger/" + triggerNumber + "?" + value);

        //Removed because its it would be better to see when the timer is executing. 
        //console.log(url);

        Value = value;


        //Removed because we need a buffer. 
        //window.location = "http://172.20.2.1:83/trigger/1?" + value;

    }

Ответы [ 3 ]

1 голос
/ 01 апреля 2011

Решение называется debouncing.

Идея состоит в том, чтобы реагировать только на последнее из серии повторяющихся событий.

Прочитать все об отмене событий здесь: http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/

Альтернативное решение - регулировать события и, таким образом, реагировать на события только через каждый заданный интервал.

Вы можете использовать следующее расширение прототипа функции для обработки событий дросселя, ищите логику отладки в приведенной выше ссылке: 

Function.prototype.throttle = function throttle(delay) {
    var func = this, timeOfLastExec = 0, execWaiting = false;

    return function throttled() {
        var context = this, args = arguments, timeSinceLastExec = new Date().getTime() - timeOfLastExec;

        function exec() {
            execWaiting && clearTimeout(execWaiting);
            execWaiting = false;
            timeOfLastExec = new Date().getTime();
            func.apply(context, args);
        }

        if (timeSinceLastExec >= delay) {
            exec();
        }
        else if (!execWaiting) {
            execWaiting = setTimeout(exec, delay - timeSinceLastExec);
        }
    };
};
0 голосов
/ 01 апреля 2011

Проблема с вашим таймером заключается в том, что вы запускаете другой таймер в обработчике для события таймера.После первого раунда у вас есть два таймера, затем четыре, восемь, 16, 32, 64, 128, 256, 512 и т. Д. Через некоторое время у вас будет больше таймеров, чем в браузере.все данные отправляются на ваш сервер (если вы это уже реализовали).

0 голосов
/ 01 апреля 2011

Я думаю, что лучший способ сделать это - использовать событие onMouseUp - оно будет отправлять данные на сервер только после отпускания ползунка, тем самым отправляя только один запрос.

...