从预加载中排除元素

Exclude elements from being preloaded

本文关键字:排除 元素 加载      更新时间:2023-09-26

我在预加载整个页面的当前项目上使用 http://github.hubspot.com/pace/。

是否可以从预加载中排除某些元素?

例如,我希望我的#header#banner元素立即可见,并让 pace 在页面的其余部分完成它的工作。

对我来说,"开始"事件没有触发?

Pace.on("start", function() {
        alert('heee');
    });

在文档中准备就绪或退出功能。 Pace.on("done", …触发器很好。

更新:我目前的主要问题是这个...

$(window).load(function(){
    $('body').addClass("page");
    Pace.on('start', function() { 
        alert('start') // not fired
    });
    Pace.on('done', function() {
        alert('done') // fired!
    });
});

根据文档:

"收集器是收集进度信息的代码位。Pace 包括四个默认收集器:

阿贾克斯

监视页面上的所有 ajax 请求

元素

检查页面上是否存在特定元素

公文

检查文档就绪状态

事件滞后

检查事件循环滞后,表示正在执行 JavaScript

它们都可以通过同名的配置选项进行配置或禁用。

paceOptions = {
  ajax: false, // disabled
  document: false, // disabled
  eventLag: false, // disabled
  elements: {
    selectors: ['.my-page']
  }
};

也许

elements: {
   selectors: ['.my-page']
}

可以做到。

更多在这里:

"要点

呈现

到屏幕上的元素是我们确定页面是否已呈现的一种方式。如果要使用该信息源(根本不需要(,请指定一个或多个选择器。你可以用逗号分隔选择器来适当地处理错误状态,其中进度条应该消失,但我们正在寻找的元素可能永远不会出现:">

paceOptions = {
  elements: {
    selectors: ['.timeline,.timeline-error', '.user-profile,.profile-error']
  }
}

这似乎是一个很好的插件!


编辑

要在启动时附加代码,似乎应该是:

"如果您使用的是AMD或Browserify,则可以传递选项以开始:">

define(['pace'], function(pace){
  pace.start({
    document: false
  });
});