Question

我正在对UI中的错误进行故障排除，第一次打开菜单时它非常慢。 1-3秒内的任何地方。随后的开放速度与您预期的一样快。

下面你会看到代码，然后是几个javascript配置文件。您会注意到每次首次运行（页面加载后）(program)位于顶部并且占据总时间的500毫秒。在后续运行（第二个，第三个）中，您会在顶部看到(idle)，(program)只需要40-90毫秒。

尽管我只提供了以下5个数据点，但我已经运行了几十次并且非常一致。

任何人都可以解释这一点，或者至少向我提供一些有关如何进一步排查问题的提示吗？

编辑：我应该注意，下面的效果配置文件位于Chrome Canary中。实际代码在Unity中的Coherent UI中运行，并且延迟倍增。

代码：

function openPane(callback) {
    console.profile('openPane');
    if (!$pane.is(':visible')) {
        $pane.css('display', 'block');
    }

    if (typeof $slideinc.length !== 'undefined') {
        for (i = 0; i < $slideinc.length; i++) {
            // This element has been configured to slide with the pane element
            if ($dir == "left") {
                $($slideinc[i]).animate({
                    left: convertPXtoVW((parseFloat($slideorigins[i].left) + parseFloat($pane.outerWidth(true)) +
                                         parseFloat($paneorigin.left)).toString())
                }, function() {
                });
            } else {
                $($slideinc[i]).animate({
                    right: convertPXtoVW((parseFloat($slideorigins[i].right) + parseFloat($pane.outerWidth(true)) +
                                        parseFloat($paneorigin.right)).toString())
                }, function() {
                });
            }
        }
    }

    // Depending on the configured direction animate left or right
    if ($dir == "left") {
        $pane.animate({ left: convertPXtoVW($paneorigin.left) }, function () {
            console.profileEnd();
        });
    } else {
        $pane.animate({ right: convertPXtoVW($paneorigin.right) }, function () {
            console.profileEnd();
        });
    }
    // Attribute added to determine when pane is opened
    $pane.attr('data-pane-open', true);
}