Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Asset Pipeline

1. What does it mean to precompile files? What does this have to do with Coffeescript and Sass files? Does it only have to do with Coffeescript and Sass files?

Precompiling asset files is a way to help browsers make fewer requests to your webserver to display items on your page. Precompiling is done in Rails via the asset pipeline.

Precompiling consists of 3 tasks: concatenating assets, minifying assets, and providing a way to access those assets in other languages.

CoffeeScript and SASS are JavaScript and CSS frameworks that help with the styling and user experience of your app. In particular, CoffeeScript is a way to write JavaScript with Rubyish syntax. In a production environment, it helps with speed and efficiency to concatenate them, which means combining all the files in which they appear into one master file for each language for the server to reference as a block. The asset pipeline also minifies them, which means removing whitespace and comments, as well as transforming them into a faster, compressed machine-readable shorthand.

The third feature of the asset pipeline, the language interface, allows you to access your assets in different languages while writing the actual code. Essentially, this means being able to write CoffeeScript and SASS right in your ERB files.

2. What does it mean to minify files? Why would we want to minify files?

Minifying files is a way to compress them into a machine-readable form for the use of the browser and server. It helps with the speed and efficiency of your app.

3. What does Sprockets do and how does it fit into the precompile / minify puzzle?

Sprockets is a middleware provided in Rails that implements the asset pipeline with minimal effort required on the part of the developer. It performs the concatenation of the assets files.

4. Why are these not the same?

The file in the editor displays the pointers to the jQuery library, which the asset pipeline found and concatenated. The file on the page displays the actual jQuery library.

5. What is a manifest (in terms of the asset pipeline)? Where can you find two manifests in Catch ‘em All?

A manifest tells the asset pipeline manager where to find the files related to asset display and what to do with them. The two manifests in this project are application.js and application.css.scss, both in the app/assets folder.

6. In regular HTML files, we import CSS files with <link rel="stylesheet" href="application.css"> . How is this done in a Rails project? Where do you see this line in Catch ‘em All?

In a Rails app, the importation of CSS files is done in the CSS manifest, which in this project is application.css.scss.

7. How is a digest or fingerprint used on assets for caching purposes?

From the Rails docs on the asset pipeline:

Fingerprinting is a technique that makes the name of a file dependent on the contents of the file. When the file contents change, the filename is also changed. For content that is static or infrequently changed, this provides an easy way to tell whether two versions of a file are identical, even across different servers or deployment dates.

When a filename is unique and based on its content, HTTP headers can be set to encourage caches everywhere (whether at CDNs, at ISPs, in networking equipment, or in web browsers) to keep their own copy of the content. When the content is updated, the fingerprint will change. This will cause the remote clients to request a new copy of the content. This is generally known as cache busting.

The technique Sprockets uses for fingerprinting is to insert a hash of the content into the name, usually at the end.

This is the strategy adopted by the Rails asset pipeline.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.