Posted about 3 years ago. Visible to the public.

The asset pipeline

The asset pipeline is Rails' mechanism how stylesheets, javascripts and images from your /assets folder are processed and delivered to the browser.

You have certainly already used it, but maybe do not know what happens behind the scenes.

Learn

  • Read Everything You Should Know About the Rails Asset Pipeline
  • Read How to make your application assets cachable in Rails
  • Read Managing vendor libraries with the Rails asset pipeline
  • Understand
    • What is "sprockets" and how does it relate to the asset pipeline?
    • What is a "manifest"? What does require, require_tree, require_self do?
    • What is "asset minification" and why is it necessary?
    • What is "asset concatenation" and why is it necessary?
    • What is "asset fingerprinting" and why is it necessary?
    • What is "precompiling"? How and when does it happen?
    • Why are the image-url and font-url necessary for sass urls?
    • What are "expiry" or "cache-control" headers? How do those work for our applications?
    • In Sass, it is possible to use @import "dir/*" instead of require_tree. What's the difference? Can you guess why we don't use this?

Exercise: Precompile your assets

  • In your MovieDB, add the following line to your config/environments/development.rb:

    Copy
    config.assets.compile = false config.assets.debug = false

    Then restart your server. This mimicks how applications work in production.

  • Now reload your page. It will probably show an exception or have broken stylesheets or Javascript. Try to get everything working again. You will need rake assets:precompile.
  • If you have trouble understanding why stuff does not work, read our card Rails asset pipeline: Why things break in production and what precompilation does to your assets
  • When you're done, remove the lines from your development.rb again and run rake assets:clobber. Keep other changes.

Exercise: Reorganize your JavaScript

In your MovieDB, take a look at your Javascript files. Are they organized like your ruby code, where every functional component lives in its own file in an appropriate directory?

If not, reorganize them using the asset pipeline.

Owner of this card:

Avatar
Tobias Kraze
Last edit:
almost 2 years ago
by Tobias Kraze
Posted by Tobias Kraze to makandra Curriculum
This website uses cookies to improve usability and analyze traffic.
Accept or learn more