Question

现在我们正在开发混合应用程序，此处数据正在从服务器端访问，并且给定的数据是JSON格式。从服务器加载数据需要10秒以上。

以下是示例代码：

$(document).ready(function(){
    $("#cardetails").tap(function(event,ui){   

      $.ajax({       
          url:'http://wwwsampleurl.net/json/jsn_cmp.php?json=1&rcg_mobile=2&lan=en&callback=ajax_eup&pick_up_loc=AGPT01&drop_off_loc=AGPT01&country_des=ES&country_user=AE&currency=EUR&day_drop=Tue&day_pick=Tue&age_driver=30&uid=0&num_days=7&pick_up=2722&drop_off=2722&pick_up_day=13&pick_up_hour=10&pick_up_minute=00&pick_up_mon=08&pick_up_year=2013&drop_off_day=20&drop_off_hour=10&drop_off_minute=00&drop_off_mon=08&drop_off_year=2013',
          data:'',
          contentType: "application/json; charset=utf-8",
          type: "POST",
          dataType: "json",
          crossDomain:true,
          cache: false,
          async:false,
          success: function(data, textStatus, jqXHR){
              $.each(data, function(index, val) {
                  if(index=='gen'){
                      alert("gen data - "+val.pick_up_day);
                  }
                  else if(index=='company_date'){//alert('Load cars')
                      for (var i = 0, len = val.length; i < len; i++) {

                          //alert(JSON.stringify(val[i]));   
                          //    alert(val[i].car_img);
                          $('#carImages').append('<img src="'+val[i].car_img+'" width="70" height="110" alt="'+val[i].car_group+'" title="'+val[i].type+'"/>');
                       }
                   }

               });

           },
           error: function(XMLHttpRequest, textStatus, errorThrown){alert(textStatus +"-"+ errorThrown);}

        });       
    });

});

我们如何改善表现？

Answer 1

如前所述，你应该建立一个内部变量并在循环后将它添加到DOM中。

也许你可以在服务器端优化一下，if（index =='gen'）有点贵。很难说看到来自服务器的数据。

Answer 2

永远不要使用Jquery的$ .each，如果迭代的数据量更多，它将导致性能问题。

使用Native JS

提高JSON格式的数据检索性能

2 个答案: