Use both MLOperandDescriptor.dimensions and MLOperandDescriptor.shape (…

…#274)

Fixed #273

code/samples/matmul.js

@@ -2,8 +2,16 @@
 const context = await navigator.ml.createContext({deviceType: 'gpu'});
 const builder = new MLGraphBuilder(context);
 // Step 1: Create a computational graph calculating `c = a * b`.
-const a = builder.input('a', {dataType: 'float32', dimensions: [3, 4]});
-const b = builder.input('b', {dataType: 'float32', dimensions: [4, 3]});
+const a = builder.input('a', {
+  dataType: 'float32',
+  dimensions: [3, 4],
+  shape: [3, 4],
+});
+const b = builder.input('b', {
+  dataType: 'float32',
+  dimensions: [4, 3],
+  shape: [4, 3],
+});
 const c = builder.matmul(a, b);
 // Step 2: Compile it into an executable graph.
 const graph = await builder.build({c});

code/samples/mul_add.js

@@ -1,4 +1,4 @@
-const operandType = {dataType: 'float32', dimensions: [2, 2]};
+const operandType = {dataType: 'float32', dimensions: [2, 2], shape: [2, 2]};
 const context = await navigator.ml.createContext();
 const builder = new MLGraphBuilder(context);
 // 1. Create a computational graph 'C = 0.2 * A + B'.

code/samples/simple_graph.js

@@ -18,7 +18,7 @@ const TENSOR_SIZE = 8;
 const builder = new MLGraphBuilder(context);
 
 // Create MLOperandDescriptor object.
-const desc = {dataType: 'float32', dimensions: TENSOR_DIMS};
+const desc = {dataType: 'float32', dimensions: TENSOR_DIMS, shape: TENSOR_DIMS};
 
 // constant1 is a constant MLOperand with the value 0.5.
 const constantBuffer1 = new Float32Array(TENSOR_SIZE).fill(0.5);

common/utils.js

@@ -104,7 +104,7 @@ export async function buildConstantByNpy(builder, url, targetType = 'float32') {
   if (!dataTypeMap.has(npArray.dataType)) {
     throw new Error(`Data type ${npArray.dataType} is not supported.`);
   }
-  const dimensions = npArray.shape;
+  const shape = npArray.shape;
   let type = dataTypeMap.get(npArray.dataType).type;
   const TypedArrayConstructor = dataTypeMap.get(npArray.dataType).array;
   const dataView = new Uint8Array(npArray.data.buffer);
@@ -121,7 +121,8 @@ export async function buildConstantByNpy(builder, url, targetType = 'float32') {
     throw new Error(`Conversion from ${npArray.dataType} ` +
         `to ${targetType} is not supported.`);
   }
-  return builder.constant({dataType: type, dimensions}, typedArray);
+  return builder.constant(
+      {dataType: type, dimensions: shape, shape}, typedArray);
 }
 
 // Convert video frame to a canvas element
@@ -162,7 +163,7 @@ export function stopCameraStream(id, stream) {
  * input element.
  * inputOptions = {
  *     inputLayout {String}, // input layout of tensor.
- *     inputDimensions: {!Array<number>}, // dimensions of input tensor.
+ *     inputShape: {!Array<number>}, // shape of input tensor.
  *     mean: {Array<number>}, // optional, mean values for processing the input
  *       element. If not specified, it will be set to [0, 0, 0, 0].
  *     std: {Array<number>}, // optional, std values for processing the input
@@ -190,16 +191,16 @@ export function stopCameraStream(id, stream) {
  * @return {Object} tensor, an object of input tensor.
  */
 export function getInputTensor(inputElement, inputOptions) {
-  const inputDimensions = inputOptions.inputDimensions;
+  const inputShape = inputOptions.inputShape;
   const tensor = new Float32Array(
-      inputDimensions.slice(1).reduce((a, b) => a * b));
+      inputShape.slice(1).reduce((a, b) => a * b));
 
   inputElement.width = inputElement.videoWidth ||
       inputElement.naturalWidth;
   inputElement.height = inputElement.videoHeight ||
       inputElement.naturalHeight;
 
-  let [channels, height, width] = inputDimensions.slice(1);
+  let [channels, height, width] = inputShape.slice(1);
   const mean = inputOptions.mean || [0, 0, 0, 0];
   const std = inputOptions.std || [1, 1, 1, 1];
   const normlizationFlag = inputOptions.norm || false;
@@ -209,7 +210,7 @@ export function getInputTensor(inputElement, inputOptions) {
   const imageChannels = 4; // RGBA
   const drawOptions = inputOptions.drawOptions;
   if (inputLayout === 'nhwc') {
-    [height, width, channels] = inputDimensions.slice(1);
+    [height, width, channels] = inputShape.slice(1);
   }
   const canvasElement = document.createElement('canvas');
   canvasElement.width = width;

face_recognition/facenet_nchw.js

@@ -19,7 +19,7 @@ export class FaceNetNchw {
       std: [127.5, 127.5, 127.5, 127.5],
       channelScheme: 'BGR',
       inputLayout: 'nchw',
-      inputDimensions: [1, 3, 160, 160],
+      inputShape: [1, 3, 160, 160],
     };
     this.postOptions = {
       distanceMetric: 'euclidean',
@@ -140,7 +140,8 @@ export class FaceNetNchw {
     this.builder_ = new MLGraphBuilder(this.context_);
     const input = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
 
     const poolOptions = {windowDimensions: [3, 3], strides};

face_recognition/facenet_nhwc.js

@@ -19,7 +19,7 @@ export class FaceNetNhwc {
       std: [127.5, 127.5, 127.5, 127.5],
       channelScheme: 'BGR',
       inputLayout: 'nhwc',
-      inputDimensions: [1, 160, 160, 3],
+      inputShape: [1, 160, 160, 3],
     };
     this.postOptions = {
       distanceMetric: 'euclidean',
@@ -141,7 +141,8 @@ export class FaceNetNhwc {
     this.builder_ = new MLGraphBuilder(this.context_);
     const input = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
 
     const poolOptions = {windowDimensions: [3, 3], strides, layout: 'nhwc'};

face_recognition/main.js

@@ -375,9 +375,9 @@ async function main() {
       console.log('- Computing... ');
       // Do warm up
       const fdResults = await fdInstance.compute(new Float32Array(
-          utils.sizeOfShape(fdInputOptions.inputDimensions)), fdOutputs);
+          utils.sizeOfShape(fdInputOptions.inputShape)), fdOutputs);
       const frResults = await frInstance.compute(new Float32Array(
-          utils.sizeOfShape(frInputOptions.inputDimensions)), frOutputs);
+          utils.sizeOfShape(frInputOptions.inputShape)), frOutputs);
       fdOutputs = fdResults.outputs;
       frOutputs = frResults.outputs;
       for (let i = 0; i < numRuns; i++) {

facial_landmark_detection/face_landmark_nchw.js

@@ -12,7 +12,7 @@ export class FaceLandmarkNchw {
       '/test-data/models/face_landmark_nchw/weights';
     this.inputOptions = {
       inputLayout: 'nchw',
-      inputDimensions: [1, 3, 128, 128],
+      inputShape: [1, 3, 128, 128],
     };
   }
 
@@ -71,7 +71,8 @@ export class FaceLandmarkNchw {
     this.builder_ = new MLGraphBuilder(this.context_);
     const input = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
 
     const poolOptions =

facial_landmark_detection/face_landmark_nhwc.js

@@ -12,7 +12,7 @@ export class FaceLandmarkNhwc {
       '/test-data/models/face_landmark_nhwc/weights';
     this.inputOptions = {
       inputLayout: 'nhwc',
-      inputDimensions: [1, 128, 128, 3],
+      inputShape: [1, 128, 128, 3],
     };
   }
 
@@ -72,7 +72,8 @@ export class FaceLandmarkNhwc {
     this.builder_ = new MLGraphBuilder(this.context_);
     const input = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
 
     const poolOptions =

facial_landmark_detection/main.js

@@ -312,9 +312,9 @@ async function main() {
       console.log('- Computing... ');
       // Do warm up
       const fdResults = await fdInstance.compute(new Float32Array(
-          utils.sizeOfShape(fdInputOptions.inputDimensions)), fdOutputs);
+          utils.sizeOfShape(fdInputOptions.inputShape)), fdOutputs);
       const fldResults = await fldInstance.compute(new Float32Array(
-          utils.sizeOfShape(fldInputOptions.inputDimensions)), fldOutputs);
+          utils.sizeOfShape(fldInputOptions.inputShape)), fldOutputs);
       fdOutputs = fdResults.outputs;
       fldOutputs = fldResults.outputs;
       for (let i = 0; i < numRuns; i++) {

facial_landmark_detection/ssd_mobilenetv2_face_nchw.js

@@ -19,7 +19,7 @@ export class SsdMobilenetV2FaceNchw {
       boxSize: 4,
       numClasses: 2,
       numBoxes: [1083, 600, 150, 54, 24, 6],
-      inputDimensions: [1, 3, 300, 300],
+      inputShape: [1, 3, 300, 300],
     };
     this.outputsInfo = {
       'biasAdd0': [1, 12, 19, 19],
@@ -115,7 +115,8 @@ ${nameArray[1]}`;
     this.builder_ = new MLGraphBuilder(this.context_);
     const input = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
 
     const bottleneck0 = this.buildLinearBottleneck_(

facial_landmark_detection/ssd_mobilenetv2_face_nhwc.js

@@ -19,7 +19,7 @@ export class SsdMobilenetV2FaceNhwc {
       boxSize: 4,
       numClasses: 2,
       numBoxes: [1083, 600, 150, 54, 24, 6],
-      inputDimensions: [1, 300, 300, 3],
+      inputShape: [1, 300, 300, 3],
     };
     this.outputsInfo = {
       'biasAdd0': [1, 19, 19, 12],
@@ -127,7 +127,8 @@ ${nameArray[1]}`;
     this.builder_ = new MLGraphBuilder(this.context_);
     const input = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
 
     const bottleneck0 = this.buildLinearBottleneck_(

image_classification/efficientnet_fp16_nchw.js

@@ -16,9 +16,9 @@ export class EfficientNetFP16Nchw {
       norm: true,
       inputLayout: 'nchw',
       labelUrl: './labels/labels1000.txt',
-      inputDimensions: [1, 3, 224, 224],
+      inputShape: [1, 3, 224, 224],
     };
-    this.outputDimensions = [1, 1000];
+    this.outputShape = [1, 1000];
   }
 
   async buildConv_(input, name, blockName, clip = false, options = {}) {
@@ -77,7 +77,8 @@ export class EfficientNetFP16Nchw {
     this.builder_ = new MLGraphBuilder(this.context_);
     let data = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
     data = this.builder_.cast(data, 'float16');
     // Block 0

image_classification/main.js

@@ -335,7 +335,7 @@ async function main() {
       inputOptions = netInstance.inputOptions;
       labels = await fetchLabels(inputOptions.labelUrl);
       outputBuffer =
-          new Float32Array(utils.sizeOfShape(netInstance.outputDimensions));
+          new Float32Array(utils.sizeOfShape(netInstance.outputShape));
       isFirstTimeLoad = false;
       console.log(`- Model name: ${modelName}, Model layout: ${layout} -`);
       // UI shows model loading progress

image_classification/mobilenet_nchw.js

@@ -25,9 +25,9 @@ export class MobileNetV2Nchw {
       norm: true,
       inputLayout: 'nchw',
       labelUrl: './labels/labels1000.txt',
-      inputDimensions: [1, 3, 224, 224],
+      inputShape: [1, 3, 224, 224],
     };
-    this.outputDimensions = [1, 1000];
+    this.outputShape = [1, 1000];
   }
 
   async buildConv_(input, name, relu6 = true, options = {}) {
@@ -91,7 +91,8 @@ export class MobileNetV2Nchw {
     this.builder_ = new MLGraphBuilder(this.context_);
     let data = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
     if (this.dataType_ === 'float16') {
       data = this.builder_.cast(data, 'float16');

image_classification/mobilenet_nhwc.js

@@ -18,9 +18,9 @@ export class MobileNetV2Nhwc {
       std: [127.5, 127.5, 127.5],
       inputLayout: 'nhwc',
       labelUrl: './labels/labels1001.txt',
-      inputDimensions: [1, 224, 224, 3],
+      inputShape: [1, 224, 224, 3],
     };
-    this.outputDimensions = [1, 1001];
+    this.outputShape = [1, 1001];
   }
 
   async buildConv_(input, weightsSubName, biasSubName, relu6, options) {
@@ -89,7 +89,8 @@ export class MobileNetV2Nhwc {
     const filterLayout = 'ohwi';
     const input = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
     const conv0 = this.buildConv_(
         input, '90', 'Conv_Conv2D', true, {strides, autoPad, filterLayout});

image_classification/resnet50v1_fp16_nchw.js

@@ -16,9 +16,9 @@ export class ResNet50V1FP16Nchw {
       norm: true,
       inputLayout: 'nchw',
       labelUrl: './labels/labels1000.txt',
-      inputDimensions: [1, 3, 224, 224],
+      inputShape: [1, 3, 224, 224],
     };
-    this.outputDimensions = [1, 1000];
+    this.outputShape = [1, 1000];
   }
 
   async buildConv_(input, name, stageName, relu, options = undefined) {
@@ -78,7 +78,8 @@ export class ResNet50V1FP16Nchw {
     this.builder_ = new MLGraphBuilder(this.context_);
     let data = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
     data = this.builder_.cast(data, 'float16');
     const conv1 = await this.buildConv_(

image_classification/resnet50v2_nchw.js

@@ -16,9 +16,9 @@ export class ResNet50V2Nchw {
       norm: true,
       inputLayout: 'nchw',
       labelUrl: './labels/labels1000.txt',
-      inputDimensions: [1, 3, 224, 224],
+      inputShape: [1, 3, 224, 224],
     };
-    this.outputDimensions = [1, 1000];
+    this.outputShape = [1, 1000];
   }
 
   async buildConv_(input, name, stageName, options = undefined) {
@@ -100,7 +100,8 @@ export class ResNet50V2Nchw {
     this.builder_ = new MLGraphBuilder(this.context_);
     const data = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
     const bn1 = this.buildBatchNorm_(data, '0', '', false);
     const conv0 = this.buildConv_(

image_classification/resnet50v2_nhwc.js

@@ -19,9 +19,9 @@ export class ResNet50V2Nhwc {
       std: [127.5, 127.5, 127.5],
       inputLayout: layout,
       labelUrl: './labels/labels1001.txt',
-      inputDimensions: [1, 224, 224, 3],
+      inputShape: [1, 224, 224, 3],
     };
-    this.outputDimensions = [1, 1001];
+    this.outputShape = [1, 1001];
   }
 
   async buildConv_(input, nameIndices, options = {}, relu = true) {
@@ -122,7 +122,8 @@ export class ResNet50V2Nhwc {
     this.builder_ = new MLGraphBuilder(this.context_);
     const input = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
     const conv1 = await this.buildConv_(
         input, ['', '', '1'], {strides, padding: [3, 3, 3, 3]}, false);

image_classification/squeezenet_nchw.js

@@ -16,9 +16,9 @@ export class SqueezeNetNchw {
       norm: true,
       inputLayout: 'nchw',
       labelUrl: './labels/labels1000.txt',
-      inputDimensions: [1, 3, 224, 224],
+      inputShape: [1, 3, 224, 224],
     };
-    this.outputDimensions = [1, 1000];
+    this.outputShape = [1, 1000];
   }
 
   async buildConv_(input, name, options = {}) {
@@ -45,7 +45,8 @@ export class SqueezeNetNchw {
     this.builder_ = new MLGraphBuilder(this.context_);
     const data = this.builder_.input('input', {
       dataType: 'float32',
-      dimensions: this.inputOptions.inputDimensions,
+      dimensions: this.inputOptions.inputShape,
+      shape: this.inputOptions.inputShape,
     });
     const conv0 = this.buildConv_(data, 'conv0', {strides: [2, 2]});
     const pool0 = this.builder_.maxPool2d(