Implement improvements from codesandbox#1599 (codesandbox#2173)

Author: CompuIves

packages/app/src/sandbox/eval/npm/fetch-npm-module.ts

@@ -31,6 +31,31 @@ export let combinedMetas: Meta = {};
 const normalizedMetas: { [key: string]: Meta } = {};
 const packages: Packages = {};
 
+async function fetchWithRetries(url: string, retries = 3): Promise<string> {
+  const doFetch = () =>
+    window.fetch(url).then(x => {
+      if (x.ok) {
+        return x.text();
+      }
+
+      throw new Error(`Could not fetch ${url}`);
+    });
+
+  for (let i = 0; i < retries; i++) {
+    try {
+      // eslint-disable-next-line
+      return await doFetch();
+    } catch (e) {
+      console.error(e);
+      if (i === retries - 1) {
+        throw e;
+      }
+    }
+  }
+
+  throw new Error('Could not fetch');
+}
+
 export function setCombinedMetas(givenCombinedMetas: Meta) {
   combinedMetas = givenCombinedMetas;
 }
@@ -77,8 +102,8 @@ function getUnpkgUrl(name: string, version: string, forceJsDelivr?: boolean) {
   const nameWithoutAlias = name.replace(ALIAS_REGEX, '');
 
   return TEMP_USE_JSDELIVR || forceJsDelivr
-    ? `https://unpkg.com/${nameWithoutAlias}@${version}`
-    : `https://cdn.jsdelivr.net/npm/${nameWithoutAlias}@${version}`;
+    ? `https://cdn.jsdelivr.net/npm/${nameWithoutAlias}@${version}`
+    : `https://unpkg.com/${nameWithoutAlias}@${version}`;
 }
 
 function getMeta(name: string, packageJSONPath: string, version: string) {
@@ -122,27 +147,13 @@ function downloadDependency(
     ? `https://cdn.jsdelivr.net/gh/${depVersion}${relativePath}`
     : `${getUnpkgUrl(depName, depVersion)}${relativePath}`;
 
-  packages[path] = window
-    .fetch(url)
-    .then(x => {
-      if (x.ok) {
-        return x.text();
-      }
-
-      throw new Error(`Could not find module ${path}`);
-    })
+  packages[path] = fetchWithRetries(url)
     .catch(err => {
       if (!isGitHub) {
         // Fallback to jsdelivr
-        return fetch(
+        return fetchWithRetries(
           `${getUnpkgUrl(depName, depVersion, true)}${relativePath}`
-        ).then(x2 => {
-          if (x2.ok) {
-            return x2.text();
-          }
-
-          throw new Error(`Could not find module ${path}`);
-        });
+        );
       }
 
       throw err;

packages/app/src/sandbox/eval/transpiled-module.ts

@@ -12,10 +12,7 @@ import { SourceMap } from './transpilers/utils/get-source-map';
 import ModuleError from './errors/module-error';
 import ModuleWarning from './errors/module-warning';
 
-import {
-  WarningStructure,
-  buildWorkerWarning,
-} from './transpilers/utils/worker-warning-handler';
+import { WarningStructure } from './transpilers/utils/worker-warning-handler';
 
 import resolveDependency from './loaders/dependency-resolver';
 import evaluate from './loaders/eval';
@@ -618,7 +615,6 @@ export default class TranspiledModule {
     } else {
       const transpilers = manager.preset.getLoaders(this.module, this.query);
 
-      const t = Date.now();
       for (let i = 0; i < transpilers.length; i += 1) {
         const transpilerConfig = transpilers[i];
         const loaderContext = this.getLoaderContext(
@@ -632,10 +628,12 @@ export default class TranspiledModule {
           .join('!');
 
         try {
+          const startTime = Date.now();
           const {
             transpiledCode,
             sourceMap,
           } = await transpilerConfig.transpiler.transpile(code, loaderContext); // eslint-disable-line no-await-in-loop
+          debug(`Transpiled '${this.getId()}' in ${Date.now() - startTime}ms`);
 
           if (this.errors.length) {
             throw this.errors[0];
@@ -655,7 +653,6 @@ export default class TranspiledModule {
 
           throw e;
         }
-        debug(`Transpiled '${this.getId()}' in ${Date.now() - t}ms`);
       }
 
       this.logWarnings();