Javascript性能-使用$.getScript()添加脚本

Javascript性能-使用$.getScript()添加脚本,javascript,jquery,performance,Javascript,Jquery,Performance,我目前正在制作一种web应用程序,它的一部分工作原理是动态加载js脚本并将其添加到页面中。为此,我使用JQuery的方法加载它 我已将其设置为缓存 在我的程序中,如果一个脚本已经存在,它将从看起来像缓存的地方再次加载。但我想知道的是,这会对网站和性能产生多大影响。与现有脚本具有相同src的新加载脚本是否会覆盖上一个脚本,或者新脚本是与旧脚本一起添加的 此外,由于我的网站是一个AJAX网站,随着时间的推移,最终可能会加载来自不同页面的多个脚本。是否有浏览器限制可以加载多少脚本?这将影响站点性能。即

我目前正在制作一种web应用程序,它的一部分工作原理是动态加载js脚本并将其添加到页面中。为此,我使用JQuery的方法加载它

我已将其设置为缓存

在我的程序中,如果一个脚本已经存在,它将从看起来像缓存的地方再次加载。但我想知道的是,这会对网站和性能产生多大影响。与现有脚本具有相同src的新加载脚本是否会覆盖上一个脚本,或者新脚本是与旧脚本一起添加的


此外,由于我的网站是一个AJAX网站,随着时间的推移,最终可能会加载来自不同页面的多个脚本。是否有浏览器限制可以加载多少脚本?

这将影响站点性能。即使您的脚本缓存在设置了过期时间的客户端上,浏览器仍然需要解析和执行新包含的脚本。更重要的是,您很有可能会遇到javascript错误,因为您的脚本将覆盖以前版本已经设置的变量。JavaScript解析和执行在所有浏览器中仍然是一个阻塞操作,因此在处理文件时,UI将被锁定


回答问题的第二部分,据我所知,给定页面上的javascript文件数量没有限制。我已经看到超过200个JavaScript的页面没有抛出任何异常。

< P>我认为Ilya提供了一些很好的要点来考虑,我认为这回答了你的具体问题。但是,如果您试图完成的是重新运行
$(document).ready()
处理程序,则可以执行以下操作:

(function(){
    var myreadyfunction = function(){
        $('#affected').toggleClass('blue');
    };

    $(document).ready(myreadyfunction);

    $(document).ready(function(){
        $('button').click(myreadyfunction);
    });
})();


我将其范围限定为一个匿名的
(function(){})()不在全局范围内,因此如果您需要从该范围之外访问该函数,您可能需要考虑。但这让你大致了解了我所说的内容。

如果你不小心,预先优化可能是徒劳的。阅读雅虎的几条建议,了解如何从整体上看待这一点,但要记住,每个网站都是不同的,因此有些技术并不总是必要的、有用的,或者(我想)可能会适得其反,除非缓存的副本过期,或者您强制它执行完整请求,否则浏览器不会请求另一个副本。此外,您对包含的Javascript文件本身没有任何限制(据我所知),但是如果您添加数百或数千个
script
includes,您还有其他问题。如果您真正关心的是您可能会进行几个无关的调用来加载同一个脚本,那么您应该通过其他方式来解决这个问题(例如在请求之前检查文件是否已包含)。只需通过我的控制台,它会在其中列出同一个文件,但会说它已缓存。此外,我实际上每次都需要它进行激发/加载排序,因为它有document.ready位,我需要它调用。加载的脚本有一个
$(document.ready()
,需要重新填充?如果您确实需要重新运行该代码块,请创建一个函数将其附加到
$(document).ready()
,以便您可以在需要时调用它,或者我想我不理解这个问题。我的代码不使用任何函数或全局变量,因此包含的部分不成问题。我使用内联编码来做这类事情。好吧,那么很可能没有JS错误。但是,解析仍将阻止执行线程。可能最好先检查脚本是否已包含,然后仅在页面上未包含脚本时才添加。对于一些非常突出的点,请+1。还有另一种更好的方法来完成这个特定的事情(重新运行脚本),使用一个可以调用的变量函数。Thx对于这个新技巧,我将试一试。Thx也向伊利亚寻求建议。