import { isPerformanceAPIAvailable } from './is-performance-api-available';
/**
 * Measures time it takes to render a frame including -> style, paint, layout and composition.
 *
 * How does it work:
 * 1. We mark the beginning of a render with the `startMark`
 * 2. We schedule `requestAnimationFrame` callback for the next frame
 * 3. Framework (e.g. prosemirror) does its magic and mounts dom nodes "synchronously"
 * 4. When the main thread is unblocked our callback gets executed and onMeasureComplete is being called
 *
 * Why does it work:
 * | javascript (framework)           | style | layout | paint | composite | javascript  | ...
 *  | startMark + scheduling rAF |                                                       | rAF callback, endMark
 */
export function measureRender(measureName, onMeasureComplete) {
    if (!isPerformanceAPIAvailable()) {
        return;
    }
    var startMark = "[START]: " + measureName;
    var endMark = "[END]: " + measureName;
    var startTime = performance.now();
    performance.mark(startMark);
    requestAnimationFrame(function () {
        requestAnimationFrame(function () {
            performance.mark(endMark);
            var duration = performance.now() - startTime;
            try {
                performance.measure(measureName, startMark, endMark);
                var entry = performance.getEntriesByName(measureName).pop();
                if (!entry) {
                    onMeasureComplete(duration, startTime);
                }
                else {
                    onMeasureComplete(entry.duration, entry.startTime);
                }
            }
            catch (e) {
                onMeasureComplete(duration, startTime);
            }
            performance.clearMeasures(measureName);
            performance.clearMarks(startMark);
            performance.clearMarks(endMark);
        });
    });
}
//# sourceMappingURL=measure-render.js.map