wip rollup

mapbox · Feb 17, 2018 · 802043a · 802043a
1 parent a616ea4
commit 802043a
Show file tree

Hide file tree

Showing 30 changed files with 216 additions and 123 deletions.
diff --git a/build/rollup-plugin-worker-prelude.js b/build/rollup-plugin-worker-prelude.js
@@ -0,0 +1,37 @@
+import assert from 'assert';
+import MagicString from 'magic-string';
+
+export default function workerPrelude () {
+    return {
+        name: 'mapbox-gl-worker-prelude',
+        transformBundle: (source, {format}) => {
+            assert(format === 'umd');
+
+            const preludeString = 'function (global, factory) {\n';
+
+            const s = new MagicString(source);
+            s.appendRight(source.indexOf(preludeString) + preludeString.length, `
+    /* begin worker prelude */
+    const isWebWorker = (function () { try { return self instanceof WorkerGlobalScope; } catch(e) { return false; } })();
+    if (!isWebWorker) {
+        const _factory = factory;
+        factory = function () {
+            const bundleString = \`const mbgl = (\${_factory})();
+                mbgl._createWorker(self);\`;
+            const mbgl = _factory();
+            mbgl.workerUrl = window.URL.createObjectURL(
+                new Blob([bundleString], { type: 'text/javascript' })
+            );
+            return mbgl;
+        }
+    }
+    /* end worker prelude */
+`);
+
+            return {
+                code: s.toString(),
+                map: s.generateMap()
+            };
+        }
+    };
+}
diff --git a/debug/index.html b/debug/index.html
@@ -14,17 +14,27 @@
 <body>
 <div id='map'></div>
 
-<script src='/dist/mapbox-gl-dev.js'></script>
+<script>
+    console.time('load bundle')
+</script>
+<script src='/dist/mapboxgl-rollup.js'></script>
+<script>
+    console.timeEnd('load bundle')
+</script>
 <script src='/debug/access_token_generated.js'></script>
 <script>
 
+console.time('load map')
 var map = window.map = new mapboxgl.Map({
     container: 'map',
     zoom: 12.5,
     center: [-77.01866, 38.888],
     style: 'mapbox://styles/mapbox/streets-v10',
     hash: true
 });
+map.once('load', () => {
+    console.timeEnd('load map');
+})
 
 </script>
 </body>

diff --git a/dist/mapboxgl-rollup.js b/dist/mapboxgl-rollup.js
diff --git a/package.json b/package.json
@@ -34,7 +34,6 @@
     "package-json-versionify": "^1.0.2",
     "pbf": "^3.0.5",
     "quickselect": "^1.0.0",
-    "rollup-plugin-graph": "^1.2.0",
     "rollup-plugin-json": "^2.3.0",
     "rw": "^1.3.3",
     "shuffle-seed": "^1.1.6",
@@ -96,12 +95,13 @@
     "remark-html": "^5.0.1",
     "remark-react": "^4.0.1",
     "request": "^2.79.0",
-    "rollup": "^0.53.3",
+    "rollup": "^0.56.1",
     "rollup-plugin-browserify-transform": "^1.0.1",
     "rollup-plugin-buble": "^0.18.0",
     "rollup-plugin-commonjs": "^8.2.6",
     "rollup-plugin-flow": "^1.1.1",
     "rollup-plugin-node-resolve": "3.0.0",
+    "rollup-plugin-uglify": "^3.0.0",
     "rollup-plugin-unassert": "^0.1.0",
     "sinon": "^2.1.0",
     "slugg": "^1.2.1",

diff --git a/rollup.config.js b/rollup.config.js
@@ -6,32 +6,42 @@ import unassert from 'rollup-plugin-unassert';
 import json from 'rollup-plugin-json';
 import browserifyPlugin from 'rollup-plugin-browserify-transform';
 import brfs from 'brfs';
+import workerPrelude from './build/rollup-plugin-worker-prelude';
+import uglify from 'rollup-plugin-uglify'
+
+const plugins = [
+    flow(),
+    json(),
+    buble({transforms: {dangerousForOf: true}, objectAssign: "Object.assign"}),
+    unassert(),
+    resolve({
+        browser: true,
+        preferBuiltins: false
+    }),
+    browserifyPlugin(brfs, {
+        include: 'src/shaders/index.js'
+    }),
+    commonjs({
+        namedExports: {
+            '@mapbox/gl-matrix': ['vec3', 'vec4', 'mat2', 'mat3', 'mat4']
+        }
+    }),
+    workerPrelude(),
+]
+
+if (process.env.BUILD === 'production') {
+    plugins.push(uglify());
+}
 
 export default [
     {
         input: 'src/index.js',
         output: {
             name: 'mapboxgl',
             file: 'dist/mapboxgl-rollup.js',
-            format: 'umd'
+            format: 'umd',
+            sourcemap: process.env.BUILD === 'production' ? true : 'inline'
         },
-        plugins: [
-            flow(),
-            json(),
-            buble({transforms: {dangerousForOf: true}, objectAssign: "Object.assign"}),
-            unassert(),
-            resolve({
-                browser: true,
-                preferBuiltins: false
-            }),
-            browserifyPlugin(brfs, {
-                include: 'src/shaders/index.js'
-            }),
-            commonjs({
-                namedExports: {
-                    '@mapbox/gl-matrix': ['vec3', 'vec4', 'mat2', 'mat3', 'mat4']
-                }
-            })
-        ]
+        plugins
     }
 ]
diff --git a/src/data/bucket/line_bucket.js b/src/data/bucket/line_bucket.js
@@ -8,7 +8,8 @@ import { ProgramConfigurationSet } from '../program_configuration';
 import { TriangleIndexArray } from '../index_array_type';
 import loadGeometry from '../load_geometry';
 import EXTENT from '../extent';
-const vectorTileFeatureTypes = require('@mapbox/vector-tile').VectorTileFeature.types;
+import mvt from '@mapbox/vector-tile';
+const vectorTileFeatureTypes = mvt.VectorTileFeature.types;
 import { register } from '../../util/web_worker_transfer';
 
 import type {

diff --git a/src/data/bucket/symbol_bucket.js b/src/data/bucket/symbol_bucket.js
@@ -11,7 +11,8 @@ import transformText from '../../symbol/transform_text';
 import mergeLines from '../../symbol/mergelines';
 import {allowsVerticalWritingMode} from '../../util/script_detection';
 import loadGeometry from '../load_geometry';
-const vectorTileFeatureTypes = require('@mapbox/vector-tile').VectorTileFeature.types;
+import mvt from '@mapbox/vector-tile';
+const vectorTileFeatureTypes = mvt.VectorTileFeature.types;
 import {verticalizedCharacterMap} from '../../util/verticalize_punctuation';
 import Anchor from '../../symbol/anchor';
 import { getSizeData } from '../../symbol/symbol_size';

diff --git a/src/data/segment.js b/src/data/segment.js
@@ -27,7 +27,7 @@ class SegmentVector {
     prepareSegment(numVertices: number, layoutVertexArray: StructArray, indexArray: StructArray): Segment {
         let segment: Segment = this.segments[this.segments.length - 1];
         if (numVertices > MAX_VERTEX_ARRAY_LENGTH) warnOnce(`Max vertices per segment is ${MAX_VERTEX_ARRAY_LENGTH}: bucket requested ${numVertices}`);
-        if (!segment || segment.vertexLength + numVertices > module.exports.MAX_VERTEX_ARRAY_LENGTH) {
+        if (!segment || segment.vertexLength + numVertices > MAX_VERTEX_ARRAY_LENGTH) {
             segment = ({
                 vertexOffset: layoutVertexArray.length,
                 primitiveOffset: indexArray.length,

diff --git a/src/index.js b/src/index.js
@@ -19,6 +19,7 @@ import Point from '@mapbox/point-geometry';
 import Evented from './util/evented';
 import config from './util/config';
 import {setRTLTextPlugin} from './source/rtl_text_plugin';
+import createWorker from './source/worker';
 
 const exported = {
     version,
@@ -54,7 +55,9 @@ const exported = {
 
     set accessToken(token: string) {
         config.ACCESS_TOKEN = token;
-    }
+    },
+
+    _createWorker: createWorker
 };
 
 /**
@@ -91,4 +94,3 @@ const exported = {
  */
 
 export default exported;
-export { version, supported, setRTLTextPlugin, Map, NavigationControl, GeolocateControl, AttributionControl, ScaleControl, FullscreenControl, Popup, Marker, Style, LngLat, LngLatBounds, Point, Evented, config };
diff --git a/src/source/geojson_wrapper.js b/src/source/geojson_wrapper.js
@@ -2,7 +2,8 @@
 
 import Point from '@mapbox/point-geometry';
 
-const toGeoJSON = require('@mapbox/vector-tile').VectorTileFeature.prototype.toGeoJSON;
+import mvt from '@mapbox/vector-tile';
+const toGeoJSON = mvt.VectorTileFeature.prototype.toGeoJSON;
 import EXTENT from '../data/extent';
 
 // The feature type used by geojson-vt and supercluster. Should be extracted to

diff --git a/src/style-spec/expression/parsing_context.js b/src/style-spec/expression/parsing_context.js
@@ -9,6 +9,10 @@ import Assertion from './definitions/assertion';
 import ArrayAssertion from './definitions/array';
 import Coercion from './definitions/coercion';
 import EvaluationContext from './evaluation_context';
+import {CompoundExpression} from './compound_expression';
+import {isGlobalPropertyConstant, isFeatureConstant} from './is_constant';
+import Var from './definitions/var';
+
 
 import type {Expression, ExpressionRegistry} from './expression';
 import type {Type} from './types';
@@ -183,10 +187,6 @@ export default ParsingContext;
 
 function isConstant(expression: Expression) {
     // requires within function body to workaround circular dependency
-    const {CompoundExpression} = require('./compound_expression');
-    const {isGlobalPropertyConstant, isFeatureConstant} = require('./is_constant');
-    const Var = require('./definitions/var');
-
     if (expression instanceof Var) {
         return false;
     } else if (expression instanceof CompoundExpression && expression.name === 'error') {

diff --git a/src/style-spec/migrate.js b/src/style-spec/migrate.js
@@ -1,9 +1,11 @@
 
+import migrateToV8 from './migrate/v8';
+
 export default function(style) {
     let migrated = false;
 
     if (style.version === 7 || style.version === 8) {
-        style = require('./migrate/v8')(style);
+        style = migrateToV8(style);
         migrated = true;
     }
 
@@ -12,4 +14,4 @@ export default function(style) {
     }
 
     return style;
-};
+}
diff --git a/src/style-spec/reference/latest.js b/src/style-spec/reference/latest.js
@@ -1,2 +1,3 @@
 
-export default require('./v8.json');
+import spec from './v8.json';
+export default spec;
diff --git a/src/style-spec/validate/latest.js b/src/style-spec/validate/latest.js
@@ -1,2 +1,3 @@
 
-export default require('../validate_style.min');
+import validateStyle from '../validate_style.min';
+export default validateStyle;
diff --git a/src/style-spec/validate_style.js b/src/style-spec/validate_style.js
@@ -2,6 +2,7 @@
 import validateStyleMin from './validate_style.min';
 import ParsingError from './error/parsing_error';
 import jsonlint from 'jsonlint-lines-primitives';
+import {v8} from './style-spec';
 
 /**
  * Validate a Mapbox GL style against the style specification.
@@ -20,8 +21,6 @@ import jsonlint from 'jsonlint-lines-primitives';
  */
 
 export default function validateStyle(style, styleSpec) {
-    const index = require('./style-spec');
-
     if (style instanceof String || typeof style === 'string' || style instanceof Buffer) {
         try {
             style = jsonlint.parse(style.toString());
@@ -30,10 +29,10 @@ export default function validateStyle(style, styleSpec) {
         }
     }
 
-    styleSpec = styleSpec || index.v8;
+    styleSpec = styleSpec || v8;
 
     return validateStyleMin(style, styleSpec);
-};
+}
 
 export const source = validateStyleMin.source;
 export const light = validateStyleMin.light;

diff --git a/src/style-spec/validate_style.min.js b/src/style-spec/validate_style.min.js
@@ -4,6 +4,13 @@ import validate from './validate/validate';
 import latestStyleSpec from './reference/latest';
 import validateGlyphsURL from './validate/validate_glyphs_url';
 
+import validateSource from './validate/validate_source';
+import validateLight from './validate/validate_light';
+import validateLayer from './validate/validate_layer';
+import validateFilter from './validate/validate_filter';
+import validatePaintProperty from './validate/validate_paint_property';
+import validateLayoutProperty from './validate/validate_layout_property';
+
 /**
  * Validate a Mapbox GL style against the style specification. This entrypoint,
  * `mapbox-gl-style-spec/lib/validate_style.min`, is designed to produce as
@@ -50,12 +57,12 @@ function validateStyleMin(style, styleSpec) {
     return sortErrors(errors);
 }
 
-validateStyleMin.source = wrapCleanErrors(require('./validate/validate_source'));
-validateStyleMin.light = wrapCleanErrors(require('./validate/validate_light'));
-validateStyleMin.layer = wrapCleanErrors(require('./validate/validate_layer'));
-validateStyleMin.filter = wrapCleanErrors(require('./validate/validate_filter'));
-validateStyleMin.paintProperty = wrapCleanErrors(require('./validate/validate_paint_property'));
-validateStyleMin.layoutProperty = wrapCleanErrors(require('./validate/validate_layout_property'));
+validateStyleMin.source = wrapCleanErrors(validateSource);
+validateStyleMin.light = wrapCleanErrors(validateLight);
+validateStyleMin.layer = wrapCleanErrors(validateLayer);
+validateStyleMin.filter = wrapCleanErrors(validateFilter);
+validateStyleMin.paintProperty = wrapCleanErrors(validatePaintProperty);
+validateStyleMin.layoutProperty = wrapCleanErrors(validateLayoutProperty);
 
 function sortErrors(errors) {
     return [].concat(errors).sort((a, b) => {

diff --git a/src/style/create_style_layer.js b/src/style/create_style_layer.js
@@ -0,0 +1,28 @@
+// @flow
+
+import circle from './style_layer/circle_style_layer';
+import heatmap from './style_layer/heatmap_style_layer';
+import hillshade from './style_layer/hillshade_style_layer';
+import fill from './style_layer/fill_style_layer';
+import fillExtrusion from './style_layer/fill_extrusion_style_layer';
+import line from './style_layer/line_style_layer';
+import symbol from './style_layer/symbol_style_layer';
+import background from './style_layer/background_style_layer';
+import raster from './style_layer/raster_style_layer';
+
+const subclasses = {
+    circle,
+    heatmap,
+    hillshade,
+    fill,
+    'fill-extrusion': fillExtrusion,
+    line,
+    symbol,
+    background,
+    raster
+};
+
+export default function createStyleLayer(layer: LayerSpecification) {
+    return new subclasses[layer.type](layer);
+}
+
diff --git a/src/style/light.js b/src/style/light.js
@@ -4,7 +4,7 @@ import styleSpec from '../style-spec/reference/latest';
 
 import { endsWith, extend } from '../util/util';
 import Evented from '../util/evented';
-import validateStyle from './validate_style';
+import validateStyle, {emitValidationErrors} from './validate_style';
 import { sphericalToCartesian } from '../util/util';
 import Color from '../style-spec/util/color';
 import interpolate from '../style-spec/util/interpolate';
@@ -109,7 +109,7 @@ class Light extends Evented {
     }
 
     _validate(validate: Function, value: mixed) {
-        return validateStyle.emitErrors(this, validate.call(validateStyle, extend({
+        return emitValidationErrors(this, validate.call(validateStyle, extend({
             value: value,
             // Workaround for https://github.com/mapbox/mapbox-gl-js/issues/2407
             style: {glyphs: true, sprite: true},