JQuery를 사용하여 테이블에 수천 개의 행을 동적으로로드하십시오.

Question

CRM을위한 전면 GUI에서 작업하고 있습니다. 우리는 계층화 된 고객 구조를 가지고 있습니다. 각 고객은 청구 할 주소가 많고 배송지 주소가 많으며 각 계정과 관련된 많은 연락처가 있습니다. 내가 가지고있는 문제는 일부 고객이 1 만 개 이상의 ship-to가 계정과 연결되어 있다는 것입니다. 이것은 한꺼번에 모든 것을 요구할 때 문제가됩니다. 나는 백엔드 괜찮아요, 그것은 ~ 280ms (평균)의 모든 우주선 데이터를 가져옵니다. 나는 모든 정보를 테이블에로드하기 위해 자바 스크립트를 사용하고 있습니다. 여기에 내가 현재하고 있어요 무엇 :

var r = new Array(); 
var j = -1, recordID; 
r[++j] = ''; 

    //Loop through the data and build an array. 
    for (i in data) { 
     var d = data[i]; 
      recordID = d.id; 
     r[++j] = '<tr>'; 
     r[++j] = '<td>'+ d['ADDRESS_LINE_1'] +'</td>'; 
     r[++j] = '</tr>'; 
    } 
    //The line below joins the array and appends it to the table. 
    $('#table').append(r.join('')); 

내가 나를 위해 사양을 구축 사람들과 얘기했습니다, 그들은 한 번에 보여 모두 필요 , 필터링의 가능성은 없습니다. 현재 모든 데이터가로드되고 모달이 열리기 전에 ~ 4 초 가량 소요됩니다.

더 빠른 방법이 있나요?

Answer 1

$.map(yourArrayVar, function(value, key) { 
    return '<TR><TD>'+value['ADDRESS_LINE_1']+'</TD></TR>'; 
}); 
$("#table").append(yourArrayVar.join('')); 

이렇게하면 루핑보다 나은 성능을 얻을 수 있습니다. 자세한 내용은 여기를 참조하십시오. http://api.jquery.com/jquery.map/