Блог

У меня проблема с высокой загрузкой процессора на веб-сайте, где я хочу заменить некоторый текст ссылками.

Скрипт загружается в конце текста.

Это работает нормально, когда на странице нет видео. Но если есть встроенные видео, подобные этому, загрузка процессора превышает 50%. Если я использую это для нескольких файлов, Firefox вылетает.

 <p><video width="320" height="240" class="mediaelement" autoplay="autoplay" src="video.mp4" controls="controls"><a href="video.mp4">resources/video.mp4</a></video></p>
  

Я понял, что проблема в этом, особенно в чтении из csv. Если я просто заменю текст фиксированными данными, это тоже сработает.

     var rawFile = new XMLHttpRequest();
    rawFile.open("GET", "data.csv", false);
    rawFile.overrideMimeType('text/xml; charset=iso-8859-1');
    rawFile.onreadystatechange = function ()
    {
    if(rawFile.readyState === 4)
    {
      if(rawFile.status === 200 || rawFile.status == 0)
      {
          var allText = rawFile.responseText;
          allText = allText.split("n"); 
          var sizedata = Object.size(allText); //Number of  entries
          var sizedata =  sizedata -1; //Excel  1 
          //alert("Debug: "   sizedata);

          var i = 0;
          while (i < sizedata)
              {
                  var word = allText[i].split(";");
                  var wordToDefine = word[0];
                  var wordDefinition = word[1];
                  var wordToReplace = wordToDefine

                  var replaceItem = new RegExp(wordToReplace,"g");

                  document.body.innerHTML = document.body.innerHTML.replace(replaceItem, " <a href='data.html' target='_self'><span style='color:green' title='WORD'>WORD</span></a>");  
                  i = i 1;
              }
      }
    }              
    }
    rawFile.send(null);
  

Есть идеи, что я могу с этим сделать?
Заранее благодарю вас.

Как уже упоминал @criz, построение DOM в цикле — очень плохая практика. Гораздо лучше создать DocumentFragment и прикрепить его к DOM. Взгляните на https://developer.mozilla.org/en-US/docs/Web/API/Document/createDocumentFragment Вот пример.