2014-04-14 2 views
1

본질적으로 검색 막대 인 응용 프로그램을 개발 중입니다. 원본은 약 300,000 개의 레코드가있는 SQL 테이블입니다.많은 레코드가있는 검색 자동 완성 성능

이상적으로이 검색 창에 일종의 자동 완성 기능을 추가하고 싶습니다. 나는 jquery 자동 완성과 같은 몇 가지를 조사 해왔다.

그러나 이러한 모든 레코드를 자동 완성 소스로로드하는 것은 불가능합니다. 성능은 심오합니다.

내 질문은 수천 및 수천 개의 레코드가 들어있는 소스에 대한 검색 자동 완성 기능을 구현하는 효율적인 방법은 무엇입니까?

나는 이런 식으로 생각했습니다. 필자는 결과 목록을 얻기 위해 무언가를 입력 할 때마다 데이터베이스에 쿼리하고 있습니다. 그러나 아약스를 통해 데이터베이스를 쿼리하는 것이 최적의 것으로 보이지는 않습니다.

$("#search").keyup(function(event) { 

     $.ajax({ 
     //query the database when the user begins typing, get first 1000 records 
     //set the source of the autocomplete control to the returned result set 
     }); 
}); 

답변

1

나는 성능이 불충분하고 쿼리가 자주 반복하면, 당신이보고 할 수 있습니다 아닌 경우 그 다음 첫 번째 단계가 될 것입니다 경우, 테이블에 인덱스를 추가 한 가정입니다. http://memcached.org/ 또는 일부 다른 캐싱 메커니즘

일부 키를 요청하면 해당 키를 반환하고 캐시에 추가하면 같은 키 데이터에 대한 후속 요청이 데이터베이스에 도달하는 대신 캐시에서 읽혀집니다. 그러면 부하가 줄어들고 속도가 빨라집니다.

1

이벤트를 직접 바인딩하지 마십시오. jQuery Autocomplete는 이미 바인딩을 수행합니다.

source: function (request, response) { 
    $.ajax({ 
     url: 'yourQueryUrl.php', // <- this script/URL should limit the number of records returned 
     async: true, 
     cache: false, 
     type: 'GET', 
     data: {q: $('#searchBox').val()}, 
     dataType: 'json', 
     success: function (data) { 
      response(data); 
     } 
    }); 
} 
2

당신은 (심지어 3-4 년), 최초의 keyup에 DB를 쿼리 시작하지 말아야의 keyup :

이를 구현하는 가장 적절한 방법은 AJAX를 콜백에 source: 객체를 설정하는 것입니다 . 예를 들어, 사용자가 알바트 로스를 입력하고 있습니다. 그가 'A'를 누르면 쿼리 검색을하면 즉시 300,000 개의 결과가 전송되므로 모든 데이터 세트에는 문자 "A"가 있어야합니다.

그래서 처음 몇 자 (3 ~ 5 자)를 무시해야합니다. 검색 키워드를 저장할 수 있다면 더 좋습니다. 1 ~ 3 회 키 업시 상위 검색 키워드를 표시 할 때 상위 결과를 캐시하십시오. 큰 완성 된 DB에서 검색을 수행하는 데 자동 완성 기능이 적합하지 않을 수 있습니다.

마지막 팁 문제는 사용자가 매일 Google 및 Facebook을 사용합니다. 위의 응용 프로그램에서 각 검색에 대해 300,000 개 이상의 결과가 나타납니다. 구글이나 페이스 북에 한번에 1000 개의 결과가 표시되지 않습니다. UI 디자인이나 서버 대역폭에는 좋지 않습니다. 생각해 보면 데이터를 사용자에게 어떻게 분류하고 표시하여 원하는대로 얻을 수 있으며 서버 대역폭과 처리 비용을 최적으로 유지할 수 있습니다.

항상 컨텍스트를 기억하십시오.

1
source: function (request, response) { 
    $.ajax({ 
     url: 'yourQueryUrl.php', // <- this script/URL should limit the number of records returned 
     async: true, 
     cache: false, 
     type: 'GET', 
     data: {q: $('#searchBox').val()}, 
     dataType: 'json', 
     success: function (data) { 
      response(data); 
     } 
    });