Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Wrap reselect's createSelector with a function that measures how long selectors take to run
import {createSelector} from 'reselect';
const hasPerformanceApi =
window &&
window.performance &&
window.performance.measure &&
window.performance.mark;
const createFuncWithMark = (name, callback) => (...args) => {
const startMark = `${name}-Startmark`;
const endMark = `${name}-EndMark`;
window.performance.mark(startMark);
const result = callback(...args);
window.performance.mark(endMark);
window.performance.measure('♻️ ' + `${name}-Selector`, startMark, endMark);
window.performance.clearMarks(startMark);
window.performance.clearMarks(endMark);
window.performance.clearMeasures(startMark);
window.performance.clearMeasures(endMark);
return result;
};
export const createMarkedSelector = (name, ...args) => {
if (!hasPerformanceApi) {
return createSelector(...args);
}
if (!name || typeof name !== 'string') {
throw new Error('marked selectors must have names');
}
const callback = args.pop();
const funcWithMark = createFuncWithMark(name, callback);
args.push(funcWithMark);
return createSelector(...args);
};
@TerribleDev

This comment has been minimized.

Copy link
Owner Author

TerribleDev commented Jan 15, 2019

you can use this by instead of calling createSelector call createMarkedSelector('yourSelectorName', ...)

@TerribleDev

This comment has been minimized.

Copy link
Owner Author

TerribleDev commented Jan 15, 2019

This is the regex I use in vscode to on mass replace createSelector with createMarkedSelector

https://gist.github.com/TerribleDev/da2fa46ce3194f69ef04239260cacb38

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.