在项目中良好的JavaScript结构？

Question

所以，我现在已经在我的网站上完成了JS。它涉及jQuery（和这样的.ready init） 该页面有两个部分，上部主要是谷歌地图，下部是输入表格。

所有这些目前都在 one .js，函数，inits，迭代，所有这些。 结构很好，一切都做得很好。

然而我的问题是：什么是好的结构？ 我应该将上半部分放在一个文件中而将下部放在另一个文件中吗？ 或者我应该在.ready（）下放置所有需要的初始化并将所有函数放在另一个文件中？ 或者我应该将所有内容保存在不断增长的文件中吗？

Answer 1

从性能角度来看，按照其他答案的建议将单个文件中的所有JS提供给浏览器是明智的。但是，以这种方式构建代码不是，每个“类”应该在一个单独的文件中，将内容分成实体和一个或两个控制文件来处理实际的页面调用 - 与任何其他语言相同。然后可以将这些文件合并到一个文件中，以便提前或动态地提供 - 最好也最小化。

Answer 2

将脚本调用保持在最低限度可以缩短处理时间 - 每个脚本都包含一个增加时间的往返。所以 - 个人偏好，只要你不关心页面加载时间。

雅虎的Best Practices for Speeding Up Your Web Site以最小化HTTP请求开始：

  

最终用户响应时间的80％是   花在了前端。其中大部分   下载所有的时间都被束缚了   页面中的组件：图像，   样式表，脚本，Flash等   减少中的组件数量   转减了HTTP的数量   呈现页面所需的请求。   这是加快页面的关键。

     

减少数量的一种方法   页面中的组件是为了简化   页面的设计。但有办法吗？   构建内容更丰富的页面   同时也实现快速反应   次？以下是一些技巧   减少HTTP请求的数量，   同时仍然支持丰富的页面   设计。

     

组合文件是一种减少的方法   通过组合的HTTP请求数   所有脚本都放在一个脚本中，并且   类似地将所有CSS组合成一个   单一样式表。合并文件是   脚本和时更具挑战性   样式表因页面而异，   但要将这部分发布   过程可以缩短响应时间。

Answer 3

就个人而言，我更喜欢将所有代码保存在一个文件中，因此浏览器只能获取一个文件而不是两个/三个/四个/无论如何。

但我认为这取决于个人偏好。