Réduction et découpage du bundle JS

config/webpack.config.dev.js

@@ -4,9 +4,9 @@ var HtmlWebpackPlugin = require('html-webpack-plugin');
 var CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 var InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 var WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin');
+
 var getClientEnvironment = require('./env');
 var paths = require('./paths');
-const path = require('path');
 
 // Webpack uses `publicPath` to determine where the app is being served from.
 // In development, we always serve from the root. This makes config easier.
@@ -42,8 +42,6 @@ module.exports = {
     // require.resolve('webpack-dev-server/client') + '?/',
     // require.resolve('webpack/hot/dev-server'),
     require.resolve('react-dev-utils/webpackHotDevClient'),
-    // We ship a few polyfills by default:
-    require.resolve('./polyfills'),
     // Finally, this is your app's code:
     paths.appIndexJs
     // We include the app code last so that if there is a runtime error during
@@ -172,11 +170,4 @@ module.exports = {
     // See https://github.com/facebookincubator/create-react-app/issues/186
     new WatchMissingNodeModulesPlugin(paths.appNodeModules)
   ],
-  // Some libraries import Node modules but don't use them in the browser.
-  // Tell Webpack to provide empty mocks for them so importing them works.
-  node: {
-    fs: 'empty',
-    net: 'empty',
-    tls: 'empty'
-  }
 };

config/webpack.config.prod.js

@@ -2,6 +2,7 @@ var webpack = require('webpack');
 var HtmlWebpackPlugin = require('html-webpack-plugin');
 var InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 var url = require('url');
+
 var paths = require('./paths');
 var getClientEnvironment = require('./env');
 
@@ -48,11 +49,26 @@ module.exports = {
   // We generate sourcemaps in production. This is slow but gives good results.
   // You can exclude the *.map files from the build during deployment.
   devtool: 'source-map',
-  // In production, we only want to load the polyfills and the app code.
-  entry: [
-    require.resolve('./polyfills'),
-    paths.appIndexJs
-  ],
+
+  entry: {
+    app: paths.appIndexJs,
+    vendor: [
+      'preact',
+      'preact-compat',
+      'react-leaflet',
+      'react-chartjs-2',
+      'marked',
+      'reactable',
+      'moment',
+      'react-router',
+      'react-paginate',
+      'react-document-title',
+      'react-router-scroll',
+      'piwik-react-router',
+      'qs',
+    ],
+  },
+
   output: {
     // The build folder.
     path: paths.appBuild,
@@ -137,6 +153,13 @@ module.exports = {
   },
 
   plugins: [
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'vendor',
+      minChunks: Infinity,
+    }),
+    new webpack.optimize.CommonsChunkPlugin({
+      names: 'manifest',
+    }),
     new webpack.LoaderOptionsPlugin({
       minimize: true
     }),
@@ -187,11 +210,7 @@ module.exports = {
       }
     }),
   ],
-  // Some libraries import Node modules but don't use them in the browser.
-  // Tell Webpack to provide empty mocks for them so importing them works.
   node: {
-    fs: 'empty',
-    net: 'empty',
-    tls: 'empty'
+    Buffer: false, // Currently css-loader exports an unused function which rely on Buffer
   }
 };

package.json

@@ -20,7 +20,6 @@
     "connect-history-api-fallback": "^1.3.0",
     "css-loader": "^0.26.1",
     "detect-port": "^1.0.0",
-    "dotenv": "^2.0.0",
     "enzyme": "^2.4.1",
     "eslint": "^3.8.1",
     "eslint-config-react-app": "^0.5.0",
@@ -41,15 +40,13 @@
     "ignore-styles": "^5.0.1",
     "jsdom": "^9.6.0",
     "mocha": "^3.1.2",
-    "object-assign": "^4.1.0",
     "postcss": "^5.2.6",
     "postcss-browser-reporter": "^0.5.0",
     "postcss-cssnext": "^2.9.0",
     "postcss-import": "^9.0.0",
     "postcss-loader": "^1.2.0",
     "postcss-reporter": "^3.0.0",
     "postcss-url": "^5.1.2",
-    "promise": "^7.1.1",
     "proxyquire": "^1.7.10",
     "react-addons-test-utils": "^15.4",
     "react-dev-utils": "^0.5.0",
@@ -80,8 +77,7 @@
     "react-router": "^3.0.1",
     "react-router-scroll": "^0.4.1",
     "reactable": "^0.14.1",
-    "underscore.string": "^3.3.4",
-    "whatwg-fetch": "^2.0.1"
+    "underscore.string": "^3.3.4"
   },
   "scripts": {
     "start": "node scripts/start.js",

public/index.html

@@ -30,7 +30,7 @@
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.4/semantic.min.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.2/leaflet.css">
-    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,modernizr:es6string,modernizr:es6array,es7"></script>
+    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,modernizr:es6string,modernizr:es6array,es7,fetch"></script>
   </head>
   <body>
     <!--[if lt IE 10]>

scripts/build.js

@@ -2,12 +2,6 @@
 // Do this as the first thing so that any code reading it knows the right env.
 process.env.NODE_ENV = 'production';
 
-// Load environment variables from .env file. Surpress warnings using silent
-// if this file is missing. dotenv will never modify any environment variables
-// that have already been set.
-// https://github.com/motdotla/dotenv
-require('dotenv').config({silent: true});
-
 var chalk = require('chalk');
 var fs = require('fs-extra');
 var path = require('path');

scripts/start.js

@@ -1,12 +1,6 @@
 /* eslint no-console: off */
 process.env.NODE_ENV = 'development';
 
-// Load environment variables from .env file. Surpress warnings using silent
-// if this file is missing. dotenv will never modify any environment variables
-// that have already been set.
-// https://github.com/motdotla/dotenv
-require('dotenv').config({silent: true});
-
 var chalk = require('chalk');
 var webpack = require('webpack');
 var WebpackDevServer = require('webpack-dev-server');

scripts/test.js

@@ -1,11 +1,6 @@
 process.env.NODE_ENV = 'test';
 process.env.PUBLIC_URL = '';
 
-// Load environment variables from .env file. Surpress warnings using silent
-// if this file is missing. dotenv will never modify any environment variables
-// that have already been set.
-// https://github.com/motdotla/dotenv
-require('dotenv').config({silent: true});
 require('babel-register')();
 
 var jsdom = require('jsdom').jsdom;

src/helpers/withResolver.js

@@ -1,6 +1,5 @@
 import React, { Component } from 'react'
 import { cancelAllPromises, waitForDataAndSetState } from './components'
-import Promise from 'bluebird'
 
 import Errors from '../components/Errors/Errors'
 import ContentLoader from '../components/Loader/ContentLoader'
@@ -14,9 +13,9 @@ export default function withResolver(WrappedComponent, dependencies) {
     }
 
     componentDidMount() {
-      const dependenciesPromise = Promise.map(Object.keys(dependencies), dependencyName => {
+      const dependenciesPromise = Promise.all(Object.keys(dependencies).map(dependencyName => {
         return waitForDataAndSetState(dependencies[dependencyName], this, dependencyName)
-      })
+      }))
 
       dependenciesPromise.then(() => this.setState({ dependenciesReady: true }))
 

src/modules/Datasets/components/DatasetDescription/DatasetDescription.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { prune } from 'underscore.string'
+import prune from 'underscore.string/prune'
 
 import MarkdownViewer from '../Markdown/MarkdownViewer'
 

src/modules/Datasets/components/Downloads/Download.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { strRightBack } from 'underscore.string'
+import strRightBack from 'underscore.string/strRightBack'
 import { download, container, title, viewerButton, formats } from './Download.css'
 
 const FORMATS = [

yarn.lock

@@ -1752,10 +1752,6 @@ domutils@1.5.1, domutils@^1.5.1:
     dom-serializer "0"
     domelementtype "1"
 
-dotenv@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-2.0.0.tgz#bd759c357aaa70365e01c96b7b0bec08a6e0d949"
-
 duplexer@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.1.tgz#ace6ff808c1ce66b57d1ebf97977acb02334cfc1"
@@ -5863,7 +5859,7 @@ whatwg-encoding@^1.0.1:
   dependencies:
     iconv-lite "0.4.13"
 
-whatwg-fetch@>=0.10.0, whatwg-fetch@^2.0.1:
+whatwg-fetch@>=0.10.0:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz#9c84ec2dcf68187ff00bc64e1274b442176e1c84"