Why does a rails app on heroku serve assets via all.css and locally via individual files

Question

I\'m a rails newbie, I\'ve been trying to figure out what is going on with the stylesheets_link_tag on heroku.

If I use

= stylesheet_link_tag \"style         


        

Answer 1

This is the result of calling :cache => true on your stylesheet link tag.

:cache => true takes all of the stylesheets provided and concatenates them into one file called all.css.

The reason you're only seeing this on your Heroku deployment is because it calls the concatenated all.css only when the Rails application is running in production mode.

So for example let's say I have three stylesheets and I include them in my header:

= stylesheet_link_tag "application", "jquery-ui", "style", :cache => true

When in development, this will include application.css, jquery-ui.css, and style.css (in that order).

In production, it will concatenate all of the CSS from the three files (in the order provided) into one single file called "all.css", which will be the only CSS file included.

The benefit is making fewer HTTP requests in production and ideally a smaller file size for your included CSS, which should hopefully speed up page load.

Edit As Casper points out in the comments, Heroku has a read-only filesystem. You might want to look at Heroku Asset Packager for a Heroku-specific solution.

Answer 2

Tested this and it did not work for me (adding config.serve_static_assets = true to production.rb)

Answer 3

Setting :cache => true causes my requests to fail outright.

My solution for the short term is to add the following to my config/environments/prodcution.rb

config.serve_static_assets = true

I'm slightly less worried about the performance being behind Cloudflare. Finding a way to serve my css and js files concatenated is on my to-do list.