Загрузка файла HTML5 chunk/slice вызывает высокую загрузку процессора

Question

Итак, я реализую загрузчик файлов для большого файла с HTML5. Я использую новый фрагмент/фрагмент, чтобы разрезать файл на меньший фрагмент с целью приостановки/возобновления для последующей реализации. Тем не менее, каждый раз, когда я пытаюсь загрузить (он работает), но он требует много памяти и использования ЦП (он может доходить до 100% использования процессора). Я пробую разный размер файла chunk, но никакой помощи.

Кто-нибудь знает, что не так? и как это исправить? Возможно, приложение поддерживает до 4 ГБ/файлов и, конечно же, несколько файлов. Возможно, возможно, что они могут идти до 20 ГБ и т. Д.

примечание: пожалуйста, не включайте Java или вспышку для решения. Потому что у меня уже есть версия java. Я просто пытаюсь переписать это с помощью HTML5. Ниже приведен код

 function sendRequest() {  
      var file = document.getElementById('fileToUpload'); 

      for(var i = 0; i < file.files.length; i++) {  
       var blob = file.files[i];   
       var originalFileName = blob.name; 
       var filePart = 0 

       const BYTES_PER_CHUNK = 5 * 1024 * 1024; // 10MB chunk sizes. 
       const SIZE = blob.size; 

       var start = 0; 
       var end = BYTES_PER_CHUNK; 

       totalChunks = Math.ceil(SIZE/BYTES_PER_CHUNK); 

       while(start < SIZE) {      
        if (blob.webkitSlice) { 
         //for Google Chrome 
         var chunk = blob.webkitSlice(start, end); 
        } else if (blob.mozSlice) { 
         //for Mozilla Firefox 
         var chunk = blob.mozSlice(start, end); 
         //pausecomp(5000); 
        }  

        uploadFile(chunk, originalFileName, filePart, totalChunks, i); 
        filePart++; 
        start = end; 
        end = start + BYTES_PER_CHUNK; 
       } 
      }     
     } 


     function uploadFile(blobFile, fileName, filePart, totalChunks, divBarsSelector) { 
      if(filePart == 0) { 
       bars = document.querySelector('#bars' + divBarsSelector); 
      } 

      var progress = document.createElement('progress'); 
      progress.min = 0; 
      progress.max = 100; 
      progress.value = 0; 
      bars.appendChild(progress); 

      var fd = new FormData(); 
      fd.append("fileToUpload", blobFile); 

      var xhr = new XMLHttpRequest();     
      xhr.open("POST", "upload.php"+"?"+"file="+fileName + filePart, true); 

      xhr.onload = function(e) { 
       //make sure if finish progress bar at 100% 
       progress.value = 100; 

       //counter if everything is done using stack(pop)/queue(shift)???? 
       uploaders.shift(); 

       if (!uploaders.length) { 
        bars.appendChild(document.createElement('br')); 
        bars.appendChild(document.createTextNode('DONE :)')); 
        //mergeFile(fileName, totalChunks); 
       }     
      }; 

      // Listen to the upload progress for each upload. 
      xhr.upload.onprogress = function(e) {; 
       if (e.lengthComputable) { 
        progress.value = (e.loaded/e.total) * 100; 
       } 
      };     

      uploaders.push(xhr); 
      xhr.send(fd); 
} 

Answer 1

Чтобы избежать этой проблемы необходимо загрузить файлы с помощью webworkers, с помощью webworkers мы можем уменьшить использование центрального процессора.

Вы можете протестировать разницу с и без веб-мастеров в chrome с помощью chrome taskmanager.