www.webdeveloper.com
Results 1 to 3 of 3

Thread: Callbacks? Don't want to wait for code to execute

Hybrid View

  1. #1
    Join Date
    Aug 2012
    Location
    UK
    Posts
    10

    Callbacks? Don't want to wait for code to execute

    Hello all

    I am running a regular expression replace on an array (iterating through each index in the array), and pushing matches in to a new array. The code sometimes takes a second to execute, as the array it is running against is about 800 long.

    I want to be able to run this code without having the browser lock up. I heard that there is some way to let the code execute without locking up the browser by using callback logic? I heard that this is similar to how Node is programmed.

    Please could someone let me know how I would go about this?

    My current code looks like this:

    Code:
    $("form[name=filefinder] input[name=s]").keyup( function(){
                
                    if(!s_cache[this.value]){
                    
                        var regexp = new RegExp(this.value, "gi");
                        
                        var list = files.split(/\n/g);
                        var result = [];
                        for(var i in list){
                            if(!!list[i].match(regexp)){
                                result.push(list[i].replace(regexp, "<span class=\"highlight\">"+this.value+"</span>"));
                            }
                        }
                        
                        s_cache[this.value] = result;
                        
                    }
                    
                    update_filefinder_list(s_cache[this.value]);
                
                });

  2. #2
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    as far as making it async, that's going to be somewhat complex. you have a solid object with lots of keys to iterate; there's no simple way to break the keys into groups and do them in batches, which is the typical async pattern.
    i would focus on increasing app performance first.

    if you search on every keyup(), you'll have a ton of hits for "e" and other single-letter chars as the phrase is typed.
    better to only search when there are 3 or more letters to search for:

    Code:
    if(!s_cache[this.value] && this.value.length>2 ){

    also, test() is ~250% faster than match(), and since you don't need the matches, you won't miss the different output:

    Code:
    if( regexp.test ( list[i] )   ){


    finally, if you don't need the case-insensitive search, or you can toLowerCase() everything before the search, you can make it about 20X faster (than the 2.5X faster code) using "".split(strWhat).join(strRep) instead of "".replace(rxWhat, srtRep)...

    those optimizations should remove the performance problems in real-world conditions that led you to seek a complex async answer.
    Last edited by rnd me; 02-04-2013 at 08:34 AM.

  3. #3
    Join Date
    Aug 2012
    Location
    UK
    Posts
    10
    Thanks

    Using the test method alone was good enough to make it very snappy.

    So now it looks like this:

    Code:
    for(var i in list){
                            if(!!regexp.test(list[i])){
                                result.push(list[i].replace(regexp, function($1){ return "<span class=\"highlight\">"+$1+"</span>"; }));
                            }
                        }

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles