Modules size tests

.travis.yml

@@ -35,7 +35,11 @@ jobs:
     - gulp tests-babylon-unit
     - travis_retry gulp tests-validation-virtualscreen
     - travis_retry gulp tests-validation-browserstack
+  - env: JOB=ModuleTests
+    script:
+    - gulp typescript-all
     - gulp tests-modules
+    - gulp deployAndTests-es6Modules
   - env: JOB=ViewerTests
     script:
     - export DISPLAY=:99.0

Tools/Gulp/gulpfile.js

@@ -18,6 +18,7 @@ require("./tasks/gulpTasks-tests");
 require("./tasks/gulpTasks-remapPaths");
 require("./tasks/gulpTasks-npmPackages");
 require("./tasks/gulpTasks-dependencies");
+require("./tasks/gulpTasks-testsES6");
 
 /**
  * Temp cleanup after upgrade.
@@ -79,7 +80,7 @@ gulp.task("typescript-all", gulp.series("typescript-libraries", "typescript-es6"
 /**
  * Do it all (tests).
  */
-gulp.task("tests-all", gulp.series("tests-unit", "tests-modules", "tests-validation-virtualscreen", "tests-validation-browserstack"));
+gulp.task("tests-all", gulp.series("tests-unit", "tests-modules", "deployAndTests-es6Modules", "tests-validation-virtualscreen", "tests-validation-browserstack"));
 
 /**
  * Get Ready to test Npm Packages.

Tools/Gulp/tasks/gulpTasks-npmPackages.js

@@ -7,22 +7,32 @@ var publish = require("../../Publisher/tasks/main");
 /**
  * Get Ready to test Npm Packages.
  */
-gulp.task("npmPackages-es6", gulp.series("typescript-es6", function(cb) {
+gulp.task("localdev-es6", function(cb) {
     publish(false, {
         es6: true
     });
     cb();
-}));
+});
 
 /**
  * Get Ready to test Npm Packages.
  */
-gulp.task("npmPackages-UMD", gulp.series("typescript-libraries", function(cb) {
+gulp.task("localdev-UMD", function(cb) {
     publish(false, {
         umd: true
     });
     cb();
-}));
+});
+
+/**
+ * Get Ready to test Npm Packages.
+ */
+gulp.task("npmPackages-es6", gulp.series("typescript-es6", "localdev-es6"));
+
+/**
+ * Get Ready to test Npm Packages.
+ */
+gulp.task("npmPackages-UMD", gulp.series("typescript-libraries", "localdev-UMD"));
 
 /**
  * Get Ready to test Npm Packages.

Tools/Gulp/tasks/gulpTasks-tests.js

@@ -1,7 +1,6 @@
 // Import Dependencies.
 var gulp = require("gulp");
 var typescript = require("gulp-typescript");
-var fs = require("fs");
 var karmaServer = require('karma').Server;
 var webpack = require('webpack');
 var webpackStream = require("webpack-stream");

Tools/Gulp/tasks/gulpTasks-testsES6.js

@@ -0,0 +1,83 @@
+// Import Dependencies.
+const gulp = require("gulp");
+const path = require("path");
+const fs = require("fs-extra");
+const shelljs = require('shelljs');
+
+// Import Helpers.
+const colorConsole = require("../../NodeHelpers/colorConsole");
+
+// Read the full config.
+var config = require("../../Config/config.js");
+
+// Base Line Path.
+var baseLinePath = path.resolve(config.computed.rootFolder, "tests/es6Modules/packagesSizeBaseLine.json");
+var es6TestsFolder = path.resolve(config.computed.rootFolder, "tests/es6Modules");
+var es6TestsWebpackFile = path.resolve(es6TestsFolder, "webpack.config.js");
+
+/**
+ * Launches the ES6 modules tests to evaluate the min package size.
+ */
+gulp.task("tests-es6Modules", function(done) {
+    colorConsole.log("Npm link dependencies");
+    shelljs.exec("npm link @babylonjs/core", {
+        async: false,
+        cwd: es6TestsFolder
+    });
+
+    shelljs.exec("npm link @babylonjs/materials", {
+        async: false,
+        cwd: es6TestsFolder
+    });
+
+    colorConsole.log("Bundle test app");
+    var result = shelljs.exec("webpack", {
+        async: false,
+        cwd: es6TestsFolder
+    });
+
+    if (result.code != 0) {
+        colorConsole.error(result.stdout);
+        colorConsole.error(result.stderr);
+        throw "Can not build es6 dev apps."
+    }
+
+    colorConsole.log("Gather output size");
+
+    var testsBaseLine = fs.readJSONSync(baseLinePath);
+    var webpackConfig = require(es6TestsWebpackFile);
+    for (let entryName in webpackConfig.entry) {
+        let entry = webpackConfig.entry[entryName];
+        entry = entry.replace(".ts", ".js");
+        entry = path.basename(entry);
+        let outputPath = path.resolve(config.computed.tempFolder, 'testsES6Modules', entry);
+        let stats = fs.statSync(outputPath);
+        let size = stats.size;
+
+        if (testsBaseLine && testsBaseLine[entryName] && size > (testsBaseLine[entryName] + 10000)) {
+            colorConsole.error(`New size: ${(""+size).cyan} bytes is bigger than baseline size : ${testsBaseLine[entryName]} bytes on ${entryName}.`);
+            throw "Bigger than baseline";
+        }
+        testsBaseLine[entryName] = size;
+    }
+
+    for (let entryName in testsBaseLine) {
+        colorConsole.success(`Baseline size for ${entryName.yellow} is ${(""+testsBaseLine[entryName]).cyan} bytes.`);
+    }
+
+    colorConsole.log("Save baseline");
+    fs.writeJSONSync(baseLinePath, testsBaseLine);
+
+    done();
+});
+
+/**
+ * Launches the ES6 modules tests to evaluate the min package size.
+ */
+gulp.task("deployAndTests-es6Modules", gulp.series("localdev-es6", "tests-es6Modules"));
+
+
+/**
+ * Launches the ES6 modules tests to evaluate the min package size.
+ */
+gulp.task("buildAndTests-es6Modules", gulp.series("npmPackages-es6", "deployAndTests-es6Modules"));

tests/es6Modules/engineOnly.ts

@@ -0,0 +1,4 @@
+import { Engine } from "@babylonjs/core/Engines/engine";
+
+const canvas = document.getElementById("renderCanvas") as HTMLCanvasElement;
+new Engine(canvas);

tests/es6Modules/minGridMaterial.ts

@@ -0,0 +1,45 @@
+import { Engine } from "@babylonjs/core/Engines/engine";
+import { Scene } from "@babylonjs/core/scene";
+import { Vector3 } from "@babylonjs/core/Maths/math";
+import { FreeCamera } from "@babylonjs/core/Cameras/freeCamera";
+import { HemisphericLight } from "@babylonjs/core/Lights/hemisphericLight";
+import { Mesh } from "@babylonjs/core/Meshes/mesh";
+
+import { GridMaterial } from "@babylonjs/materials/grid/gridMaterial";
+
+import "@babylonjs/core/Meshes/Builders/boxBuilder";
+import "@babylonjs/core/Meshes/Builders/sphereBuilder";
+
+const canvas = document.getElementById("renderCanvas") as HTMLCanvasElement;
+const engine = new Engine(canvas);
+var scene = new Scene(engine);
+
+// This creates and positions a free camera (non-mesh)
+var camera = new FreeCamera("camera1", new Vector3(0, 5, -10), scene);
+
+// This targets the camera to scene origin
+camera.setTarget(Vector3.Zero());
+
+// This attaches the camera to the canvas
+camera.attachControl(canvas, true);
+
+// This creates a light, aiming 0,1,0 - to the sky (non-mesh)
+var light = new HemisphericLight("light1", new Vector3(0, 1, 0), scene);
+
+// Default intensity is 1. Let's dim the light a small amount
+light.intensity = 0.7;
+
+// Our built-in 'sphere' shape. Params: name, subdivs, size, scene
+var sphere = Mesh.CreateSphere("sphere1", 16, 2, scene);
+
+// Move the sphere upward 1/2 its height
+sphere.position.y = 2;
+
+// Our built-in 'ground' shape. Params: name, width, depth, subdivs, scene
+var ground = Mesh.CreateGround("ground1", 6, 6, 2, scene);
+ground.material = new GridMaterial("", scene);
+sphere.material = new GridMaterial("", scene);
+
+engine.runRenderLoop(() => {
+    scene.render();
+});

tests/es6Modules/minStandardMaterial.ts

@@ -0,0 +1,42 @@
+import { Engine } from "@babylonjs/core/Engines/engine";
+import { Scene } from "@babylonjs/core/scene";
+import { Vector3 } from "@babylonjs/core/Maths/math";
+import { FreeCamera } from "@babylonjs/core/Cameras/freeCamera";
+import { HemisphericLight } from "@babylonjs/core/Lights/hemisphericLight";
+import { Mesh } from "@babylonjs/core/Meshes/mesh";
+
+import "@babylonjs/core/Materials/standardMaterial";
+import "@babylonjs/core/Meshes/Builders/boxBuilder";
+import "@babylonjs/core/Meshes/Builders/sphereBuilder";
+
+const canvas = document.getElementById("renderCanvas") as HTMLCanvasElement;
+const engine = new Engine(canvas);
+var scene = new Scene(engine);
+
+// This creates and positions a free camera (non-mesh)
+var camera = new FreeCamera("camera1", new Vector3(0, 5, -10), scene);
+
+// This targets the camera to scene origin
+camera.setTarget(Vector3.Zero());
+
+// This attaches the camera to the canvas
+camera.attachControl(canvas, true);
+
+// This creates a light, aiming 0,1,0 - to the sky (non-mesh)
+var light = new HemisphericLight("light1", new Vector3(0, 1, 0), scene);
+
+// Default intensity is 1. Let's dim the light a small amount
+light.intensity = 0.7;
+
+// Our built-in 'sphere' shape. Params: name, subdivs, size, scene
+var sphere = Mesh.CreateSphere("sphere1", 16, 2, scene);
+
+// Move the sphere upward 1/2 its height
+sphere.position.y = 2;
+
+// Our built-in 'ground' shape. Params: name, width, depth, subdivs, scene
+var ground = Mesh.CreateGround("ground1", 6, 6, 2, scene);
+
+engine.runRenderLoop(() => {
+    scene.render();
+});

tests/es6Modules/packagesSizeBaseLine.json

@@ -0,0 +1 @@
+{"engineOnly":303950,"sceneOnly":567058,"minGridMaterial":695590,"minStandardMaterial":791420}

tests/es6Modules/sceneOnly.ts

@@ -0,0 +1,6 @@
+import { Engine } from "@babylonjs/core/Engines/engine";
+import { Scene } from "@babylonjs/core/scene";
+
+const canvas = document.getElementById("renderCanvas") as HTMLCanvasElement;
+const engine = new Engine(canvas);
+new Scene(engine);

tests/es6Modules/tsconfig.json

@@ -0,0 +1,7 @@
+{
+    "compilerOptions": {
+        "module": "esNext",
+        "target": "es5",
+        "moduleResolution": "node",
+    }
+}

tests/es6Modules/webpack.config.js

@@ -0,0 +1,27 @@
+const path = require("path");
+const config = require("../../Tools/Config/config");
+
+module.exports = {
+    context: path.resolve(__dirname),
+    entry: {
+        engineOnly: path.resolve(__dirname, 'engineOnly.ts'),
+        sceneOnly: path.resolve(__dirname, 'sceneOnly.ts'),
+        minGridMaterial: path.resolve(__dirname, 'minGridMaterial.ts'),
+        minStandardMaterial: path.resolve(__dirname, 'minStandardMaterial.ts')
+    },
+    output: {
+        filename: '[name].js',
+        path: config.computed.tempFolder + '/testsES6Modules'
+    },
+    devtool: 'none',
+    resolve: {
+        extensions: ['.ts', '.js']
+    },
+    module: {
+        rules: [{
+            test: /\.tsx?$/,
+            loader: 'ts-loader'
+        }]
+    },
+    mode: "production"
+};