Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript run faster if console opened

i'm developing a phonegap app using a lot of javascript. Now i'm debugging it using Safari Developer Tool, in particular i'm focused on some button that on the device seems to be a bit luggy. So I've added some console.timeEnd() to better understand where the code slow down, but the "problem" is that when i open the console the code start running faster without lag, if i close it again, the lag is back.

Maybe my question is silly but i can't figure it out

Thanks

EDIT: Added the code

function scriviNumeroTastiera(tasto){
        console.time('Funzione ScriviNumeroTastiera');
        contenutoInput = document.getElementById('artInserito').value;
        if ($('#cursoreImg').css('display') == 'none'){
            //$('#cursoreImg').show();

        }
        else if (tasto == 'cancella'){

            //alert(contenutoInput.length);
            if (contenutoInput.length == 0) {

            }
            else {
                indicePerTaglioStringa = (contenutoInput.length)-1;
                contenutoInput = contenutoInput.substr(0, indicePerTaglioStringa);
                $('#artInserito').val(contenutoInput);
                //alert('tastoCanc');
                margineAttualeImg = $('#cursoreImg').css('margin-left');
                indicePerTaglioStringa = margineAttualeImg.indexOf('p');
                margineAttualeImg = margineAttualeImg.substr(0, indicePerTaglioStringa);
                margineAggiornato = parseInt(margineAttualeImg)-20;
                $('#cursoreImg').css('margin-left', margineAggiornato+'px');
            }
        }
        else {
            //contenutoInput = document.getElementById('artInserito').value;
            contenutoAggiornato = contenutoInput+tasto;
            margineAttualeImg = $('#cursoreImg').css('margin-left');
            indicePerTaglioStringa = margineAttualeImg.indexOf('p');
            margineAttualeImg = margineAttualeImg.substr(0, indicePerTaglioStringa);
            margineAggiornato = parseInt(margineAttualeImg)+20;
            $('#cursoreImg').css('margin-left', margineAggiornato+'px');
            $('#artInserito').val(contenutoAggiornato);
        }
        console.timeEnd('Funzione ScriviNumeroTastiera');
    }

The code is a bit crappy, but it's just a beginning ;)

like image 609
elledienne Avatar asked Dec 23 '13 14:12

elledienne


2 Answers

This could happen because PhoneGap/Cordova creates its own console object (in cordova.js), and it gets overwritten when you open the Safari console (safari's might be faster than phonegap's, that could be why you notice it faster).

So, one way to measure the time properly, without opening the console, would be to go to the good old alert, so you'd first add this code anywhere in your app:

var TIMER = {
    start: function(name, reset){
        if(!name) { return; }
        var time = new Date().getTime();
        if(!TIMER.stimeCounters) { TIMER.stimeCounters = {} };
        var key = "KEY" + name.toString();
        if(!reset && TIMER.stimeCounters[key]) { return; }
        TIMER.stimeCounters[key] = time;
    },
    end: function(name){
        var time = new Date().getTime();
        if(!TIMER.stimeCounters) { return; }
        var key = "KEY" + name.toString();
        var timeCounter = TIMER.stimeCounters[key];
        if(timeCounter) {
            var diff = time - timeCounter;
            var label = name + ": " + diff + "ms";
            console.info(label);
            delete TIMER.stimeCounters[key];
        }
        return diff;
    }
};

(This just mimics the console.time and console.timeEnd methods, but it returns the value so we can alert it).

Then, instead of calling:

console.time('Funzione ScriviNumeroTastiera');

you'd call:

TIMER.start('Funzione ScriviNumeroTastiera');

and instead of calling:

console.timeEnd('Funzione ScriviNumeroTastiera');

you'd call:

var timeScriviNumeroTastiera = TIMER.end('Funzione ScriviNumeroTastiera');
alert('Ellapsed time: ' + timeScriviNumeroTastiera);

This would give you the proper ellapsed time without opening the console, so it computes the real time in the phonegap app.

Hope this helps.
Cheers

like image 181
Edgar Villegas Alvarado Avatar answered Oct 29 '22 22:10

Edgar Villegas Alvarado


This really isn't something you would normally expect - opening the console should not speed up anything. If anything, it will make things slower because of additional debugging hooks and status display. However, I've had a case like that myself. The reason turned out to be very simple: opening the console makes the displayed portion of the website smaller and the code efficiency was largely dependent on the viewport size. So if I am right, making the browser window smaller should have the same effect as opening the console.

like image 28
Wladimir Palant Avatar answered Oct 29 '22 22:10

Wladimir Palant