Added some more features to benchmarking App (#274)

* Added support for other cores
* Configured wasmboy with some peromance options (to at least somewhat compete with other cores)
* Show output as each core finished running
* Fixed some bugs
* Enabled sourcemaps for cores

# Example

![othercoresbenchmark](https://user-images.githubusercontent.com/1448289/53397107-18a84980-395b-11e9-97a9-20bf496a6f04.gif)

Author: torch2424

demo/benchmark/benchmarkResults.js

@@ -47,20 +47,19 @@ export default class BenchmarkRunner extends Component {
     return responses;
   }
 
-  generateTable(WasmBoyCoreObjects) {
-    if (!WasmBoyCoreObjects || WasmBoyCoreObjects <= 0) {
+  generateTable(coreObjects) {
+    if (!coreObjects || coreObjects.length <= 0) {
       return <table />;
     }
 
-    const shouldReturnEmptyTable = WasmBoyCoreObjects.some(wasmboyCoreObject => {
-      if (!wasmboyCoreObject.resultTimes || wasmboyCoreObject.resultTimes.length <= 0) {
-        return true;
+    const WasmBoyCoreObjects = [];
+    coreObjects.forEach(coreObject => {
+      if (coreObject.resultTimes && coreObject.resultTimes.length > 0) {
+        WasmBoyCoreObjects.push(coreObject);
       }
-
-      return false;
     });
 
-    if (shouldReturnEmptyTable) {
+    if (WasmBoyCoreObjects.length === 0) {
       return <table />;
     }
 
@@ -81,6 +80,30 @@ export default class BenchmarkRunner extends Component {
               return <td>{coreObject.resultTimes.length}</td>;
             })}
           </tr>
+          <tr>
+            <td>Fastest Frame Time</td>
+            {this.getInfoFromCoreObjects(WasmBoyCoreObjects, coreObject => {
+              const sortedTimes = [...coreObject.resultTimes];
+              sortedTimes.sort((a, b) => {
+                if (a < b) return -1;
+                if (a > b) return 1;
+                return;
+              });
+              return <td>{sortedTimes[0]}</td>;
+            })}
+          </tr>
+          <tr>
+            <td>Slowest Frame Time</td>
+            {this.getInfoFromCoreObjects(WasmBoyCoreObjects, coreObject => {
+              const sortedTimes = [...coreObject.resultTimes];
+              sortedTimes.sort((a, b) => {
+                if (a < b) return -1;
+                if (a > b) return 1;
+                return;
+              });
+              return <td>{sortedTimes[sortedTimes.length - 1]}</td>;
+            })}
+          </tr>
           <tr>
             <td>Sum</td>
             {this.getInfoFromCoreObjects(WasmBoyCoreObjects, coreObject => {

demo/benchmark/benchmarkRunner.js

@@ -116,6 +116,19 @@ export default class BenchmarkRunner extends Component {
           times = times.slice(times.length * 0.15);
           coreObject.resultTimes = coreObject.resultTimes.concat(times);
         });
+
+        this.props.running(false);
+
+        // Wait a little bit, and start running again
+        const timeoutPromise = new Promise(resolve => {
+          setTimeout(() => {
+            resolve();
+          }, 10);
+        });
+
+        await timeoutPromise;
+
+        this.props.running(true);
       }
 
       this.benchmarkComplete();

demo/benchmark/binjgb/0.1.3/binjgb.js

@@ -0,0 +1,152 @@
+/*
+ * Copyright (C) 2019 Ben Smith
+ *
+ * This software may be modified and distributed under the terms
+ * of the MIT license.  See the LICENSE file for details.
+ */
+
+// Modified to import wasm through rollup
+// And export the binjgb object
+
+import binjgbWasmUrl from './binjgb.wasm';
+
+const Binjgb = async function() {
+  // Must match values defined in generated binjgb.js
+  const TABLE_SIZE = 34;
+  const TOTAL_MEMORY = 16777216;
+  const STATIC_BUMP = 17264;
+  const TOTAL_STACK = 5242880;
+
+  const pageSize = 65536;
+  const totalPages = TOTAL_MEMORY / pageSize;
+  const wasmFile = binjgbWasmUrl;
+  const memory = new WebAssembly.Memory({ initial: totalPages, maximum: totalPages });
+  const buffer = memory.buffer;
+  const u8a = new Uint8Array(buffer);
+  const u32a = new Uint32Array(buffer);
+
+  const GLOBAL_BASE = 1024;
+  const STATIC_BASE = GLOBAL_BASE;
+  let STATICTOP = STATIC_BASE + STATIC_BUMP;
+  const alignMemory = size => {
+    return (size + 15) & -16;
+  };
+  const staticAlloc = size => {
+    const ret = STATICTOP;
+    STATICTOP = alignMemory(STATICTOP + size);
+    return ret;
+  };
+
+  const DYNAMICTOP_PTR = staticAlloc(4);
+  const STACK_BASE = alignMemory(STATICTOP);
+  const STACKTOP = STACK_BASE;
+  const STACK_MAX = alignMemory(STACK_BASE + TOTAL_STACK);
+  const DYNAMIC_BASE = alignMemory(STACK_MAX);
+  u32a[DYNAMICTOP_PTR >> 2] = DYNAMIC_BASE;
+
+  const abort = what => {
+    throw `abort(${what}).`;
+  };
+  const abortOnCannotGrowMemory = () => {
+    abort('Cannot enlarge memory.');
+  };
+  const enlargeMemory = abortOnCannotGrowMemory;
+  const getTotalMemory = () => {
+    return TOTAL_MEMORY;
+  };
+  const ___setErrNo = v => {
+    return v;
+  };
+  const ___syscall140 = (which, varargs) => {
+    return 0;
+  };
+  const streams = {
+    1: { buffer: [], out: console.log.bind(console) },
+    2: { buffer: [], out: console.error.bind(console) }
+  };
+  const decoder = new TextDecoder('utf8');
+  const ___syscall146 = (which, varargs) => {
+    const get = () => {
+      varargs += 4;
+      return u32a[(varargs - 4) >> 2];
+    };
+    const { buffer, out } = streams[get()];
+    const flush = () => {
+      out(decoder.decode(new Uint8Array(buffer)));
+      buffer.length = 0;
+    };
+    const iov = get();
+    const iovcnt = get();
+    const printChar = c => {
+      if (c === 0 || c === 10) {
+        flush();
+      } else {
+        buffer.push(c);
+      }
+    };
+    let ret = 0;
+    for (let i = 0; i < iovcnt; ++i) {
+      const ptr = u32a[(iov + i * 8) >> 2];
+      const len = u32a[(iov + (i * 8 + 4)) >> 2];
+      for (let j = 0; j < len; ++j) {
+        printChar(u8a[ptr + j]);
+      }
+      ret += len;
+    }
+    return ret;
+  };
+  const ___syscall54 = (which, varargs) => {
+    return 0;
+  };
+  const ___syscall6 = (which, varargs) => {
+    return 0;
+  };
+  const _emscripten_memcpy_big = (dest, src, num) => {
+    u8a.set(u8a.subarray(src, src + num), dest);
+    return dest;
+  };
+  const _exit = status => {};
+  const __table_base = 0;
+  const table = new WebAssembly.Table({ initial: TABLE_SIZE, maximum: TABLE_SIZE, element: 'anyfunc' });
+
+  const importObject = {
+    env: {
+      abort,
+      enlargeMemory,
+      getTotalMemory,
+      abortOnCannotGrowMemory,
+      ___setErrNo,
+      ___syscall140,
+      ___syscall146,
+      ___syscall54,
+      ___syscall6,
+      _emscripten_memcpy_big,
+      _exit,
+      __table_base,
+      DYNAMICTOP_PTR,
+      STACKTOP,
+      STACK_MAX,
+      memory,
+      table
+    }
+  };
+
+  const response = fetch(wasmFile);
+  if (WebAssembly.instantiateStreaming) {
+    try {
+      var { instance } = await WebAssembly.instantiateStreaming(response, importObject);
+    } catch (_) {}
+  }
+  if (!instance) {
+    var { instance } = await WebAssembly.instantiate(await (await response).arrayBuffer(), importObject);
+  }
+
+  const ret = {};
+  for (let name in instance.exports) {
+    ret[name] = instance.exports[name];
+  }
+  ret.buffer = memory.buffer;
+  return ret;
+};
+
+export default Binjgb;

demo/benchmark/binjgb/0.1.3/binjgb.wasm

@@ -0,0 +1,101 @@
+// File to export a final wasmboy-like core
+
+// Alot of logic taken from: https://github.com/binji/binjgb/blob/master/demo/demo.js
+
+const RESULT_OK = 0;
+const RESULT_ERROR = 1;
+const SCREEN_WIDTH = 160;
+const SCREEN_HEIGHT = 144;
+const AUDIO_FRAMES = 4096;
+const AUDIO_LATENCY_SEC = 0.1;
+const MAX_UPDATE_SEC = 5 / 60;
+const CPU_TICKS_PER_SECOND = 4194304;
+const EVENT_NEW_FRAME = 1;
+const EVENT_AUDIO_BUFFER_FULL = 2;
+const EVENT_UNTIL_TICKS = 4;
+const REWIND_FRAMES_PER_BASE_STATE = 45;
+const REWIND_BUFFER_CAPACITY = 4 * 1024 * 1024;
+const REWIND_FACTOR = 1.5;
+const REWIND_UPDATE_MS = 16;
+const BUILTIN_PALETTES = 83; // See builtin-palettes.def.
+
+import Binjgb from './binjgb';
+
+function makeWasmBuffer(module, ptr, size) {
+  return new Uint8Array(module.buffer, ptr, size);
+}
+
+const CPU_TICKS_PER_FRAME = 70224;
+let framesRun = 0;
+
+export default async function getBinjgbCore() {
+  // Get our binjgb module
+  const module = await Binjgb();
+
+  // Create our byteMemory
+
+  // Let's assume 8MB ROM
+  const romBufferByteLength = 262144 * 10;
+  const romDataPtr = module._malloc(romBufferByteLength);
+  const romByteMemory = makeWasmBuffer(module, romDataPtr, romBufferByteLength);
+
+  // set a placeholder for our emulator
+  let e;
+
+  // set a placehodler for our graphics memory
+  let graphicsByteMemory;
+
+  // Create an array for our RGB buffer, that wasmboy will convert to rgba
+  const rgbMemory = new Uint8ClampedArray(SCREEN_HEIGHT * SCREEN_WIDTH * 3);
+
+  let core = {};
+  core = {
+    byteMemory: romByteMemory,
+    instance: {
+      exports: {
+        CARTRIDGE_ROM_LOCATION: 0,
+        FRAME_LOCATION: 0,
+        FRAME_SIZE: 0x016c00,
+        config: () => {
+          // Rom is now loaded.
+
+          // Create a new simple emulator?
+          e = module._emulator_new_simple(romDataPtr, romBufferByteLength, 44100, AUDIO_FRAMES);
+          if (e == 0) {
+            throw new Error('Invalid ROM.');
+          }
+
+          graphicsByteMemory = makeWasmBuffer(module, module._get_frame_buffer_ptr(e), module._get_frame_buffer_size(e));
+
+          // Now that we have our rom loaded, simply swap the byte memory for our purposes ;)
+          core.byteMemory = rgbMemory;
+        },
+        executeFrame: () => {
+          while (true) {
+            const event = module._emulator_run_until_f64(e, CPU_TICKS_PER_FRAME * framesRun);
+            if (event & EVENT_NEW_FRAME) {
+              // Output Graphics (normally here, but doing later for perf)
+              // Convert the graphics memory to our rgb Memory
+              for (let i = 0; i < SCREEN_HEIGHT * SCREEN_WIDTH; i++) {
+                let rgbIndex = i * 3;
+                let rgbaIndex = i * 4;
+
+                rgbMemory[rgbIndex + 0] = graphicsByteMemory[rgbaIndex + 0];
+                rgbMemory[rgbIndex + 1] = graphicsByteMemory[rgbaIndex + 1];
+                rgbMemory[rgbIndex + 2] = graphicsByteMemory[rgbaIndex + 2];
+              }
+            }
+            if (event & EVENT_AUDIO_BUFFER_FULL) {
+            }
+            if (event & EVENT_UNTIL_TICKS) {
+              framesRun++;
+              break;
+            }
+          }
+        }
+      }
+    }
+  };
+
+  return core;
+}