DOMNodeInserted 或 hashchange
我正在尝试编写一个“覆盖”在 Facebook 页面顶部的 JavaScript 脚本。它使用 DOMContentLoaded 来检测内容何时加载,然后添加一些额外的内容。但是,由于 Facebook 在转到新页面时实际上并不“重新加载”页面(它只是使用 AJAX),因此 DOMContentLoaded 处理程序不会运行再次强调,尽管有新的东西需要研究。
无论如何,为了检测更改,我考虑使用 onhashchange 因为 Facebook 过去常常更改页面的哈希值,但在 Firefox 4 中(我需要支持 Firefox 3 及更高版本,但不需要其他浏览器),Facebook 不会更改哈希值在 Firefox 3.6 之前的版本中不再有 onhashchange。
我考虑过使用 DOMNodeInserted,但这真的会减慢页面速度吗? (我真的不能让这个脚本有任何放缓。)
I am trying to write a JavaScript script that is "overlayed" on top of a Facebook page. It uses DOMContentLoaded to detect when content is loaded, then adds some extra stuff in. However, because Facebook doesn't actually "reload" the page when going to a new page (it just uses AJAX), the DOMContentLoaded handler doesn't run again, even though there is new stuff to look through.
Anyway, to detect the change, I thought about using onhashchange since Facebook used to change the page's hash, but in Firefox 4 (I need to support Firefox 3 and later with this, but no other browsers), Facebook doesn't change the hash anymore and in pre-Firefox 3.6 there is no onhashchange.
I thought about using DOMNodeInserted, but would that really slow down the page? (I really can't have any slowdowns in this script.)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您可能想要监视 windows.history 对象,请参阅以下答案,了解 facebook 如何使用它来更新页面:
“重定向”页面而不刷新(Facebook 照片样式)
you might want to monitor the windows.history object, see the following answer, on how facebook uses it to update pages:
"Redirect" page without refresh (Facebook photos style)
对于轻量级页面,它通常没有明显的效果。然而,在大页面上(我在 gmail 上尝试过),它使得速度非常慢,我什至无法顺利地撰写消息。该事件被添加到一个非常简单的 span 元素中,其中只有一个链接。像 DOMNodeInserted 和 DOMSubTreeModified 这样的事件是真正的阻碍。
更新:对于所有试图找到此问题答案的人,请注意这些方法 DOMNodeInserted (或 DOMSubtreeModified)确实存在性能问题,因此根据新的 ECMA 规范,它是一个更快的侦听器:MutationObserver 用于执行相同的操作(以及更多) 。
https:// hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/
For lightweight pages it generally doesn't have noticable effect. However, on bulky pages (I tried this on gmail) it makes that really really slow that I cannot even compose a message smoothly. And that event was added to a very simple span element which just had a single link in that. The events like DOMNodeInserted and DOMSubTreeModified are real show stoppers.
UPDATE: For all those trying to find an answer to this, note that these methods DOMNodeInserted (or DOMSubtreeModified) really had performance problems, so according to new ECMA specs it is a much faster listener : MutationObserver for doing the same thing (and more).
https://hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/