adding js files to Rails3

Question

I'm a little confused even after going through the Rails Asset Pipeline tutorial. I'm trying to add the latest jquery files. Do I do this through the layout javascript_include_tag or through the application.js ?

If so what is the difference and how would I specify the actual build number if I was using //= require jquery in the application.js

<%= javascript_include_tag "http://ajax.googleapis.com/ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js", "jquery.rails.js", "application.js" %> 

The above method is adding jquery twice once with the above line and then through application.js

//= require jquery 

Is the application require getting the js file from the gem that's installed. In my Gemfile I have the line

gem 'jquery-rails' 

So my main question is where should I be loading my specific build of jquery from.

Answer 1

jquery-rails contains a specific version of jquery (which version will depend on the version of the gem), and that's what is included when you use //= require jquery. If you do this, you should not include jquery with javascript_include_tag.

If you want to use a different version than the one contained in the jquery-rails gem, then set it in the javascript_include_tag as you have it and leave out the //= require jquery instruction.

To explain a bit further, the //= require syntax is used by the asset pipeline to load (and when precompiled, merge into as well) specific files when the application.js is loaded. Among the primary benefits of this are the faster caching and delivery for the single resource file. Including several scripts separately using javascript_include_tag is another way to load the script, but since it adds a separate <script> tag for each file, it doesn't get the benefit that is offered by the //= require syntax.

For CDN served scripts, however, the lost benefit is mostly made up for. This is because they are likely already cached by the client, are served very quickly, and are guaranteed not to be modified in the future.

Answer 2

application.js

files are served (compressed and compiled) in one file in production, meaning:

//= require my_file 

You get:

<script ... src="/assets/application.js" ...> 

containing my_file in application.js, and compressed. This is in a default production configuration:

config.assets.compress = true # just to compress config.assets.compile = false # false to use precompiled assets, you precompile with rake assets:precompile # true to allow compilation in production 

NOTE: precompile is to convert scss and coffee files to css and javascript and save them under public directory, to not to hit Rails backend when those files are requested.

javascript_include_tag

javascript_include_tag 'application', 'my_second_file' 

You get:

<script ... src="/assets/application.js" ... > <script ... src="/assets/my_second_file.js" ... > 

You will have my_first_file embedded in application.js if you leave //= require my_first_file.

Where to put

As in production you won't be debugging, will you?, is good to put them in application.js.