Разбор XML или JSON с помощью Jquery

Question

У меня довольно большой XML-файл (около 42 МБ), который я анализирую с помощью jquery. Мне нужно выборочно показать определенные узлы на основе идентификатора. При этом веб-браузер перестает отвечать на запросы, а среднее время анализа превышает 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>

и вот вызов ajax в 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

В целом JSON значительно превосходит XML по производительности, поэтому, если это возможно, попробуйте переключить свой файл на JSON с XML.

Answer 2

Однако, чтобы ответить на ваш вопрос, JSON улучшит производительность, поскольку это нативный JS, и я уверен, что синтаксический анализ был оптимизирован многими браузерами.Более того, передаваемый размер будет меньше XML

. Я подвергаю сомнению подход к переносу такого большого файла на сторону клиента и его анализу там.

Если это возможно для вашей архитектуры, вы должны выполнить синтаксический анализ и отображение HTML на стороне сервера, предоставляя индикатор прогресса со стороны клиента.

Чтобы было понятно, шаги должны быть:

1. jquery вызывает сервер через AJAX для обработки XML, показывает индикатор выполнения
2. На сервере анализирует большой XML-файл на предмет необходимых данных и передает фрагменты HTML клиенту
3. Добавление фрагментов HTML к назначенному заполнителю, удаление индикатора прогресса