2

我使用 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 的情况下，展开/折叠下拉菜单需要一些时间。

所以我一一删除了所有引导 js，它开始提高性能。并且当所有引导 js 被删除时，它开始像其他浏览器一样正常工作。

那么有什么办法可以解决这个问题吗？

提前致谢。

4

2 回答 2

7

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

我通过替换解决了我的jquery-1.8.1.min.js问题jquery-1.8.3.min.js

现在它在包括 IE 在内的所有浏览器中都能正常工作。

于 2012-11-22T06:36:40.317 回答
4

我怀疑 JS 的数量是什么让你慢下来。例如，单击官方 Bootstrap 文档页面上的按钮时，您是否获得了同样糟糕的性能？我不是。

相反，我怀疑您要么与其他 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 )，而不是所有这些单独的文件。使用那些正在开发中的；在性能测试/生产中使用缩小。

于 2012-11-20T16:39:47.650 回答