Geek asks and answers

JQuery AJAX query with LinQ filter and jQuery tmpl example

We used this script to get and filter JSON with 100,000 elements to do a quick search on the user side, but unfortunately it is not so fast.

What do you think, how can I make this script faster?

<script> 
    $(document).ready(function () {
        var data__ = new Array();
        var val__ = new Array();
        var val_sum = 0;


            $.ajax({
                url: 'hotel.php',
                type: 'POST',
                dataType: 'json',
                timeout: 5000,

                beforeSend: function () {

                }, error: function (xhr, ajaxOptions, thrownError) {
                    alert(xhr.responseText);
                    alert(thrownError);
                    return false;
                },

                success: function (data) 
                {
                    var list = JSLINQ(data)
                       .Where(function(item){ return item.regio == "Afrika"; })
                       .OrderBy(function(item) { return item.name; })
                       .Select(function(item){ return item; });

                    var movies = list['items']

                    var markup = "<tr><td colspan='2'><b>Hotel: </b> ${name}</td><td><b>Régió:</b> ${regio}</td><td><b>Orszag:</b> ${orszag}</td><td><b>Város:</b> ${varos}</td></tr>";

                    /* Compile markup string as a named template */
                    $.template( "movieTemplate", markup );

                    /* Render the named template */
                    $( "#movieList" ).empty();
                    $.tmpl( "movieTemplate", movies ).appendTo( "#movieList" );
                }
            });
            return false;
    });
</script>

Thanks for the help.

+3
source share
4 answers

I am going to suggest some general improvements (item # 1) and some specific ones (the rest of them). You can choose which one you want to go with.

  • Compile your template once, and not with every call success. Move them out of bounds success.
  • JSLinq underscoreJS. - JS , , , , .
  • , jQuery. , jQuery, ( JS, jQuery, ). .. , , .
  • , jQuery ( ), .

JS:

<script> 
        $(document).ready(function () {
            var data__ = [];
            var val__ = [];
            var val_sum = 0;
            var markup = "<% _.each(items, function(item) { %><tr><td colspan='2'><b>Hotel: </b> <%= item.name %></td><td><b>Régió:</b> <%= item.regio %></td><td><b>Orszag:</b> <%= item.orszag %></td><td><b>Város:</b> <%= item.varos %></td></tr><% }); %>";
            var compiledTemplate = _.template(markup);


                $.ajax({
                    url: 'hotel.php',
                    type: 'POST',
                    dataType: 'json',
                    timeout: 5000,

                    beforeSend: function () {

                    }, error: function (xhr, ajaxOptions, thrownError) {
                        alert(xhr.responseText);
                        alert(thrownError);
                        return false;
                    },

                    success: function (data) 
                    {
                        var list = _(data)
                                         .chain()
                                         .select(data, function(item){ return item.regio == "Afrika"; })
                                         .sortBy(function(item) { return item.name; })
                                         .value();

                        var movies = list['items']

                        /* Render the named template */
                        $( "#movieList" ).empty().append(compiledTemplate(movies));

                    }
                });
                return false;
        });
    </script>

- IE7. 10 () , , , .

+1

, , JSLinq .

, , Name='Afrika' name. JSLinq .

.

  • , ( )
  • ( )
0

, LINQ-. javascript, Profiles Google Chrome, .

, === , ==, , . , , - , javascript :

var result = [];
for (var d in data) { // or regular for (var i = 0; ... 
    if (d.regio === "Afrika") {
        result.push(d); // or result[result.length] = d;
    }
}

result.sort(function(a, b) {
    // sort a.name and b.name
});

, jQuery, , , ( ), .

( , ) .

0

You return items where the region indicates "Africa." Please note that the spelling “Afrika” can be “Africa” and you can get many items even when you get a timeout. In the database, make sure the table is correctly indexed to make where and order as fast as possible.

-1
source

More articles:


All Articles