Merge pull request #297 from GreyZzzzzzXh/webgl_backend

[Polyfill] use tfjs-core as webgl backend.
intel · Dec 7, 2018 · b23dbf9 · b23dbf9
2 parents 803547b + af02c9c
commit b23dbf9
Show file tree

Hide file tree

Showing 73 changed files with 382 additions and 4,096 deletions.
diff --git a/docs/supported_ops.md b/docs/supported_ops.md
@@ -1,4 +1,4 @@
-| Op Type | WASM | WebGL2 | NNAPI | MPS | BNNS ([#8](https://github.com/intel/webml-polyfill/issues/8)) | clDNN |
+| Op Type | WASM | WebGL | NNAPI | MPS | BNNS ([#8](https://github.com/intel/webml-polyfill/issues/8)) | clDNN |
 |----|------|--------|-------|-----|-----|-----|
 | ADD | yes | yes | yes | yes | no | yes |
 | AVERAGE_POOL_2D | yes | yes| yes | yes | yes | yes |

diff --git a/examples/image_classification/camera.html b/examples/image_classification/camera.html
@@ -33,7 +33,7 @@
           </button>
           <div class="dropdown-menu dropdown-menu-right">
             <button class="dropdown-item disabled" type="button" id="wasm">WASM</button>
-            <button class="dropdown-item disabled" type="button" id="webgl">WebGL2</button>
+            <button class="dropdown-item disabled" type="button" id="webgl">WebGL</button>
             <button class="dropdown-item disabled" type="button" id="webml">WebML</button>
           </div>
       </div>

diff --git a/examples/image_classification/index.html b/examples/image_classification/index.html
@@ -33,7 +33,7 @@
         </button>
         <div class="dropdown-menu dropdown-menu-right">
           <button class="dropdown-item disabled" type="button" id="wasm">WASM</button>
-          <button class="dropdown-item disabled" type="button" id="webgl">WebGL2</button>
+          <button class="dropdown-item disabled" type="button" id="webgl">WebGL</button>
           <button class="dropdown-item disabled" type="button" id="webml">WebML</button>
         </div>
       </div>

diff --git a/examples/image_classification/main.js b/examples/image_classification/main.js
@@ -389,11 +389,11 @@ function main(camera) {
     };
   }
 
-  if (nnPolyfill.supportWebGL2) {
+  if (nnPolyfill.supportWebGL) {
     webgl.setAttribute('class', 'dropdown-item');
     webgl.onclick = function(e) {
       removeAlertElement();
-      changeBackend('WebGL2');
+      changeBackend('WebGL');
     };
   }
 

diff --git a/examples/posenet/camera.html b/examples/posenet/camera.html
@@ -51,7 +51,7 @@
         </button>
         <div class="dropdown-menu dropdown-menu-left">
           <button class="dropdown-item disabled" type="button" id="wasm">WASM</button>
-          <button class="dropdown-item disabled" type="button" id="webgl">WebGL2</button>
+          <button class="dropdown-item disabled" type="button" id="webgl">WebGL</button>
           <button class="dropdown-item disabled" type="button" id="webml">WebML</button>
         </div>
       </div>

diff --git a/examples/posenet/camera.js b/examples/posenet/camera.js
@@ -232,11 +232,11 @@ async function main() {
     }
   }
 
-  if (nnPolyfill.supportWebGL2) {
+  if (nnPolyfill.supportWebGL) {
     webgl.setAttribute('class', 'dropdown-item');
     webgl.onclick = function(e) {
       removeAlertElement();
-      changeBackend('WebGL2');
+      changeBackend('WebGL');
     }
   }
 

diff --git a/examples/posenet/index.html b/examples/posenet/index.html
@@ -78,7 +78,7 @@
           </button>
           <div class="dropdown-menu dropdown-menu-left">
             <button class="dropdown-item disabled" type="button" id="wasm">WASM</button>
-            <button class="dropdown-item disabled" type="button" id="webgl">WebGL2</button>
+            <button class="dropdown-item disabled" type="button" id="webgl">WebGL</button>
             <button class="dropdown-item disabled" type="button" id="webml">WebML</button>
           </div>
         </div>

diff --git a/examples/posenet/main.js b/examples/posenet/main.js
@@ -144,11 +144,11 @@ function main() {
     }
   }
 
-  if (nnPolyfill.supportWebGL2) {
+  if (nnPolyfill.supportWebGL) {
     webgl.setAttribute('class', 'dropdown-item');
     webgl.onclick = function(e) {
       removeAlertElement();
-      changeBackend('WebGL2');
+      changeBackend('WebGL');
     }
   }
 

diff --git a/examples/posenet/src/PoseNet.js b/examples/posenet/src/PoseNet.js
@@ -21,15 +21,13 @@ class PoseNet{
         throw Error('Fails to initialize neural network context');
       }
       this._nn = nnNative;
-    } else if (this._backend === 'WASM' || this._backend === 'WebGL2') {
+    } else if (this._backend === 'WASM' || this._backend === 'WebGL') {
       this._nn = nnPolyfill;
     }
   }
   async createCompiledModel() {
     let options = {};
-    if (this._backend === 'WebGL2') {
-      options.useWebGL2 = true;
-    }
+    options.backend = this._backend;
     this._model = await this._nn.createModel(options);
     await this._addTensorOperands();
     await this._model.finish();

diff --git a/examples/ssd_mobilenet/SsdMobileNet.js b/examples/ssd_mobilenet/SsdMobileNet.js
@@ -13,16 +13,14 @@ class SsdMobileNet {
         throw Error('Fails to initialize neural network context');
       }
       this._nn = nnNative;
-    } else if (this._backend === 'WASM' || this._backend === 'WebGL2') {
+    } else if (this._backend === 'WASM' || this._backend === 'WebGL') {
       this._nn = nnPolyfill;
     }
   }
 
   async createCompiledModel() {
     let options = {};
-    if (this._backend === 'WebGL2') {
-      options.useWebGL2 = true;
-    }
+    options.backend = this._backend;
     this._model = await this._nn.createModel(options);
 
     this._addTensorOperands();
@@ -192,7 +190,7 @@ class SsdMobileNet {
       }
       this._model.addOperation(opType, inputs, outputs);
     }
-    // if (this._backend === 'WebGL2') {
+    // if (this._backend === 'WebGL') {
     //   this._model.supportFeatureMapConcate = true;
     // }
   }

diff --git a/examples/ssd_mobilenet/camera.html b/examples/ssd_mobilenet/camera.html
@@ -34,7 +34,7 @@
           </button>
           <div class="dropdown-menu dropdown-menu-right">
             <button class="dropdown-item disabled" type="button" id="wasm">WASM</button>
-            <button class="dropdown-item disabled" type="button" id="webgl">WebGL2</button>
+            <button class="dropdown-item disabled" type="button" id="webgl">WebGL</button>
             <button class="dropdown-item disabled" type="button" id="webml">WebML</button>
           </div>
       </div>

diff --git a/examples/ssd_mobilenet/camera.js b/examples/ssd_mobilenet/camera.js
@@ -138,11 +138,11 @@ function main() {
       }
     }
 
-    if (nnPolyfill.supportWebGL2) {
+    if (nnPolyfill.supportWebGL) {
       webgl.setAttribute('class', 'dropdown-item');
       webgl.onclick = function(e) {
         removeAlertElement();
-        changeBackend('WebGL2');
+        changeBackend('WebGL');
       }
     }
 

diff --git a/examples/ssd_mobilenet/index.html b/examples/ssd_mobilenet/index.html
@@ -34,7 +34,7 @@
         </button>
         <div class="dropdown-menu dropdown-menu-right">
           <button class="dropdown-item disabled" type="button" id="wasm">WASM</button>
-          <button class="dropdown-item disabled" type="button" id="webgl">WebGL2</button>
+          <button class="dropdown-item disabled" type="button" id="webgl">WebGL</button>
           <button class="dropdown-item disabled" type="button" id="webml">WebML</button>
         </div>
       </div>

diff --git a/examples/ssd_mobilenet/main.js b/examples/ssd_mobilenet/main.js
@@ -135,11 +135,11 @@ function main() {
       }
     }
 
-    if (nnPolyfill.supportWebGL2) {
+    if (nnPolyfill.supportWebGL) {
       webgl.setAttribute('class', 'dropdown-item');
       webgl.onclick = function(e) {
         removeAlertElement();
-        changeBackend('WebGL2');
+        changeBackend('WebGL');
       }
     }
 

diff --git a/examples/util/onnx/OnnxModelImporter.js b/examples/util/onnx/OnnxModelImporter.js
@@ -17,16 +17,14 @@ class OnnxModelImporter {
         throw Error('Fails to initialize neural network context');
       }
       this._nn = nnNative;
-    } else if (this._backend === 'WASM' || this._backend === 'WebGL2') {
+    } else if (this._backend === 'WASM' || this._backend === 'WebGL') {
       this._nn = nnPolyfill;
     }
   }
 
   async createCompiledModel() {
     let options = {};
-    if (this._backend === 'WebGL2') {
-      options.useWebGL2 = true;
-    }
+    options.backend = this._backend;
     this._model = await this._nn.createModel(options);
 
     this._addTensorOperands();

diff --git a/examples/util/tflite/TFliteModelImporter.js b/examples/util/tflite/TFliteModelImporter.js
@@ -16,16 +16,14 @@ class TFliteModelImporter {
         throw Error('Fails to initialize neural network context');
       }
       this._nn = nnNative;
-    } else if (this._backend === 'WASM' || this._backend === 'WebGL2') {
+    } else if (this._backend === 'WASM' || this._backend === 'WebGL') {
       this._nn = nnPolyfill;
     }
   }
 
   async createCompiledModel() {
     let options = {};
-    if (this._backend === 'WebGL2') {
-      options.useWebGL2 = true;
-    }
+    options.backend = this._backend;
     this._model = await this._nn.createModel(options);
 
     this._addTensorOperands();

diff --git a/package.json b/package.json
@@ -35,7 +35,8 @@
     "ndarray-ops": "^1.2.2",
     "ndarray-squeeze": "^1.0.2",
     "selenium-webdriver": "^3.1.0",
-    "webpack": "^3.5.5"
+    "webpack": "^3.5.5",
+    "@tensorflow/tfjs-core": "0.13.12"
   },
   "dependencies": {}
 }
diff --git a/src/nn/Compilation.js b/src/nn/Compilation.js
@@ -2,7 +2,7 @@ import {PreferenceCode,ResultCode} from './Enums'
 import Device from './wasm/Device'
 import * as utils from './utils'
 import Execution from './Execution'
-import webgl2Model from './webgl2/Model'
+import WebGLModel from './webgl/WebGLModel'
 
 export default class Compilation {
   /**
@@ -16,7 +16,7 @@ export default class Compilation {
     this._preference = PreferenceCode.fast_single_answer;
     this._device = new Device;
     this._preparedModel = null;
-    this._useWebGL2 = model._useWebGL2;
+    this._backend = model._backend;
   }
 
 
@@ -52,11 +52,17 @@ export default class Compilation {
    * Indicate that we have finished modifying a compilation.
    */
   async finish() {
-    if (this._useWebGL2) {
-      this._preparedModel = new webgl2Model(this._model);
-      await this._preparedModel.prepareModel();
-    } else {
-      this._preparedModel = await this._device.prepareModel(this._model);
+    switch (this._backend) {
+      case 'WASM': {
+        this._preparedModel = await this._device.prepareModel(this._model);
+      } break;
+      case 'WebGL': {
+        this._preparedModel = new WebGLModel(this._model);
+        await this._preparedModel.prepareModel();
+      } break;
+      default: {
+        throw new Error(`Backend ${this._backend} is not supported`);
+      }
     }
     this._finished = true;
     return ResultCode.NO_ERROR;

diff --git a/src/nn/Model.js b/src/nn/Model.js
@@ -12,7 +12,7 @@ export default class Model {
     this._operations = [];
     this._inputs = null;
     this._outputs = null;
-    this._useWebGL2 = options.useWebGL2;
+    this._backend = options.backend;
   }
 
   /**

diff --git a/src/nn/NeuralNetworkContext.js b/src/nn/NeuralNetworkContext.js
@@ -2,7 +2,7 @@ import {OperationCode, OperandCode, PaddingCode, PreferenceCode, FuseCode, Resul
 import Model from './Model'
 import Compilation from './Compilation'
 import Execution from './Execution'
-import supportWebGL2 from './webgl2'
+import WebGLModel from './webgl/WebGLModel'
 
 export default class NeuralNetworkContext {
   constructor() {
@@ -11,18 +11,18 @@ export default class NeuralNetworkContext {
     this._initFusedActivationFunctionTypes();
     this._initImplicitPaddingTypes();
     this._initExecutionPreferenceTypes();
-    this.supportWebGL2 = supportWebGL2;
+    this.supportWebGL = WebGLModel._supportWebGL();
     this.supportWasm = !!window.WebAssembly;
   }
 
   /**
    * Create a model object.
    * 
-   * @param {options} options.useWebGL2 - create model backed by WebGL2.
+   * @param {options} options.backend - model backend.
    */
   async createModel(options = {}) {
-    if (options.useWebGL2 && !this.supportWebGL2) {
-      return "WebGL2 is not available";
+    if (options.backend === 'WebGL' && !this.supportWebGL) {
+      return "WebGL is not available";
     } else if (!this.supportWasm) {
       return "WebAssembly is not available";
     }

diff --git a/src/nn/webgl/README.md b/src/nn/webgl/README.md
@@ -0,0 +1,2 @@
+The WebGLModel.js imports [tfjs-core](https://github.com/tensorflow/tfjs-core), 
+which is licensed under the Apache License, Version 2.0.