Permalink
Browse files

Implement Systrace integration for Fiber

Reviewed By: bvaughn

Differential Revision: D5210738

fbshipit-source-id: db7df5ca7a1b4944f86719361d22ec3cc2ce8f22
  • Loading branch information...
gaearon authored and facebook-github-bot committed Jun 8, 2017
1 parent e38641c commit 32a0ee0975309bfe45f2e89f558a5088edcdbe65
Showing with 74 additions and 62 deletions.
  1. +3 −0 Libraries/Core/InitializeCore.js
  2. +0 −30 Libraries/Performance/RCTRenderingPerf.js
  3. +71 −32 Libraries/Performance/Systrace.js
@@ -99,6 +99,9 @@ if (!global.process.env.NODE_ENV) {
// Set up profile
const Systrace = require('Systrace');
Systrace.setEnabled(global.__RCTProfileIsProfiling || false);
if (__DEV__) {
global.performance = Systrace.getUserTimingPolyfill();
}
// Set up console
const ExceptionsManager = require('ExceptionsManager');
@@ -11,9 +11,6 @@
*/
'use strict';
var ReactDebugTool = require('ReactDebugTool');
var ReactPerf = require('ReactPerf');
var invariant = require('fbjs/lib/invariant');
var performanceNow = require('fbjs/lib/performanceNow');
@@ -24,22 +21,6 @@ type perfModule = {
var perfModules = [];
var enabled = false;
var lastRenderStartTime = 0;
var totalRenderDuration = 0;
var RCTRenderingPerfDevtool = {
onBeginLifeCycleTimer(debugID, timerType) {
if (timerType === 'render') {
lastRenderStartTime = performanceNow();
}
},
onEndLifeCycleTimer(debugID, timerType) {
if (timerType === 'render') {
var lastRenderDuration = performanceNow() - lastRenderStartTime;
totalRenderDuration += lastRenderDuration;
}
},
};
var RCTRenderingPerf = {
// Once perf is enabled, it stays enabled
@@ -53,8 +34,6 @@ var RCTRenderingPerf = {
return;
}
ReactPerf.start();
ReactDebugTool.addHook(RCTRenderingPerfDevtool);
perfModules.forEach((module) => module.start());
},
@@ -63,15 +42,6 @@ var RCTRenderingPerf = {
return;
}
ReactPerf.stop();
ReactPerf.printInclusive();
ReactPerf.printWasted();
ReactDebugTool.removeHook(RCTRenderingPerfDevtool);
console.log(`Total time spent in render(): ${totalRenderDuration.toFixed(2)} ms`);
lastRenderStartTime = 0;
totalRenderDuration = 0;
perfModules.forEach((module) => module.stop());
},
@@ -11,6 +11,8 @@
*/
'use strict';
const invariant = require('fbjs/lib/invariant');
type RelayProfiler = {
attachProfileHandler(
name: string,
@@ -29,52 +31,89 @@ const TRACE_TAG_JSC_CALLS = 1 << 27;
let _enabled = false;
let _asyncCookie = 0;
const _markStack = [];
let _markStackIndex = -1;
const ReactSystraceDevtool = __DEV__ ? {
onBeforeMountComponent(debugID) {
const ReactComponentTreeHook = require('ReactGlobalSharedState').ReactComponentTreeHook;
const displayName = ReactComponentTreeHook.getDisplayName(debugID);
Systrace.beginEvent(`ReactReconciler.mountComponent(${displayName})`);
},
onMountComponent(debugID) {
Systrace.endEvent();
},
onBeforeUpdateComponent(debugID) {
const ReactComponentTreeHook = require('ReactGlobalSharedState').ReactComponentTreeHook;
const displayName = ReactComponentTreeHook.getDisplayName(debugID);
Systrace.beginEvent(`ReactReconciler.updateComponent(${displayName})`);
},
onUpdateComponent(debugID) {
Systrace.endEvent();
},
onBeforeUnmountComponent(debugID) {
const ReactComponentTreeHook = require('ReactGlobalSharedState').ReactComponentTreeHook;
const displayName = ReactComponentTreeHook.getDisplayName(debugID);
Systrace.beginEvent(`ReactReconciler.unmountComponent(${displayName})`);
// Implements a subset of User Timing API necessary for React measurements.
// https://developer.mozilla.org/en-US/docs/Web/API/User_Timing_API
const REACT_MARKER = '\u269B';
const userTimingPolyfill = {
mark(markName: string) {
if (__DEV__) {
if (_enabled) {
_markStackIndex++;
_markStack[_markStackIndex] = markName;
let systraceLabel = markName;
// Since perf measurements are a shared namespace in User Timing API,
// we prefix all React results with a React emoji.
if (markName[0] === REACT_MARKER) {
// This is coming from React.
// Removing component IDs keeps trace colors stable.
const indexOfId = markName.lastIndexOf(' (#');
const cutoffIndex = indexOfId !== -1 ? indexOfId : markName.length;
// Also cut off the emoji because it breaks Systrace
systraceLabel = markName.slice(2, cutoffIndex);
}
Systrace.beginEvent(systraceLabel);
}
}
},
onUnmountComponent(debugID) {
Systrace.endEvent();
measure(measureName: string, startMark: ?string, endMark: ?string) {
if (__DEV__) {
if (_enabled) {
invariant(
typeof measureName === 'string' &&
typeof startMark === 'string' &&
typeof endMark === 'undefined',
'Only performance.measure(string, string) overload is supported.'
);
const topMark = _markStack[_markStackIndex];
invariant(
startMark === topMark,
'There was a mismatching performance.measure() call. ' +
'Expected "%s" but got "%s."',
topMark,
startMark,
);
_markStackIndex--;
// We can't use more descriptive measureName because Systrace doesn't
// let us edit labels post factum.
Systrace.endEvent();
}
}
},
onBeginLifeCycleTimer(debugID, timerType) {
const ReactComponentTreeHook = require('ReactGlobalSharedState').ReactComponentTreeHook;
const displayName = ReactComponentTreeHook.getDisplayName(debugID);
Systrace.beginEvent(`${displayName}.${timerType}()`);
clearMarks(markName: string) {
if (__DEV__) {
if (_enabled) {
if (_markStackIndex === -1) {
return;
}
if (markName === _markStack[_markStackIndex]) {
// React uses this for "cancelling" started measurements.
// Systrace doesn't support deleting measurements, so we just stop them.
userTimingPolyfill.measure(markName, markName);
}
}
}
},
onEndLifeCycleTimer(debugID, timerType) {
Systrace.endEvent();
clearMeasures() {
// React calls this to avoid memory leaks in browsers, but we don't keep
// measurements anyway.
},
} : null;
};
const Systrace = {
getUserTimingPolyfill() {
return userTimingPolyfill;
},
setEnabled(enabled: boolean) {
if (_enabled !== enabled) {
if (__DEV__) {
if (enabled) {
global.nativeTraceBeginLegacy && global.nativeTraceBeginLegacy(TRACE_TAG_JSC_CALLS);
require('ReactDebugTool').addHook(ReactSystraceDevtool);
} else {
global.nativeTraceEndLegacy && global.nativeTraceEndLegacy(TRACE_TAG_JSC_CALLS);
require('ReactDebugTool').removeHook(ReactSystraceDevtool);
}
}
_enabled = enabled;

0 comments on commit 32a0ee0

Please sign in to comment.