Warn that ReactPerf does not work in the production build (#6884, #6975)
Fixes #6871
Dan Abramov committed
Jun 6, 2016 at 20:37 UTC
f71dfbcbf020bea806827ef8b8e8a8743de8d615
3 files changed
+104
-9
src/renderers/shared/ReactDebugTool.js
+1
-3
@@ -208,9 +208,7 @@ var ReactDebugTool = {
208
}
209
},
210
getFlushHistory() {
211
- if (__DEV__) {
212
- return flushHistory;
213
- }
211
+ return flushHistory;
212
},
213
onBeginFlush() {
214
if (__DEV__) {
src/renderers/shared/ReactPerf.js
+80
-6
@@ -13,17 +13,41 @@
13
14
var ReactDebugTool = require('ReactDebugTool');
15
var warning = require('warning');
16
+var alreadyWarned = false;
17
18
function roundFloat(val, base = 2) {
19
var n = Math.pow(10, base);
20
return Math.floor(val * n) / n;
21
}
22
22
-function getFlushHistory() {
23
+function warnInProduction() {
24
+ if (alreadyWarned) {
25
+ return;
26
+ }
27
+ alreadyWarned = true;
28
+ if (typeof console !== 'undefined') {
29
+ console.error(
30
+ 'ReactPerf is not supported in the production builds of React. ' +
31
+ 'To collect measurements, please use the development build of React instead.'
32
+ );
33
+ }
34
+}
35
+
36
+function getLastMeasurements() {
37
+ if (!__DEV__) {
38
+ warnInProduction();
39
+ return [];
40
+ }
41
+
42
return ReactDebugTool.getFlushHistory();
43
}
44
26
-function getExclusive(flushHistory = getFlushHistory()) {
45
+function getExclusive(flushHistory = getLastMeasurements()) {
46
+ if (!__DEV__) {
47
+ warnInProduction();
48
+ return [];
49
+ }
50
+
51
var aggregatedStats = {};
52
var affectedIDs = {};
53
@@ -73,7 +97,12 @@ function getExclusive(flushHistory = getFlushHistory()) {
97
);
98
}
99
76
-function getInclusive(flushHistory = getFlushHistory()) {
100
+function getInclusive(flushHistory = getLastMeasurements()) {
101
+ if (!__DEV__) {
102
+ warnInProduction();
103
+ return [];
104
+ }
105
+
106
var aggregatedStats = {};
107
var affectedIDs = {};
108
@@ -141,7 +170,12 @@ function getInclusive(flushHistory = getFlushHistory()) {
170
);
171
}
172
144
-function getWasted(flushHistory = getFlushHistory()) {
173
+function getWasted(flushHistory = getLastMeasurements()) {
174
+ if (!__DEV__) {
175
+ warnInProduction();
176
+ return [];
177
+ }
178
+
179
var aggregatedStats = {};
180
var affectedIDs = {};
181
@@ -234,7 +268,12 @@ function getWasted(flushHistory = getFlushHistory()) {
268
);
269
}
270
237
-function getOperations(flushHistory = getFlushHistory()) {
271
+function getOperations(flushHistory = getLastMeasurements()) {
272
+ if (!__DEV__) {
273
+ warnInProduction();
274
+ return [];
275
+ }
276
+
277
var stats = [];
278
flushHistory.forEach((flush, flushIndex) => {
279
var {operations, treeSnapshot} = flush;
@@ -258,6 +297,11 @@ function getOperations(flushHistory = getFlushHistory()) {
297
}
298
299
function printExclusive(flushHistory) {
300
+ if (!__DEV__) {
301
+ warnInProduction();
302
+ return;
303
+ }
304
+
305
var stats = getExclusive(flushHistory);
306
var table = stats.map(item => {
307
var {key, instanceCount, totalDuration} = item;
@@ -279,6 +323,11 @@ function printExclusive(flushHistory) {
323
}
324
325
function printInclusive(flushHistory) {
326
+ if (!__DEV__) {
327
+ warnInProduction();
328
+ return;
329
+ }
330
+
331
var stats = getInclusive(flushHistory);
332
var table = stats.map(item => {
333
var {key, instanceCount, inclusiveRenderDuration, renderCount} = item;
@@ -293,6 +342,11 @@ function printInclusive(flushHistory) {
342
}
343
344
function printWasted(flushHistory) {
345
+ if (!__DEV__) {
346
+ warnInProduction();
347
+ return;
348
+ }
349
+
350
var stats = getWasted(flushHistory);
351
var table = stats.map(item => {
352
var {key, instanceCount, inclusiveRenderDuration, renderCount} = item;
@@ -307,6 +361,11 @@ function printWasted(flushHistory) {
361
}
362
363
function printOperations(flushHistory) {
364
+ if (!__DEV__) {
365
+ warnInProduction();
366
+ return;
367
+ }
368
+
369
var stats = getOperations(flushHistory);
370
var table = stats.map(stat => ({
371
'Owner > Node': stat.key,
@@ -344,19 +403,34 @@ function getMeasurementsSummaryMap(measurements) {
403
}
404
405
function start() {
406
+ if (!__DEV__) {
407
+ warnInProduction();
408
+ return;
409
+ }
410
+
411
ReactDebugTool.beginProfiling();
412
}
413
414
function stop() {
415
+ if (!__DEV__) {
416
+ warnInProduction();
417
+ return;
418
+ }
419
+
420
ReactDebugTool.endProfiling();
421
}
422
423
function isRunning() {
424
+ if (!__DEV__) {
425
+ warnInProduction();
426
+ return false;
427
+ }
428
+
429
return ReactDebugTool.isProfiling();
430
}
431
432
var ReactPerfAnalysis = {
359
- getLastMeasurements: getFlushHistory,
433
+ getLastMeasurements,
434
getExclusive,
435
getInclusive,
436
getWasted,
src/renderers/shared/__tests__/ReactPerf-test.js
+23
@@ -445,4 +445,27 @@ describe('ReactPerf', function() {
445
ReactPerf.stop();
446
expect(ReactPerf.isRunning()).toBe(false);
447
});
448
+
449
+ it('should print console error only once', () => {
450
+ __DEV__ = false;
451
+
452
+ spyOn(console, 'error');
453
+
454
+ expect(ReactPerf.getLastMeasurements()).toEqual([]);
455
+ expect(ReactPerf.getExclusive()).toEqual([]);
456
+ expect(ReactPerf.getInclusive()).toEqual([]);
457
+ expect(ReactPerf.getWasted()).toEqual([]);
458
+ expect(ReactPerf.getOperations()).toEqual([]);
459
+ expect(ReactPerf.printExclusive()).toEqual(undefined);
460
+ expect(ReactPerf.printInclusive()).toEqual(undefined);
461
+ expect(ReactPerf.printWasted()).toEqual(undefined);
462
+ expect(ReactPerf.printOperations()).toEqual(undefined);
463
+ expect(ReactPerf.start()).toBe(undefined);
464
+ expect(ReactPerf.stop()).toBe(undefined);
465
+ expect(ReactPerf.isRunning()).toBe(false);
466
+
467
+ expect(console.error.calls.count()).toBe(1);
468
+
469
+ __DEV__ = true;
470
+ })
471
});