Chargement différé de Monaco Editor

package.json

@@ -32,10 +32,10 @@
 		"raven-for-redux": "^1.3.1",
 		"raven-js": "^3.26.4",
 		"rc-progress": "^2.2.6",
-		"react": "^16.5.2",
+		"react": "^16.6.1",
 		"react-addons-css-transition-group": "^15.6.2",
 		"react-color": "^2.14.0",
-		"react-dom": "^16.5.2",
+		"react-dom": "^16.6.1",
 		"react-easy-emoji": "^1.2.0",
 		"react-helmet": "^5.2.0",
 		"react-highlight-words": "^0.11.0",

source/components/rule/RuleSource.js

@@ -1,10 +1,11 @@
-import React, { Component } from 'react'
+import React, { Component, Suspense } from 'react'
 import yaml from 'js-yaml'
 import rules from 'Règles/base.yaml'
 import emoji from 'react-easy-emoji'
-import MonacoEditor from 'react-monaco-editor'
 import { buildDottedName } from 'Engine/rules'
 
+let MonacoEditor = React.lazy(() => import('react-monaco-editor'))
+
 export default class Source extends Component {
 	render() {
 		let { dottedName } = this.props,
@@ -16,12 +17,14 @@ export default class Source extends Component {
 					{emoji('⛰️ ')}
 					Source de <code>{dottedName}</code>
 				</h2>
-				<MonacoEditor
-					height="800"
-					width="1000"
-					language={'yaml'}
-					value={yaml.safeDump(source)}
-				/>
+				<Suspense fallback={<div>Chargement du code source...</div>}>
+					<MonacoEditor
+						height="800"
+						width="1000"
+						language={'yaml'}
+						value={yaml.safeDump(source)}
+					/>
+				</Suspense>
 			</div>
 		)
 	}

yarn.lock

@@ -6656,14 +6656,14 @@ react-color@^2.14.0:
     reactcss "^1.2.0"
     tinycolor2 "^1.4.1"
 
-react-dom@^16.5.2:
-  version "16.6.0"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.6.0.tgz#6375b8391e019a632a89a0988bce85f0cc87a92f"
+react-dom@^16.6.1:
+  version "16.6.1"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.6.1.tgz#5476e08694ae504ae385a28b62ecc4fe3a29add9"
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    scheduler "^0.10.0"
+    scheduler "^0.11.0"
 
 react-easy-emoji@^1.2.0:
   version "1.2.0"
@@ -6850,14 +6850,14 @@ react-virtualized@^9.20.0:
     prop-types "^15.6.0"
     react-lifecycles-compat "^3.0.4"
 
-react@^16.5.2:
-  version "16.6.0"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.6.0.tgz#b34761cfaf3e30f5508bc732fb4736730b7da246"
+react@^16.6.1:
+  version "16.6.1"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.6.1.tgz#ee2aef4f0a09e494594882029821049772f915fe"
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    scheduler "^0.10.0"
+    scheduler "^0.11.0"
 
 reactcss@^1.2.0:
   version "1.2.3"
@@ -7345,6 +7345,13 @@ scheduler@^0.10.0:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
+scheduler@^0.11.0:
+  version "0.11.0"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.11.0.tgz#def1f1bfa6550cc57981a87106e65e8aea41a6b5"
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+
 schema-utils@^0.4.0, schema-utils@^0.4.4, schema-utils@^0.4.5:
   version "0.4.7"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.4.7.tgz#ba74f597d2be2ea880131746ee17d0a093c68187"