组织大型JavaScript应用程序的工具和最佳实践

Question

我正在开发相当复杂的webapps /仪表板，主要是在Javascript中。我喜欢在服务器上使用mongo和node，但在客户端上通常存在特定于应用程序的库和脚本混乱。

我当前的项目包含bootstrap，jquery，jquery-ui，D3，leaflet，crossfilter以及一些模糊内容的组合，可以公平地说，尽管应用程序非常棒，但代码已经成为一种不圣洁的混乱。特别是D3和crossfilter的代码非常详细，例如，一个典型例子的官方来源crossfilter demo。

所以问题：组织大型JavaScript应用程序的好工具和最佳实践是什么？

我已经避免使用全局变量并尝试使用闭包来组织命名空间，但我担心我需要更多的结构。在服务器上有npm非常好，但在浏览器中有类似的东西吗？

我调查了require.js，backbone.js和coffeescript，但我不确定这些是否能真正解决问题或只是增加复杂性。

Answer 1

听起来你已经走在了正确的道路上，但这里有一些提示：

1. 使用框架。 Backbone现在很流行，但也有其他人。它将极大地帮助代码组织。实际上，如果您的应用程序具有任何大小，那么框架是绝对必须避免意大利面条代码。其他流行的框架包括Ember和Knockout。

2. 如果您决定不使用其中一个框架，请至少使用模板。例如Mustache或内置于下划线的那个。

3. 合并并缩小文件。主要是为了优化加载时间。理想情况下，您会发现要添加到后端的内容可以为您完成此操作。例如，Rails的“资产管道”使用名为Sprockets的东西。

4. 我确实听到有人对coffeescript赞不绝口。它并没有真正增加功能，但喜欢它的人说它使代码更清晰。

Answer 2

我认为“模块化”方法是您所需要的，模块的使用可以帮助您摆脱混乱。

您可以查看以下内容：

http://addyosmani.com/largescalejavascript/

http://www.yuiblog.com/blog/2007/06/12/module-pattern/

http://www.2ality.com/2011/04/modules-and-namespaces-in-javascript.html