First off, why?
inline css is bad because you can’t cache it at the browser level. The stylesheet_link_tag helper is there to make linking to the external css file easy. If you just plan to stick css into the page, you don’t need a helper for this - it’s over-engineering.
The browser, who caches the css, will also cache the html page, the
page's dynamic but I am using rails caching mechanism.
I am assuming that one file(html+css) is better than two files (html and
css) especially if its your home page. And using this I could inline
small js files too. Making the home page load slightly faster
I want to keep js/css files seperate from the html page, hence I need a
mechanism to inline css/js files. I like to keep things separate, at
least on the design level
let me know if anyone knows how to achieve this. some pointers in righ
direction will help too.
When using the rails caching mechanism you cache *on the server* not
on the browser (client). JS and CSS files are cached *on the client*
as well as the server. As a result you'd be caching one huge file
rather than a skinny file (html markup only) with very little
benefit. Properly designed you can send down the css ONCE and use it
for all the pages in your site... but the client only takes the hit
one time. In your proposed setup, they'll pay the price with every
page.
Should you still choose to do it, I'd assume you simply add a style
tag and then use ERb to read a file from disk and join it's lines
together with "\n" to put it's contents into the body of the style
tag. Maybe something like:
I want to keep js/css files seperate from the html page, hence I need a
mechanism to inline css/js files. I like to keep things separate, at
least on the design level
That’s why you use a separate css file and the link tag, using stylesheet_link_tag. If you’re saying you want a separate css file for each page, then you should use the stylesheet_link_tag anyway, and simply use a variable to determine which one to use.
In your layout, you can do
<%=stylesheet_link_tag @foo %>
And in your controller or before_filter or wherever, run logic to determine what css file to use
will look for /stylesheets/projects_show.css for /projects/show
end
No need to get more complicated than that. The whole point of having the css in a separate file is to allow the browser to cache it even when the page changes. The only reason to use the tag is to embed styles that are specific to a single page. Even then I wouldn’t use it in your case. Keeping the amount of code in the html page small keeps the size small, meaning you save bandwidth.
