title: HTML5 record moderate video quality for upload to be playable by Safari
body: <p>I am creating a web-based mobile app where it should be possible to upload video-recordings.
  There are two ways to achieve this:</p>
  
  <p><strong>Use input:</strong></p>
  
  <pre><code>&lt;input type="file" name="video" accept="video/*" capture&gt;&lt;/input&gt;
  </code></pre>
  
  <p><strong>Use RTC MediaRecorder:</strong>  </p>
  
  <pre><code>var recordedBlobs = [];
  function handleDataAvailable(event) {
      if (event.data &amp;&amp; event.data.size &gt; 0) {
          recordedBlobs.push(event.data);
      }
  }
  
  var options = {
      mimeType: 'video/webm',
      audioBitsPerSecond : 128000,
      videoBitsPerSecond : 2500000
  }
  
  mediaRecorder = new MediaRecorder(window.stream, options);
  mediaRecorder.ondataavailable = handleDataAvailable;
  mediaRecorder.start(10);
  </code></pre>
  
  <p>While the first option always works the main problem is that it uses the build-in mobile camera application leaving us no control over quality, which again leads to potentially very large files (especially on android)</p>
  
  <p>Second version gives us full control over quality and lets os create moderate file sizes that are size-wise acceptable as content in the application. iOS/Safari does not support this feature yet, but this is ok since iPhones record small files by default when started from the browser. So I can activate option 1 when the user-agent is iOS.</p>
  
  <p>Now the problems:</p>
  
  <p>First option would be fine if I could:</p>
  
  <ol>
  <li>Control the video recording quality of the mobile application</li>
  <li>Post-elaborate the recording to change the resolution before upload</li>
  </ol>
  
  <p>The problem with option 2 is that only the .webm container type is supported, and Safari does not support this type.</p>
  
  <p>So I'm a little stuck - right now it seems like my only option is to post-convert the incoming .webm files to .mp4 on the server as they are uploaded. But it seems to be a very CPU costly process on the server.</p>
  
  <p>Any good ideas?</p>