Question

我使用twitter bootstrap在我的网站上开发了一个页面。在那里我已经包括下面提到的引导程序的js。

bootstrap-transition.js
bootstrap-alert.js
bootstrap-modal.js
bootstrap-dropdown.js
bootstrap-scrollspy.js
bootstrap-tab.js
bootstrap-tooltip.js
bootstrap-popover.js
bootstrap-button.js
bootstrap-collapse.js
bootstrap-carousel.js
bootstrap-typeahead.js

这个页面在FF和chrome中运行良好。当我在IE中打开该页面并勾选任何复选框时，需要一些时间来检查/取消选中该复选框。同样的事情在dtropwown的情况下很开心，它需要一些时间来扩展/折叠下拉列表。

所以我逐个删除了所有bootstrap js，它开始提高性能。当所有bootstrap js被删除后，它开始与其他浏览器一样工作正常。

那么有什么解决方案可以解决这个问题吗？

提前致谢。

Answer 1

我在我的应用程序中使用jquery-1.8.1.min.js。

我通过将jquery-1.8.1.min.js替换为jquery-1.8.3.min.js

来解决我的问题

现在它在所有浏览器中工作正常，包括IE。

Answer 2

我怀疑JS的数量正在减慢你的速度。例如，当您点击the official Bootstrap docs page上的按钮时，您获得的效果是否相同？我不是。

相反，我怀疑你或者与其他JS库存在冲突，或者你的标记有些不正确，导致其中一个Bootstrap插件将异常数量的回调附加到页面。

测试后者的一种方法是修改jQuery.on以在调用时打印到控制台。加载 jQuery 后运行以下内容，但在Bootstrap库之前可以解决问题：

var old = jQuery.fn.on;
jQuery.fn.on = function (types) {
  console.log(types);
  return old.apply(this, arguments);
};

在Bootstrap文档中，有50个听众注册，大多数是点击。

否则，在JS的数量上，您应该使用Bootstrap的聚合和缩小版本，例如BootstrapCDN服务（bootstrap.min.js），而不是所有这些单独的文件。使用那些正在开发中;使用缩小的性能测试/生产。

bootstrap js在IE中放慢了网页的速度

2 个答案: