davideisinger.com

My personal website
Log | Files | Refs | README

index.md (3384B)


      1 ---
      2 title: "Static Asset Packaging for Rails 3 on Heroku"
      3 date: 2011-03-29T00:00:00+00:00
      4 draft: false
      5 canonical_url: https://www.viget.com/articles/static-asset-packaging-rails-3-heroku/
      6 ---
      7 
      8 **Short Version:** the easiest way to combine and minify static assets
      9 (CSS and Javascript) in your Rails 3 app running on Heroku is to use
     10 [AssetPackager](https://github.com/sbecker/asset_packager) with [this
     11 fork of Heroku Asset
     12 Packager](https://github.com/cbeier/heroku_asset_packager). It just
     13 works.
     14 
     15 **Long version:** in his modern day classic, [High Performance Web
     16 Sites](https://www.amazon.com/High-Performance-Web-Sites-Essential/dp/0596529309),
     17 Steve Souders' very first rule is to "make fewer HTTP requests." In
     18 practical terms, among other things, this means to combine separate CSS
     19 and Javascript files whenever possible. The creators of the Rails
     20 framework took this advice to heart, adding the `:cache => true` option
     21 to the
     22 [`javascript_include_tag`](http://apidock.com/rails/ActionView/Helpers/AssetTagHelper/javascript_include_tag)
     23 and
     24 [`stylesheet_link_tag`](http://apidock.com/rails/ActionView/Helpers/AssetTagHelper/stylesheet_link_tag)
     25 helpers to provide asset concatenation at no cost to the developer.
     26 
     27 As time went on, our needs outgrew the capabilities of `:cache => true`
     28 and solutions like
     29 [AssetPackager](https://github.com/sbecker/asset_packager) came onto the
     30 scene, offering increased control over how assets are combined as well
     31 as *minification*, stripping comments and unnecessary whitespace from
     32 CSS and Javascript files before packaging them together. Later, even
     33 more sophisticated solutions like
     34 [Jammit](https://documentcloud.github.com/jammit/) arrived, offering
     35 even more minification capabilities including inlining small images into
     36 CSS.
     37 
     38 Of course, static asset packaging wasn't the only part of the Rails
     39 ecosystem that was undergoing major changes during this time. An
     40 increased emphasis on ease of deployment saw the rise of
     41 [Capistrano](https://github.com/capistrano/capistrano/wiki),
     42 [Passenger](http://www.modrails.com/), and eventually
     43 [Heroku](https://heroku.com/), which offers hands-free system
     44 maintenance and simple `git push heroku` deployment. This simplification
     45 is not without trade-offs, though; you can only write to your app's
     46 `tmp` directory and the lack of root access means that you can't install
     47 additional software. Both of these limitations have ramifications for
     48 static asset packaging, namely:
     49 
     50 1.  Both `:cache => true` and standard AssetPackager work by writing
     51     files into your app's `public` directory, which, as you can likely
     52     guess, is *verboten*.
     53 
     54 2.  Jammit has several compression options, but all of them require Java
     55     support, which we don't have on Heroku. You have the option of
     56     compressing your assets and checking them into your repository by
     57     hand, but I for one can't stand putting build artifacts in the repo.
     58 
     59 I've seen a lot of questions about how to do static asset packaging on
     60 Heroku and just as many bad answers (which I'll avoid linking to here).
     61 The best solution we've found uses
     62 [AssetPackager](https://github.com/sbecker/asset_packager) along with
     63 [this fork of Heroku Asset
     64 Packager](https://github.com/cbeier/heroku_asset_packager) that has been
     65 modified to work with Rails 3. It's not the sexiest solution, but it
     66 works, and you'll never have to think about it again.