VSCode 源码阅读(一)--性能测量

145 阅读1分钟

总所周知, VSCode是使用Electron进行开发的桌面端工具

在Electron的性能优化的过程中, 首先需要一个性能测量的标准和方式. 在测量到性能数据的情况下, 再去针对性的进行优化.

VSCode的性能测量

Node后台进程

function _definePolyfillMarks(timeOrigin) {

    const _data = [];
    if (typeof timeOrigin === 'number') {
            _data.push('code/timeOrigin', timeOrigin);
    }

    function mark(name) {
            _data.push(name, Date.now());
    }
    function getMarks() {
            const result = [];
            for (let i = 0; i < _data.length; i += 2) {
                    result.push({
                            name: _data[i],
                            startTime: _data[i + 1],
                    });
            }
            return result;
    }
    return { mark, getMarks };
}

渲染进程

{
    mark(name) {
            performance.mark(name);
    },
    getMarks() {
            let timeOrigin = performance.timeOrigin;
            if (typeof timeOrigin !== 'number') {
                    // safari: there is no timerOrigin but in renderers there is the timing-property
                    // see https://bugs.webkit.org/show_bug.cgi?id=174862
                    timeOrigin = performance.timing.navigationStart || performance.timing.redirectStart || performance.timing.fetchStart;
            }
            const result = [{ name: 'code/timeOrigin', startTime: Math.round(timeOrigin) }];
            for (const entry of performance.getEntriesByType('mark')) {
                    result.push({
                            name: entry.name,
                            startTime: Math.round(timeOrigin + entry.startTime)
                    });
            }
            return result;
    }
};

使用与上报

在每个节点中, 使用perf.mark('startTime');的方式进行标记, 然后在某个节点中, 使用perf.getMarks()获取到标记数据后, 上报到服务端. 完成当前周期的性能测量计算.