ASPX页面中的CSS和脚本调用顺序

时间:2010-10-19 10:03:57

标签: javascript asp.net css

是否有任何特定的顺序可以在ASPX页面中调用外部CSS或脚本,这有助于减少页面加载时间?

script type="text/javascript" src="../Includes/JavaScript/jquery.ui.tabs.js" 
link href="../Includes/css/ui.all.css" rel="Stylesheet" type="text/css"

link href="../Includes/css/ui.all.css" rel="Stylesheet" type="text/css"    
script type="text/javascript" src="../Includes/JavaScript/jquery.ui.tabs.js" 

或任何其他订单?

4 个答案:

答案 0 :(得分:2)

最佳做法是将样式表调用放在HEAD元素的顶部,将脚本调用放到底部,最好放在BODY元素的底部。

有关详细信息,请参阅http://developer.yahoo.com/yslow/help/#guidelines

答案 1 :(得分:0)

两者都需要加载,所以我会选择“不”。任何订单都无助于增加页面加载时间。

无论如何,根据习惯,我在JS之前加载CSS,这样即使两者都需要完全加载,至少在CSS出现时也是如此。

答案 2 :(得分:0)

常识说:首先放置具有最大延迟的那个。

假设负载延迟分别为100ms和50ms;

  • 如果100ms的请求在50ms之前出现10ms,则总延迟变为(0ms +(100ms || 10ms + 50ms))= 100ms。

  • 如果较短的请求先行,则得到(0ms +(50ms || 10ms + 100ms))= 110ms。

但请确保区分挂钟时间,吞吐时间,用户体验时间。

答案 3 :(得分:0)

页面加载时间当然可能意味着不止一件事。对于最终用户,它可能意味着在屏幕上看到某些内容所需的时间。或者它可能意味着下载所有资源所花费的时间。

您只能在给定服务器上打开两个连接(至少在这种情况下,see here for reference)。因此,考虑到这一点,您应该关注几点。

  • 尝试通过组合JS和CSS文件并压缩它们来最小化请求数。有很多实用工具可以做到这一点。这可能会对你能做的任何事情产生最大的影响。
  • CSS然后JS是一个很好的经验法则,Fermin指出。您可能仅限于使用级联的CSS文件顺序以及库依赖项的JS文件。但是请尽量确保在顶部没有两个大文件,这些文件会阻止会话中的其他下载,直到完成为止。