Remove dependency to event system on the server (#10173)
I do this by splitting ReactDOMInjection into generic and client-only injection.
Dan Abramov committed
Jul 13, 2017 at 19:32 UTC
7dd7c1702b0f71ea997c11dc4d72ee030ea8764c
5 files changed
+93
-60
scripts/rollup/results.json
+27
-27
@@ -25,28 +25,28 @@
25
"gzip": 7214
26
},
27
"react-dom.development.js (UMD_DEV)": {
28
- "size": 623332,
29
- "gzip": 142653
28
+ "size": 623782,
29
+ "gzip": 142020
30
},
31
"react-dom.production.min.js (UMD_PROD)": {
32
- "size": 126056,
32
+ "size": 126115,
33
"gzip": 39910
34
},
35
"react-dom.development.js (NODE_DEV)": {
36
- "size": 581993,
37
- "gzip": 132990
36
+ "size": 582443,
37
+ "gzip": 132535
38
},
39
"react-dom.production.min.js (NODE_PROD)": {
40
- "size": 122421,
41
- "gzip": 38581
40
+ "size": 122480,
41
+ "gzip": 38633
42
},
43
"ReactDOMFiber-dev.js (FB_DEV)": {
44
- "size": 581277,
45
- "gzip": 133016
44
+ "size": 581728,
45
+ "gzip": 132560
46
},
47
"ReactDOMFiber-prod.js (FB_PROD)": {
48
- "size": 427011,
49
- "gzip": 96971
48
+ "size": 427202,
49
+ "gzip": 96685
50
},
51
"react-dom-test-utils.development.js (NODE_DEV)": {
52
"size": 53430,
@@ -65,20 +65,20 @@
65
"gzip": 81957
66
},
67
"react-dom-server.development.js (UMD_DEV)": {
68
- "size": 308607,
69
- "gzip": 77369
68
+ "size": 157366,
69
+ "gzip": 39194
70
},
71
"react-dom-server.production.min.js (UMD_PROD)": {
72
- "size": 65509,
73
- "gzip": 22270
72
+ "size": 26047,
73
+ "gzip": 9845
74
},
75
"react-dom-server.development.js (NODE_DEV)": {
76
- "size": 267453,
77
- "gzip": 67912
76
+ "size": 124505,
77
+ "gzip": 31491
78
},
79
"react-dom-server.production.min.js (NODE_PROD)": {
80
- "size": 61847,
81
- "gzip": 20971
80
+ "size": 23614,
81
+ "gzip": 8897
82
},
83
"ReactDOMServerStream-dev.js (FB_DEV)": {
84
"size": 264750,
@@ -181,20 +181,20 @@
181
"gzip": 50920
182
},
183
"ReactDOMServer-dev.js (FB_DEV)": {
184
- "size": 266904,
185
- "gzip": 67836
184
+ "size": 123959,
185
+ "gzip": 31418
186
},
187
"ReactDOMServer-prod.js (FB_PROD)": {
188
- "size": 197089,
189
- "gzip": 50856
188
+ "size": 65096,
189
+ "gzip": 17753
190
},
191
"react-dom-node-stream.development.js (NODE_DEV)": {
192
- "size": 269147,
193
- "gzip": 68409
192
+ "size": 126199,
193
+ "gzip": 31993
194
},
195
"react-dom-node-stream.production.min.js (NODE_PROD)": {
196
- "size": 62784,
197
- "gzip": 21287
196
+ "size": 24554,
197
+ "gzip": 9231
198
},
199
"ReactDOMNodeStream-dev.js (FB_DEV)": {
200
"size": 264918,
src/renderers/dom/ReactDOMStackEntry.js
+2
@@ -15,6 +15,7 @@
15
16
var ReactDOMComponentTree = require('ReactDOMComponentTree');
17
var ReactDOMInjection = require('ReactDOMInjection');
18
+var ReactDOMClientInjection = require('ReactDOMClientInjection');
19
var ReactDOMStackInjection = require('ReactDOMStackInjection');
20
var ReactGenericBatching = require('ReactGenericBatching');
21
var ReactMount = require('ReactMount');
@@ -27,6 +28,7 @@ var getHostComponentFromComposite = require('getHostComponentFromComposite');
28
var warning = require('fbjs/lib/warning');
29
30
ReactDOMInjection.inject();
31
+ReactDOMClientInjection.inject();
32
ReactDOMStackInjection.inject();
33
34
var ReactDOMStack = {
src/renderers/dom/fiber/ReactDOMFiberEntry.js
+2
@@ -22,6 +22,7 @@ var ReactFeatureFlags = require('ReactFeatureFlags');
22
var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');
23
var ReactDOMFiberComponent = require('ReactDOMFiberComponent');
24
var ReactDOMFrameScheduling = require('ReactDOMFrameScheduling');
25
+var ReactDOMClientInjection = require('ReactDOMClientInjection');
26
var ReactDOMInjection = require('ReactDOMInjection');
27
var ReactGenericBatching = require('ReactGenericBatching');
28
var ReactFiberReconciler = require('ReactFiberReconciler');
@@ -64,6 +65,7 @@ if (__DEV__) {
65
var {updatedAncestorInfo} = validateDOMNesting;
66
}
67
68
+ReactDOMClientInjection.inject();
69
ReactDOMInjection.inject();
70
ReactControlledComponent.injection.injectFiberControlledHostComponent(
71
ReactDOMFiberComponent,
src/renderers/dom/shared/ReactDOMClientInjection.js
new
+62
@@ -0,0 +1,62 @@
1
+/**
2
+ * Copyright 2013-present, Facebook, Inc.
3
+ * All rights reserved.
4
+ *
5
+ * This source code is licensed under the BSD-style license found in the
6
+ * LICENSE file in the root directory of this source tree. An additional grant
7
+ * of patent rights can be found in the PATENTS file in the same directory.
8
+ *
9
+ * @providesModule ReactDOMClientInjection
10
+ */
11
+
12
+'use strict';
13
+
14
+var BeforeInputEventPlugin = require('BeforeInputEventPlugin');
15
+var ChangeEventPlugin = require('ChangeEventPlugin');
16
+var DOMEventPluginOrder = require('DOMEventPluginOrder');
17
+var EnterLeaveEventPlugin = require('EnterLeaveEventPlugin');
18
+var EventPluginHub = require('EventPluginHub');
19
+var EventPluginUtils = require('EventPluginUtils');
20
+var ReactBrowserEventEmitter = require('ReactBrowserEventEmitter');
21
+var ReactDOMComponentTree = require('ReactDOMComponentTree');
22
+var ReactDOMEventListener = require('ReactDOMEventListener');
23
+var SelectEventPlugin = require('SelectEventPlugin');
24
+var SimpleEventPlugin = require('SimpleEventPlugin');
25
+
26
+var alreadyInjected = false;
27
+
28
+function inject() {
29
+ if (alreadyInjected) {
30
+ // TODO: This is currently true because these injections are shared between
31
+ // the client and the server package. They should be built independently
32
+ // and not share any injection state. Then this problem will be solved.
33
+ return;
34
+ }
35
+ alreadyInjected = true;
36
+
37
+ ReactDOMEventListener.setHandleTopLevel(
38
+ ReactBrowserEventEmitter.handleTopLevel,
39
+ );
40
+
41
+ /**
42
+ * Inject modules for resolving DOM hierarchy and plugin ordering.
43
+ */
44
+ EventPluginHub.injection.injectEventPluginOrder(DOMEventPluginOrder);
45
+ EventPluginUtils.injection.injectComponentTree(ReactDOMComponentTree);
46
+
47
+ /**
48
+ * Some important event plugins included by default (without having to require
49
+ * them).
50
+ */
51
+ EventPluginHub.injection.injectEventPluginsByName({
52
+ SimpleEventPlugin: SimpleEventPlugin,
53
+ EnterLeaveEventPlugin: EnterLeaveEventPlugin,
54
+ ChangeEventPlugin: ChangeEventPlugin,
55
+ SelectEventPlugin: SelectEventPlugin,
56
+ BeforeInputEventPlugin: BeforeInputEventPlugin,
57
+ });
58
+}
59
+
60
+module.exports = {
61
+ inject: inject,
62
+};
src/renderers/dom/shared/ReactDOMInjection.js
-33
@@ -12,20 +12,9 @@
12
'use strict';
13
14
var ARIADOMPropertyConfig = require('ARIADOMPropertyConfig');
15
-var BeforeInputEventPlugin = require('BeforeInputEventPlugin');
15
var DOMProperty = require('DOMProperty');
17
-var ChangeEventPlugin = require('ChangeEventPlugin');
18
-var DOMEventPluginOrder = require('DOMEventPluginOrder');
19
-var EnterLeaveEventPlugin = require('EnterLeaveEventPlugin');
20
-var EventPluginHub = require('EventPluginHub');
21
-var EventPluginUtils = require('EventPluginUtils');
16
var HTMLDOMPropertyConfig = require('HTMLDOMPropertyConfig');
23
-var ReactBrowserEventEmitter = require('ReactBrowserEventEmitter');
24
-var ReactDOMComponentTree = require('ReactDOMComponentTree');
25
-var ReactDOMEventListener = require('ReactDOMEventListener');
17
var SVGDOMPropertyConfig = require('SVGDOMPropertyConfig');
27
-var SelectEventPlugin = require('SelectEventPlugin');
28
-var SimpleEventPlugin = require('SimpleEventPlugin');
18
19
var alreadyInjected = false;
20
@@ -38,28 +27,6 @@ function inject() {
27
}
28
alreadyInjected = true;
29
41
- ReactDOMEventListener.setHandleTopLevel(
42
- ReactBrowserEventEmitter.handleTopLevel,
43
- );
44
-
45
- /**
46
- * Inject modules for resolving DOM hierarchy and plugin ordering.
47
- */
48
- EventPluginHub.injection.injectEventPluginOrder(DOMEventPluginOrder);
49
- EventPluginUtils.injection.injectComponentTree(ReactDOMComponentTree);
50
-
51
- /**
52
- * Some important event plugins included by default (without having to require
53
- * them).
54
- */
55
- EventPluginHub.injection.injectEventPluginsByName({
56
- SimpleEventPlugin: SimpleEventPlugin,
57
- EnterLeaveEventPlugin: EnterLeaveEventPlugin,
58
- ChangeEventPlugin: ChangeEventPlugin,
59
- SelectEventPlugin: SelectEventPlugin,
60
- BeforeInputEventPlugin: BeforeInputEventPlugin,
61
- });
62
-
30
DOMProperty.injection.injectDOMPropertyConfig(ARIADOMPropertyConfig);
31
DOMProperty.injection.injectDOMPropertyConfig(HTMLDOMPropertyConfig);
32
DOMProperty.injection.injectDOMPropertyConfig(SVGDOMPropertyConfig);