Jquery로 XML 또는 JSON 구문 분석

Question

jquery로 구문 분석하는 매우 큰 XML 파일 (약 42MB)이 있습니다. ID를 기반으로 특정 노드를 선택적으로 표시해야합니다. 이렇게하면 웹 브라우저가 응답하지 않고 구문 분석을위한 평균 시간이 15 초를 초과합니다.

내 큰 쿼리는이 큰 XML 파일을 JSON으로 변환 할 때 성능을 향상시키는 데 도움이됩니까? 다음은 XML의 샘플입니다.

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE thesaurus SYSTEM "Thesaurus_1_4.dtd"> 
<thesaurus action="ExportLanguage" language="en" version="2.7" date="2011-08-15"> 
    <options/> 
    <wordblocks> 
    <wordblock> 
     <term type="forbidden" lang="en" termid="18297"> 
     <value>1,1-DIETHOXYETHANE</value> 
     </term> 
     <terms> 
     <term rel="USE" lang="en" termid="30" type="valid"> 
      <value>ACETAL</value> 
     </term> 
     </terms> 
    </wordblock> 
    <wordblock> 
     <term type="forbidden" lang="en" termid="18307"> 
     <value>1,2,3-PROPANETRIOL</value> 
     </term> 
     <terms> 
     <term rel="USE" lang="en" termid="4028" type="valid"> 
      <value>GLYCEROL</value> 
     </term> 
     </terms> 
    </wordblock> 
    <wordblock> 
     <term type="forbidden" lang="en" termid="18308"> 
     <value>1,2,3-TRIHYDROXYBENZENE</value> 
     </term> 
     <terms> 
     <term rel="USE" lang="en" termid="8094" type="valid"> 
      <value>PYROGALLOL</value> 
     </term> 
     </terms> 
    </wordblock> 
    <wordblock> 
     <term type="forbidden" lang="en" termid="18309"> 
     <value>1,2,4,5-TETRAMETHYLBENZENE</value> 
     </term> 
     <terms> 
     <term rel="USE" lang="en" termid="2814" type="valid"> 
      <value>DURENE</value> 
     </term> 
     </terms> 
    </wordblock> 
    <wordblock> 
     <term type="forbidden" lang="en" termid="18298"> 
     <value>1,2-DIHYDROXYANTHRAQUINONE</value> 
     </term> 
     <terms> 
     <term rel="USE" lang="en" termid="229" type="valid"> 
      <value>ALIZARIN</value> 
     </term> 
     </terms> 
    </wordblock> 
</wordblocks> 
</thesaurus> 

여기는 네이티브 JS 내가이 분석은 많은 최적화 된 확신으로, JSON의 성능을 향상시킬 것입니다하지만 귀하의 질문에 대답하려면 XML

LoadRelatedTerms = function (term) { 
    $.ajax({ 
     type: "GET", 
     url: "THESAURUS.xml", 
     dataType: "xml", 
     success: function (xml) { 
      $('.items').html(''); 
      $(xml).find('wordblock').each(function() { 
       $(this).children('term').each(function() { 
        var value = $(this).find('value').text(); 
        if (value == term) { 
         $(this).parent().children('terms').children('term[level=1]').each(function() { 
          var id = $(this).attr('id'); 
          var termValue = $(this).find('value').text(); 
          $('<div class="items" id="term' + id + '"></div>').html(termValue).appendTo('#page-wrap'); 
         }); 
         return false; 
        } 
       }); 
      }); 
     } 
    }); 

Answer 1

에 Ajax 호출이다 브라우저. 게다가, 전송 된 크기는 XML보다 작을 것입니다.

나는 큰 파일을 클라이언트쪽에 가져 와서 거기에서 파싱하는 접근 방식에 의문을 제기하고 있습니다.

아키텍처에 따라 가능한 경우 클라이언트 쪽에서 진행률 표시기를 제공하면서 서버 측에서 구문 분석 및 HTML 표시를 수행해야합니다.

명확하게하려면, 단계를해야합니다 :

1. JQuery와, XML을 처리하기 위해 AJAX를 통해 서버를 호출 서버에서 진행 표시기
2. 을 보여, 필요한 데이터에 대한 큰 XML 파일을 구문 분석하고 전체 JSON에서

Answer 2

가 signific의 성능에 XML을 뛰는 표시 진행을 할당 자리 표시 할 수있는 HTML 조각을 추가 클라이언트

에 HTML 조각을 제공 제거 개미 크기이므로 가능한 경우 파일을 XML에서 JSON으로 전환 해보십시오.