Prevent fiber from leaking into RN stack renderer (#9775)
Since stripEnvVariables was used to replace __DEV__ references, I assumed it (and other plugins) we run before requires statements were processed. Obviously I was wrong 😬 and as a result, the RN Stack and Fiber builds were way too large. This is an attempt to mimic the approach taken with DOM renderer and stub out modules that we explicitly don't want to include. The alternative to this would have been to fork findNodeHandle, NativeMethodsMixin, ReactNativeBaseComponent, etc. and essentially avoid using the feature flag. That didn't seem tenable. The previous injection approach also doesn't work here because the circular references it resulted in caused Rollup to choke when creating the modules.
Brian Vaughn committed
May 25, 2017 at 18:14 UTC
824d22c9d986bca1571350facd560f67d7b18e5a
4 files changed
+55
-25
scripts/rollup/build.js
+9
-3
@@ -289,7 +289,8 @@ function getPlugins(
289
hasteName,
290
isRenderer,
291
manglePropertiesOnProd,
292
- useFiber
292
+ useFiber,
293
+ modulesToStub
294
) {
295
const plugins = [
296
babel(updateBabelConfig(babelOpts, bundleType)),
@@ -298,7 +299,11 @@ function getPlugins(
299
),
300
];
301
301
- const replaceModules = Modules.getDefaultReplaceModules(bundleType);
302
+ const replaceModules = Modules.getDefaultReplaceModules(
303
+ bundleType,
304
+ modulesToStub
305
+ );
306
+
307
// We have to do this check because Rollup breaks on empty object.
308
// TODO: file an issue with rollup-plugin-replace.
309
if (Object.keys(replaceModules).length > 0) {
@@ -420,7 +425,8 @@ function createBundle(bundle, bundleType) {
425
bundle.hasteName,
426
bundle.isRenderer,
427
bundle.manglePropertiesOnProd,
423
- bundle.useFiber
428
+ bundle.useFiber,
429
+ bundle.modulesToStub
430
),
431
})
432
.then(result =>
scripts/rollup/bundles.js
+11
@@ -317,6 +317,12 @@ const bundles = [
317
'src/shared/**/*.js',
318
],
319
useFiber: false,
320
+ modulesToStub: [
321
+ "'createReactNativeFiberComponentClass'",
322
+ "'ReactNativeFiberRenderer'",
323
+ "'findNumericNodeHandleFiber'",
324
+ "'ReactNativeFiber'",
325
+ ],
326
},
327
{
328
babelOpts: babelOptsReact,
@@ -353,6 +359,11 @@ const bundles = [
359
'src/shared/**/*.js',
360
],
361
useFiber: true,
362
+ modulesToStub: [
363
+ "'createReactNativeComponentClass'",
364
+ "'findNumericNodeHandleStack'",
365
+ "'ReactNativeStack'",
366
+ ],
367
},
368
369
/******* React Test Renderer *******/
scripts/rollup/modules.js
+15
-2
@@ -265,6 +265,18 @@ function replaceLegacyModuleAliases(bundleType) {
265
}
266
}
267
268
+function replaceBundleStubModules(bundleModulesToStub) {
269
+ const stubbedModules = {};
270
+
271
+ if (Array.isArray(bundleModulesToStub)) {
272
+ bundleModulesToStub.forEach(module => {
273
+ stubbedModules[module] = devOnlyModuleStub;
274
+ });
275
+ }
276
+
277
+ return stubbedModules;
278
+}
279
+
280
function getAliases(paths, bundleType, isRenderer, extractErrors) {
281
return Object.assign(
282
createModuleMap(
@@ -278,12 +290,13 @@ function getAliases(paths, bundleType, isRenderer, extractErrors) {
290
);
291
}
292
281
-function getDefaultReplaceModules(bundleType) {
293
+function getDefaultReplaceModules(bundleType, bundleModulesToStub) {
294
return Object.assign(
295
{},
296
replaceFbjsModuleAliases(bundleType),
297
replaceDevOnlyStubbedModules(bundleType),
286
- replaceLegacyModuleAliases(bundleType)
298
+ replaceLegacyModuleAliases(bundleType),
299
+ replaceBundleStubModules(bundleModulesToStub)
300
);
301
}
302
scripts/rollup/results.json
+20
-20
@@ -17,12 +17,12 @@
17
"gzip": 38682
18
},
19
"react-dom-server.development.js (UMD_DEV)": {
20
- "size": 525896,
21
- "gzip": 126687
20
+ "size": 525947,
21
+ "gzip": 126689
22
},
23
"react-dom-server.production.min.js (UMD_PROD)": {
24
- "size": 111581,
25
- "gzip": 34959
24
+ "size": 111505,
25
+ "gzip": 34936
26
},
27
"react-art.development.js (UMD_DEV)": {
28
"size": 349191,
@@ -73,12 +73,12 @@
73
"gzip": 94091
74
},
75
"react-dom-server.development.js (NODE_DEV)": {
76
- "size": 474459,
77
- "gzip": 114087
76
+ "size": 474510,
77
+ "gzip": 114092
78
},
79
"react-dom-server.production.min.js (NODE_PROD)": {
80
- "size": 105956,
81
- "gzip": 32782
80
+ "size": 105880,
81
+ "gzip": 32763
82
},
83
"ReactDOMServerStack-dev.js (FB_DEV)": {
84
"size": 455996,
@@ -157,28 +157,28 @@
157
"gzip": 2234
158
},
159
"ReactDOMServerStream-dev.js (FB_DEV)": {
160
- "size": 472928,
161
- "gzip": 113934
160
+ "size": 472979,
161
+ "gzip": 113937
162
},
163
"ReactDOMServerStream-prod.js (FB_PROD)": {
164
- "size": 345931,
165
- "gzip": 83505
164
+ "size": 345258,
165
+ "gzip": 83320
166
},
167
"ReactNativeStack-dev.js (RN_DEV)": {
168
- "size": 351200,
169
- "gzip": 63905
168
+ "size": 183071,
169
+ "gzip": 35604
170
},
171
"ReactNativeStack-prod.js (RN_PROD)": {
172
- "size": 269602,
173
- "gzip": 46634
172
+ "size": 131236,
173
+ "gzip": 24775
174
},
175
"ReactNativeFiber-dev.js (RN_DEV)": {
176
- "size": 328134,
177
- "gzip": 59569
176
+ "size": 271213,
177
+ "gzip": 49113
178
},
179
"ReactNativeFiber-prod.js (RN_PROD)": {
180
- "size": 248866,
181
- "gzip": 43107
180
+ "size": 207321,
181
+ "gzip": 35756
182
}
183
}
184
}
\ No newline at end of file