将JS文件放在网页的底部是否实际上很好？ [英] Is it practically good to put JS files at the bottom of webpage?

问题描述

广泛推荐将JS文件放在页面底部，以便首先加载html代码。在这种情况下，访问者在等待页面满载时会看到一些东西。不过，我认为这样做是不利的，因为这些原因：现在的设计主要依赖于JS。这意味着在加载JS之前，页面看起来会很难看。 如果在加载期间中断连接（根本不加载JS），访问者将会错过一些网站功能（可能非常重要）;并且他们不会理解这是加载问题（重新加载页面）。

如果服务器端脚本在页脚之前（例如在PHP中）脚本的最后，> （由于错误），访问者将错过整个页面功能（由JS）;但如果在顶部加载JS，它们只会错过页脚或页面的一半。

如果先加载JS，浏览器将加载其他东西（如图像） 在平行下;但如果最后加载JS，则可能会增加加载时间。因为JS文件很大（例如JQuery和JQuery UI），并且所有小东西（如图像）都已加载，我们正在加载一个大文件，最后一行。

ol>

UPDATE： 5.由于jQuery库应该在代码之前加载;如果将jQuery库加载到页脚（例如footer.php）中，则不能为不同的页面添加自定义jQuery代码（在body内）。

米错了！编辑：我添加了另一点，以回应我看到的棉花在这个主题的人们耳朵。

额外的点＃5。如果你非常关心JS失败的处理行为，那么我的意思是，用JS浏览的用户关闭了，你应该做的是接受渐进增强的概念。例如，您可以设计一个手风琴菜单作为默认的悬停菜单，yes仅用于CSS，然后在启用JS时通过更改关键类来移除该行为。这样，用户可以访问没有JS的链接，如果他们应该关闭它，但他们在JS工作时得到增强的行为。

但是你不应该尝试句柄是在页面上缺少整个JS文件，因为该页面在后端被损坏，所以应该有它们。处理意外事件是一回事，但处理在提供HTML文件之前完成构建的失败不应被视为生产中可接受的场景，特别是如果您的模板语言中有实际的后端代码（您不应该这样做）等待泄漏出来，给潜在的黑客一些有趣的东西看看。中断的页面应作为错误消息提供。

========================== ======

1. 死错。任何时候你使用JS来调整页面的初始静态外观，你做错了。保持关注点和页面的分离将更加灵活。使用JS来调整页面的STATIC风格并不现代，它是低音呐喊，你可以告诉我说过的jQuery手机家伙。如果你绝对必须支持IE6和IE7，IE8会告诉你的客户，如果他们拒绝接受任何东西作为5％客户端的绝对优雅降级的替代方案，那么他们会花费多少成本来削减各地的圆角渐变角，如果你的页面没有预先加载JS，需要花费很长时间才能加载，那么你还有其他问题需要解决。您加载了多少资源？什么不诚实的预处理是你的PHP达到？

你是否认为用JS工作半页而不是完全无法接受是可以接受的？不要放开那个客户，不管他们是谁。 当最小化时，jQuery的大小约为中等大小的JPEG。

注意：将某些JS放在最上面并不是完全不可接受的。一些专门的代码，如分析工具或画布标准化程序需要它。但任何不需要的东西都应该在底部。每次解析JS时，整个页面加载和流程计算过程都会停止。将您的JS推到底部可以提高页面加载时间，并且还可以提供证据证明您团队中的某个人需要迅速kick出脚印，以便弄清他们的代码为什么是坦克，或者他们的25兆字节的png-24可以做些什么他们只是缩小而不是重新格式化。

It is widely recommended that JS files should be put at the bottom of page to allow html codes to be loaded first. In this case, visitors will see something when waiting for full load of the page. However, I think this is disadvantageous for these reasons:

1. Modern design mainly depends on JS. This means before loading JS, the page will look ugly.

2. If interrupting the connection during the load (not loading JS at all), visitors will miss some of the website features (probably very important); and they will not understand that this is the problem of load (to re-load the page).

3. If the server-side script die (due to an error) at the very end of script before footer (e.g. in PHP), visitors will miss the whole page functionality (by JS); but if loading JS at the top, they will only miss the footer or half the page.

4. If loading JS first, browser will load other stuff (like images) in parallel; but if loading JS last, it may increase the load time. Because JS files are large (e.g. JQuery and JQuery UI), and all tiny stuffs (like images) have been loaded and we are loading a large file, last in line.

UPDATE: 5. Since jQuery library should be loaded before codes; if loading the jQuery library in footer (e.g. footer.php), you cannot add custom jquery codes for different pages (within the body).

Please correct me if I'm wrong! Is putting JS files in footer still beneficial?

解决方案

Edit: I am adding another point in response to the cotton I'm seeing in peoples ears on this topic.

Additional point #5. If you are seriously concerned about handling behavior on JS-fail and by that I mean, people browsing with JS turned off, what you should be doing is embracing the notion of progressive enhancement. For instance, you could design an accordion menu to act as a flyout-menu on-hover by default, yes with CSS only, and then remove that behavior by changing key classes when JS is enabled. That way users have access to the links without JS if they should turn it off but they get the enhanced behavior when JS is working.

But what you should not be trying to handle is the absence of entire JS files on pages that are supposed to have them because the page was mangled on the back-end. Handling the unexpected is one thing, but handling the failure to finish building an HTML file before it's served should not ever be considered an acceptable scenario in production, especially if you have actual back end code in your templating language (which you shouldn't) waiting to spill out and give would-be hackers something potentially interesting to look at. Broken pages should be served as error messages.

================================

1. Dead wrong. Any time you use JS to tweak the initial static look of your page, you're doing it wrong. Maintain that separation of concerns and your pages will be much more flexible. Using JS to tweak the STATIC styles of your pages isn't modern, it's bass-ackwards and you can tell the jQuery mobile guys I said as much. If you absolutely must support IE6 and IE7 and IE8 tell your client how much it's going to cost them to cut out rounded gradient corners all over the place if they refuse to accept anything as an alternative to absolute graceful degradation for 5% of their client-base.

2. If your pages, with no JS beforehand are taking that long to load, you have other problems that need to be addressed. How many resources are you loading? What ungodly pre-processing is your PHP up to? I call back end or design shenanigans.

3. Are you saying it's half-acceptable to have half a page with working JS rather than completely unacceptable? Don't let go of that client, whoever they are.

4. jQuery, when minimized is about the size of a medium-sized JPEG.

Note: It is not entirely unacceptable to have some JS up top. Some specialized code like analytics stuff or canvas normalizers require it. But anything that doesn't need to be should be at the bottom. Every time JS is parsed, the entire page load and flow calculation process stalls out. Pushing your JS to the bottom improves perceived page load times and should also serve to provide evidence that somebody on your team needing a swift kick in the butt to figure out why their code is tanking or what could be done with their 25 megabyte png-24s that they just shrunk down rather than reformatted.

这篇关于将JS文件放在网页的底部是否实际上很好？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！