Rails 3:在哪里放javascript的好经验法则?

时间:2022-03-12 13:08:46

When writing javascript for a specific page in a site, when do you want to turn the javascript into a function and include it in application.js?

在为网站中的特定页面编写javascript时,您何时想将javascript转换为函数并将其包含在application.js中?

I've seen suggestions about doing this (and minifying or gzip-ing) to minimize HTTP requests. That makes sense, but what about maintainability? If I have js code specific to one view, it seems like more work to look into a potentially massive application.js. That code could be embedded into that view or put in its own .js (or .js.erb or .rjs) file in that view folder.

我已经看到了关于这样做(以及缩小或gzip-ing)的建议,以最小化HTTP请求。这是有道理的,但可维护性呢?如果我有一个特定于一个视图的js代码,那么看一下潜在的大量application.js似乎更多的工作。该代码可以嵌入到该视图中,也可以放在该视图文件夹中的自己的.js(或.js.erb或.rjs)文件中。

I've seen another suggestion that Rails automatically merges all javascript into one file. Is this true?

我已经看到另一个建议,Rails会自动将所有javascript合并到一个文件中。这是真的?

TLDR: how much or how little should a developer worry about optimization when writing javascript?

TLDR:开发人员在编写javascript时担心优化需要多少或多少?

1 个解决方案

#1


47  

As I haven't seen an answer in about a month, I'll answer this question to the best of my current knowledge.

由于我在大约一个月内没有看到答案,我将尽我所能回答这个问题。

Rails 3.1 (currently at release candidate 4) introduces sprockets, which will compile all javascript in a rails project into one file. It even comes with tools to minify and compress javascript so that it's all delivered to the client at once.

Rails 3.1(目前在候选版本4)引入了sprockets,它将rails项目中的所有javascript编译成一个文件。它甚至还带有缩小和压缩javascript的工具,以便将它们全部交付给客户端。

Related to sprockets is the Rails 3.1 asset pipeline. As I understand, it's a folder hierarchy/abstraction. Javascripts can go into 3 folders:

与sprockets相关的是Rails 3.1资产管道。据我所知,这是一个文件夹层次结构/抽象。 Javascripts可以进入3个文件夹:

/apps/assets/javscripts/
Javascript files specific to the application, including application.js. This should only contain the manifest of javascript files you want to include in your project. The rails new tool will generate this file and include jquery in the manifest.

/ apps / assets / javscripts /特定于应用程序的Javascript文件,包括application.js。这应该只包含要包含在项目中的javascript文件的清单。 rails新工具将生成此文件并在清单中包含jquery。

/lib/assets/javascripts/
Javascript files written by the developer that are more general purpose. (My impression is that this would be for javascript libraries you develop to drop into multiple applications)

/ lib / assets / javascripts /由开发人员编写的更通用的Javascript文件。 (我的印象是,这将是您开发的javascript库放入多个应用程序)

/vendor/assets/javascripts/
Third party javascript files (i.e. JQuery, Modernizr)

/ vendor / assets / javascripts /第三方javascript文件(即JQuery,Modernizr)

All files in these folders will appear to the client inside /assets/, abstracting out the server side file paths. I assume this is meant to help the developer organize javascript files.

这些文件夹中的所有文件都将显示在/ assets /中的客户端,从而抽象出服务器端文件路径。我认为这是为了帮助开发人员组织javascript文件。

To answer my own question

回答我自己的问题

  • Put javascript functions into separate files, group them logically. My test app indicated that subfolders within .../assets/javascripts/ are ok if and only if the subfolder path is included in the manifest.
    • I.E. putting //= subfolder/js_file in the manifest will work. Putting //= js_file will not if js_file is inside .../javascripts/subfolder/
    • I.E.将// = subfolder / js_file放入清单中将起作用。如果js_file在... / javascripts /子文件夹/中,则放置// = js_file
    • DHH mentions a "rule of 13" in his talk (linked below). If the number of javascripts in a folder exceeds 13, it starts to look messy and unmanageable. This would be a good time to group javascript files into subfolders.
    • DHH在他的演讲中提到了“13规则”(下面链接)。如果文件夹中的javascripts数量超过13,则开始看起来很乱并且难以管理。这是将javascript文件分组到子文件夹的好时机。
  • 将javascript函数放入单独的文件中,逻辑分组。我的测试应用程序表明,当且仅当子文件夹路径包含在清单中时,... / assets / javascripts /中的子文件夹才可以。 I.E.将// = subfolder / js_file放入清单中将起作用。如果js_file在里面,则放置// = js_file; / javascripts / subfolder / DHH在他的谈话中提到“13规则”(下面链接)。如果文件夹中的javascripts数量超过13,则开始看起来很乱并且难以管理。这是将javascript文件分组到子文件夹的好时机。
  • Use the built in Rails 3.1 minifier and compressor (or install a preferred gem)
  • 使用内置的Rails 3.1 minifier和压缩器(或安装一个首选的gem)
  • Refactor javascript code from time to time. Move functions to /lib/assets/javascripts/ over time. (The goal is to eventually recognize when you want to write general purpose javascript functions as opposed to application-specific ones and eliminate this refactor step)
  • 不时重构javascript代码。随着时间的推移将函数移动到/ lib / assets / javascripts /。 (目标是最终识别何时编写通用JavaScript函数而不是特定于应用程序的函数并消除此重构步骤)

More Resources

a blog post covering all changes in Rails 3.1
DHH's talk on Rails 3.1 changes, May 16 2011 (~1 hr)

一篇博文,内容涵盖了Rails 3.1中的所有变化DHH关于Rails 3.1变化的讨论,2011年5月16日(~1小时)

#1


47  

As I haven't seen an answer in about a month, I'll answer this question to the best of my current knowledge.

由于我在大约一个月内没有看到答案,我将尽我所能回答这个问题。

Rails 3.1 (currently at release candidate 4) introduces sprockets, which will compile all javascript in a rails project into one file. It even comes with tools to minify and compress javascript so that it's all delivered to the client at once.

Rails 3.1(目前在候选版本4)引入了sprockets,它将rails项目中的所有javascript编译成一个文件。它甚至还带有缩小和压缩javascript的工具,以便将它们全部交付给客户端。

Related to sprockets is the Rails 3.1 asset pipeline. As I understand, it's a folder hierarchy/abstraction. Javascripts can go into 3 folders:

与sprockets相关的是Rails 3.1资产管道。据我所知,这是一个文件夹层次结构/抽象。 Javascripts可以进入3个文件夹:

/apps/assets/javscripts/
Javascript files specific to the application, including application.js. This should only contain the manifest of javascript files you want to include in your project. The rails new tool will generate this file and include jquery in the manifest.

/ apps / assets / javscripts /特定于应用程序的Javascript文件,包括application.js。这应该只包含要包含在项目中的javascript文件的清单。 rails新工具将生成此文件并在清单中包含jquery。

/lib/assets/javascripts/
Javascript files written by the developer that are more general purpose. (My impression is that this would be for javascript libraries you develop to drop into multiple applications)

/ lib / assets / javascripts /由开发人员编写的更通用的Javascript文件。 (我的印象是,这将是您开发的javascript库放入多个应用程序)

/vendor/assets/javascripts/
Third party javascript files (i.e. JQuery, Modernizr)

/ vendor / assets / javascripts /第三方javascript文件(即JQuery,Modernizr)

All files in these folders will appear to the client inside /assets/, abstracting out the server side file paths. I assume this is meant to help the developer organize javascript files.

这些文件夹中的所有文件都将显示在/ assets /中的客户端,从而抽象出服务器端文件路径。我认为这是为了帮助开发人员组织javascript文件。

To answer my own question

回答我自己的问题

  • Put javascript functions into separate files, group them logically. My test app indicated that subfolders within .../assets/javascripts/ are ok if and only if the subfolder path is included in the manifest.
    • I.E. putting //= subfolder/js_file in the manifest will work. Putting //= js_file will not if js_file is inside .../javascripts/subfolder/
    • I.E.将// = subfolder / js_file放入清单中将起作用。如果js_file在... / javascripts /子文件夹/中,则放置// = js_file
    • DHH mentions a "rule of 13" in his talk (linked below). If the number of javascripts in a folder exceeds 13, it starts to look messy and unmanageable. This would be a good time to group javascript files into subfolders.
    • DHH在他的演讲中提到了“13规则”(下面链接)。如果文件夹中的javascripts数量超过13,则开始看起来很乱并且难以管理。这是将javascript文件分组到子文件夹的好时机。
  • 将javascript函数放入单独的文件中,逻辑分组。我的测试应用程序表明,当且仅当子文件夹路径包含在清单中时,... / assets / javascripts /中的子文件夹才可以。 I.E.将// = subfolder / js_file放入清单中将起作用。如果js_file在里面,则放置// = js_file; / javascripts / subfolder / DHH在他的谈话中提到“13规则”(下面链接)。如果文件夹中的javascripts数量超过13,则开始看起来很乱并且难以管理。这是将javascript文件分组到子文件夹的好时机。
  • Use the built in Rails 3.1 minifier and compressor (or install a preferred gem)
  • 使用内置的Rails 3.1 minifier和压缩器(或安装一个首选的gem)
  • Refactor javascript code from time to time. Move functions to /lib/assets/javascripts/ over time. (The goal is to eventually recognize when you want to write general purpose javascript functions as opposed to application-specific ones and eliminate this refactor step)
  • 不时重构javascript代码。随着时间的推移将函数移动到/ lib / assets / javascripts /。 (目标是最终识别何时编写通用JavaScript函数而不是特定于应用程序的函数并消除此重构步骤)

More Resources

a blog post covering all changes in Rails 3.1
DHH's talk on Rails 3.1 changes, May 16 2011 (~1 hr)

一篇博文,内容涵盖了Rails 3.1中的所有变化DHH关于Rails 3.1变化的讨论,2011年5月16日(~1小时)