Make worker syncing in babel-transpiler not eager.

Fixes codesandbox#1011

Author: Ives van Hoorne

packages/app/src/sandbox/eval/transpilers/babel/worker/babel-worker.js

@@ -19,9 +19,11 @@ import {
 } from './get-prefixed-name';
 
 let fsInitialized = false;
+let fsLoading = false;
 let lastConfig = null;
 
 async function initializeBrowserFS() {
+  fsLoading = true;
   return new Promise(resolve => {
     BrowserFS.configure(
       {
@@ -36,6 +38,7 @@ async function initializeBrowserFS() {
           console.error(e);
           return;
         }
+        fsLoading = false;
         fsInitialized = true;
         resolve();
         // BrowserFS is initialized and ready-to-use!
@@ -46,6 +49,12 @@ async function initializeBrowserFS() {
 
 async function waitForFs() {
   if (!fsInitialized) {
+    if (!fsLoading) {
+      // We only load the fs when it's needed. The FS is expensive, as we sync all
+      // files of the main thread to the worker. We only want to do this if it's really
+      // needed.
+      await initializeBrowserFS();
+    }
     while (!fsInitialized) {
       await delay(50); // eslint-disable-line
     }
@@ -192,11 +201,6 @@ self.addEventListener('message', async event => {
     return;
   }
 
-  if (event.data.type === 'initialize-fs') {
-    initializeBrowserFS();
-    return;
-  }
-
   if (event.data.type === 'get-babel-context') {
     const transpilerOptions = event.data.babelTranspilerOptions;
     loadCustomTranspiler(