jQuery 选项卡和 Firefox 性能问题
考虑在页面上有数千个常规输入按钮（使用 jQuery .button() UI）和输入文本。
在 Firefox 上，如果我单击按钮，单击事件会立即触发。
但是，如果我将所有这些对象放入 jQuery 选项卡中，则需要一些时间才能打开选择菜单或触发按钮单击。
在 Chrome 上，无论有或没有选项卡，一切都会立即触发。
请在 Firefox 上查看此链接 http://jsbin.com/awubo3/5/edit，然后删除选项卡上的注释，然后重试。启用选项卡后，按钮会延迟触发。
在我的页面上情况更糟，有时需要 3-4 秒才能触发点击，或打开选择菜单。
有可能解决这个问题吗？
Consider having some thousands of regular 's, input buttons (with jQuery .button() UI) and input texts on a page.
On Firefox, if I click a button click event triggers instantly.
But, if I put all these objects into a jQuery Tab, it takes some time to open a select menu or trigger click of a button.
On Chrome, with or without tabs, everything trigger instantly.
Please check this link http://jsbin.com/awubo3/5/edit on Firefox, then remove the comment on tabs and try again. Buttons will trigger a bit late when tabs are enabled.
On my page it's even worse, sometimes it takes 3-4 seconds to trigger click, or open select menu.
Is it possible to fix this issue?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
该页面肯定存在一些性能问题。由于您对页面进行的大量工作，您将亲眼目睹 JavaScript 引擎实现之间的性能差异。除了尝试找到一种更有效的方法来完成您想做的事情之外，您对此无能为力。
例如，您可以保持代码架构相同，但减少页面上的元素数量。实施某种分页解决方案以允许用户访问所有记录，但限制查看的数量，以便性能可以接受。
如果您必须同时显示所有这些信息，请考虑实现您正在使用的 jquery UI 元素的轻量级版本。实现“选项卡”系统可以非常轻量级（这是一个示例，只需很少的几行即可完成的代码）。如果您纯粹出于样式原因而使用 UI 按钮，请看看仅使用 css 可以实现多少效果。
The page definitely has some performance issues. Because of the intensive work you are putting the page through, you are seeing first hand the difference in performance between javascript engine implementations. There is not much you can do about this other than try and find a more efficient method of doing what you want to do.
For example, you could keep your code architecture the same, but reduce the number of elements on the page. Implement some sort of paging solution to allow the users to get to all the records, but restrict the number viewed so performance is acceptable.
If you had to have all that information displayed at the same time, consider implementing lighter weight versions of the jquery UI elements you are using. Implementing a 'tabbing' system can be very lightweight (here is an example that is done in very few lines of code). If you are using the UI Button purely for style reasons, see how much you can achieve with css alone.
尽管 jQuery 有其所有优势，但它还是需要走很长的路才能完成任务。考虑 $(#element) 与 getElementByID。后者内置于 javascript 中，如果你有很多，运行纯 javascript 会更快。但是 jQuery 选择器会经历一堆 jQuery 函数调用。另外，通过逐步查看，我发现 jQuery 也克隆了很多。假设您在单击处理程序中给它一个匿名函数。jQuery 不仅仅附加事件并完成它。相反，它采用该函数，运行一堆 isString、isObject、isArray，最后是 isFunction。一旦它发现它是一个函数，它就会将其分解并在私有内部函数中重建整个事物，然后它可以将其附加到事件。
jQuery, for all it's strengths, takes the long way around to do things. Consider $(#element) versus getElementByID. the later is built into javascript, and if you have a lot of them, running pure javascript is faster. But the jQuery selector goes through a bunch of jQuery functions calls. Also, stepping through I found that jQuery also clones a lot. Say you give it a anonymous function in a click handler.jQuery does not just attach the event and be done with it. Instead it takes that function, runs through a bunch of isString, isObject, isArray, and finally isFunction. Once it finds out it's a function, it rips it apart and rebuilds the whole thing in a private internal function, then it can attach it to the event.