title: Converting Uint8Array crashing browser for large files
body: <p>Have an app where there is an input of type "file".  The following methods grab the file, then prep it to be sent to the server via AJAX.</p>
  
  <pre><code>private StartUpload = (files) =&gt; {
      if (files &amp;&amp; files.length === 1) {
          this.GetFileProperties(files[0])
              .done((properties: IFileProperties) =&gt; {
                  $('input[type=file]').val("");
                  if (this._compatibleTypes.indexOf(properties.Extension) &gt;= 0) {
                      var base64 = this.ArrayBufferToBase64(properties.ArrayBuffer);
  
                      this.DoFileUpload(base64, properties.Extension).always(() =&gt; {
                          this.ShowDialogMessage('edit_document_upload_complete', 'edit_document_upload_complete');
                      });
                  } else {
                      this.ShowDialogMessage('edit_document_upload_incompatible', 'edit_document_upload_compatible_types', this._compatibleTypes);
                  }
              });
      } else {
          this.ShowDialogMessage('edit_document_upload_one_file', 'edit_document_upload_one_file_msg');
      }
  };
  
  private ArrayBufferToBase64(buffer): any {
      var binary = '';
      var bytes = new Uint8Array(buffer);
      for (var xx = 0, len = bytes.byteLength; xx &lt; len; xx++) {
          binary += String.fromCharCode(bytes[xx]);
      }
      return window.btoa(binary);
  }
  
  private DoFileUpload = (base64, extension) =&gt; {
      this.IsLoading(true);
      var dfd = $.Deferred();
  
      var data = {
          data: base64
      };
  
      UpdateFormDigest((&lt;any&gt;window)._spPageContextInfo.webServerRelativeUrl, (&lt;any&gt;window)._spFormDigestRefreshInterval);
  
      var methodUrl = "_vti_bin/viewfile/FileInformation.asmx/AddScannedItemAlt";
  
      $.ajax({
          headers: {
              "X-RequestDigest": $("#__REQUESTDIGEST").val()
          },
          url: methodUrl,
          contentType: "application/json",
          data: JSON.stringify(data),
          dataType: 'json',
          type: "POST",
          success: (response) =&gt; {
              // do stuff
          },
          error: (e) =&gt; {
              // do stuff
          }
      });
  
      return dfd;
  };
  </code></pre>
  
  <p>This works perfectly in the vast majority of cases.  However, when the file size is large (say 200MB+) it kills the browser.  </p>
  
  <ul>
  <li><p>Chrome shows a blackish-grey page with the "aw snap" message and basically dies.</p></li>
  <li><p>IE shows an "Out of Memory" console error but continues to work.  </p></li>
  <li><p>FF shows an "Unresponsive script" warning. Choosing "don't show me again" lets it run until an "out of memory" console error shows up.</p></li>
  </ul>
  
  <p>This is where it dies:</p>
  
  <pre><code>for (var xx = 0, len = bytes.byteLength; xx &lt; len; xx++) {
      binary += String.fromCharCode(bytes[xx]);
  }
  </code></pre>
  
  <p>Wrapping a try/catch around this does nothing and no error is caught.</p>
  
  <p>I can step into the loop without a crash, but stepping through every iteration is tough since len = 210164805. For this I tried to add console.log(xx) to the loop and let it fly - but the browser crashes before anything shows up in the log.</p>
  
  <p>Is there some limit to the size a string can be that could be causing the browser to crash once exceeded?</p>
  
  <p>Thanks</p>