Skip to content

Instantly share code, notes, and snippets.

@leegeunhyeok

leegeunhyeok/example.tsx

Last active May 6, 2021 17:41
Show Gist options
  • Save leegeunhyeok/4985710cd7d93023daa842c4cf0d6dfa to your computer and use it in GitHub Desktop.
Save leegeunhyeok/4985710cd7d93023daa842c4cf0d6dfa to your computer and use it in GitHub Desktop.
Download ZIP
Awesome Logger for React.Profiler
Raw
example.tsx
<Profiler id="MyComponent" onRender={console.profile}>
<Component />
</Profiler>
Raw
profiler.js
console.profile = function ReactProfileLogger (id, phase, actualDuration, baseDuration, startTime, commitTime, interactions) {
const baseStyle = 'padding:1px;background-color:#20232a;';
console.log(
`%c ID: %c ${id} %c`,
baseStyle + 'color:#ffffff;border-radius:3px 0 0 3px;',
baseStyle + 'color:#61dafb;',
baseStyle + 'border-radius:0 3px 3px 0;'
);
console.group();
console.log('actualDuration ' + actualDuration);
console.log('baseDuration ' + baseDuration);
console.log('startTime ' + startTime);
console.log('commitTime ' + commitTime);
console.log(interactions);
console.groupEnd();
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment