在大型项目中管理JavaScript复杂性 [英] Managing JavaScript complexity in a large project

问题描述

我们正在使用多个应用程序构建一个django应用程序。每个应用程序具有不同的功能，必须以三种不同的模式（PC，平板电脑，手机）呈现。 JavaScript中有很多事情发生：管理从服务器接收的数据，处理用户事件，注入HTML片段和加载子组件。一些功能在应用程序和视图模式之间是共享的，但通常编写一个特定的功能是有意义的（例如，悬停和点击事件可能必须在PC布局与平板电脑布局方面不同），因此我们正在分组这在基于应用程序/布局/功能的文件中。

至此，我们使用一个平面文件结构命名来区分文件类型：

  ui.common.js 
 ui.app1.pc.handlers.js 
 ui.app1.pc.domManupulators.js 
 ui.app1.tablet.js 
 ui.app2.pc.js 
 ... 
  

然而，现在，随着应用程序（和角色）数量的增长，这种方式变得越来越不可用（我们接近20多个文件，并且在完成时可能会有40多个文件），所以我们把所有东西放在这样的目录中：

  js / 
 common / 
 core1。 js 
 ajax2.js 
 app1 / 
 tablet.js 
 pc.js 
 app2 / 
 mobile.js 
 ... 
  

我一直在看 JavaScriptMVC 来帮助这个。虽然它提供了有用的工具，但似乎没有什么可以让我们更好地管理我们的巨型JavaScript库。我们正在扩大我们的开发团队，代码可维护性非常重要。

有什么可能使我们的生活更轻松吗？你在工作中是否有任何习惯/经验法则可以缓解这种情况？

解决方案

Backbone.js 用于以MVC样式模式来组织JavaScript重型应用程序。这将是一些学习，但绝对是你会想看看和了解一点，即使你不最终使用它。

它是用于相当令人印象深刻的项目

而且，这是一个网站，了解更多信息，附带教程。

What should I use to manage growing number of JavaScript files in my application?

We are building a django application with several apps. Each app has different functionality, and has to be rendered in three different modes (pc, tablet, mobile). There is a lot of things happening in JavaScript: managing data received from the server, handling user events, injecting HTML snippets, and loading sub-components. Some of the functinality is shared between apps and view modes, but often it makes sense to write a specific functions (for example, hover and click events may have to be handled differently on a PC layout vs. a tablet layout) so we are grouping this in files based on app/layout/function.

Up to a point we were using a flat file structure with naming to differentiate types of files:

ui.common.js
ui.app1.pc.handlers.js
ui.app1.pc.domManupulators.js
ui.app1.tablet.js
ui.app2.pc.js 
...

Right now, however, as the number of apps (and corner cases) grows this way is fast becoming unusuable (we're approaching 20+ files and expecting maybe 40+ by the time we're done), so we are putting everything in directories like so:

js/
  common/
    core1.js
    ajax2.js
  app1/
    tablet.js
    pc.js
  app2/
    mobile.js
    ...

I have been looking at JavaScriptMVC to help with this. While it does offer useful tools it doesn't seem to have anything that would specifically make managing our giant JavaScript library better. We are expanding our dev team soon and code maintainability is very important.

Is there something that may make our life easier? Are there any habits/rules of thumb you use in your work that could alleviate this?

解决方案

Backbone.js is used to organize javascript heavy applications in an MVC-style pattern. It's going to take some learning, but it's definitely something you'll want to look into and learn a bit about even if you don't end up using it.

It's used on quite a few pretty impressive projects

And, here's a site to learn more with tutorials.

这篇关于在大型项目中管理JavaScript复杂性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！