Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

assets:precompile still incredibly slow #26

Closed
chrisnicola opened this Issue · 38 comments

9 participants

@chrisnicola

I'm seeting times of several minutes to compile with compass. Same issue as the one linked below I assume. Is there any further progress or guidance on this problem yet? Was it fixed or is it still a known issue?

Compass/compass#516

@chriseppstein

I decided to go ahead with the release knowing there were still some performance issues -- but the rest of the project was stable and the API was solid.

Several minutes is clearly unacceptable and we need to get to the bottom of it.

@chrisnicola

Thanks, let me know if I can help, I'd be happy to run some tests for you.

@chriseppstein

Help would be greatly appreciated. I have found that most of the issues are related to performance of @import when sass-rails delegates finding imports to sprockets. But I really need hard data to go on from profiling.

@jdelStrother

I spent quite a long time going through profile dumps of our assets compilation (which currently takes nearly 3 minutes on our production servers), and basically came to the conclusion there were no easy performance gains to be found in compass, sprockets, or trail. Concatenating all the compass files I needed into a single file helped a bit, but it only saved 5-10%.

I'm working on an alternative approach - don't blow away the cache that sprockets worked so hard to create before every 'rake assets:precompile'. I'm still figuring out its problems and the correct way of implementing it at rails/rails#5497

@siefca

In my case (compiling screen.css and print.css separately) and using scaffolded examples:

real    6m29.579s
user    6m7.224s
sys     0m18.959s
@chrisnicola chrisnicola referenced this issue in twbs/bootstrap-sass
Closed

SCSS compilation is very slow with jruby #90

@chrisnicola

Might be worth noting I've only really experienced this problem heavily with twitter bootstrap conversions from less to scss. I've tried a couple, notable compass_twitter_bootstrap and bootstrap-sass and both have compile time problems, taking about 4 minutes on my machine (the former is a little slower).

Using bootstrap-rails (which uses less with the asset pipeline) cuts this down to about 30s.

Not sure if that's helpful.

@chrisnicola

The fix to sass/sass#337 actually fixes this completely for me. Just found it.

You'll need to use the master branch in your Gemfile.

  gem 'sass', git: 'git://github.com/nex3/sass.git'
@macmartine

@lucisferre I'm using sass-rails, and not using the sass gem. It's still ridiculously slow. I tried also installing the master sass branch as suggested, but I'm assuming the problem it still in the sass-rails gem? Any idea how I can get around this? It's unbearable.

@chrisnicola

No it's in the sass gem and you shouldn't need the master branch anymore it's been released, just gem 'sass' now.

How slow is slow? Mine takes about 30s.

@macmartine

Ok, thanks. Maybe this issue isn't exactly the one I'm seeing. Each time I reload a page in development mode it takes yes, about 30 seconds. That can't be normal? I'm not sure if it's specifically compass related or sass but there's no way I can continue developing with page loads that take this long so I'm trying to figure out the culprit. Thanks!.

@jdelStrother

If you have a number of separate css/js files, try setting config.assets.debug = false in your development.rb, which will join them into a single file (like in production). It's significantly faster for us that way.

@macmartine

If I just use the sass gem, and not sass-rails, I hit this Compass/compass#654
With sass-rails and not this gem I'm still seeing 20+ second page loads. It's starting to look like I need to yank compass out of my app...

@chriseppstein

@macmartine compass does a lot of importing and importing via sprockets in rails is very slow. You may see better performance if you can isolate your compass imports to a single partial at the start of the stylesheet. If this doesn't sound like what's going on here, can you please zip up your stylesheets and relevant configuration into a minimal rails app that reproduces your issue and I will investigate what is going on.

In the meantime, you may find that using bundle exec compass watch makes development much more responsive.

@chrisnicola

Yeah though @chriseppstein I havn't had problems whether or not I use one or multiple output CSS files. That said I just have one, everything is output to application.css now which I agree is the best pattern for using compass and rails.

Macmartine, try not using Webrick, it is slow as crap. Octopress generates a static site and also uses Compass. I get 30s page loads with Webrick on my VM for every page load even though it doesn't actually recompile each load. Switching to Thin or something else fixes it instantly. Honestly don't understand why Webrick is a default.

@macmartine

@chriseppstein Thanks. Even though all my stylesheets are imported via application.css.sass after compass is imported, when I deploy to production without it, asset compilation fails unless each individual file imports compass. So I had @import "globals", (which imports all the compass and blueprint stylesheets I need) at the beginning of all my stylesheets, b/c this is the only way I can get it to work. I just removed all those extra imports which at least for the moment, has helped. It's a hassle though b/c I'll have to put those imports back before each deploy. Thanks again.

@macmartine

@lucisferre I've tried webrick and passenger. Same issue.

@chriseppstein

@macmartine Each css file you make will need to import compass, but partials should not need to as they can rely on it being already imported. Are you meaning to make so many css files?

@macmartine

My layout only imports application.css.sass which then imports compass, then a sass file for each controller. None of those controller sass files are imported on their own, which makes them considered partials, right? So it seems like they shouldn't all need to import compass, but my deploy required it.

@chriseppstein

Ah. Maybe you are using //= require? instead of @import?

@macmartine

No: https://gist.github.com/2510597 And I just searched the project to be sure and only found '//= require' in my application.js file.

@chriseppstein

You're deploy shouldn't require it then. What is the value of config.assets.precompile

@macmartine

config.assets.precompile += ['.js', 'controllers/.js', 'controllers/admin/.js', 'controllers/shared/.js', '.coffee', '.css.scss', '.css.sass', '.css', '.png', '.jpg', '*.scss.erb']

@chriseppstein

Ah. well there you go, you're telling sprockets to compile all of them. Did you set that or did it happen magically somehow?

@macmartine

Ah, I see. I set it, but now I get why it's causing the issue. Thank you!!!

@chrisnicola

BTW I've really taken to the Octopress style of organizing my SASS if that's helpful to you:

application.css.scss   // mother of all imports
_pages.scss                 // organizes the imports for /pages
_base.scss                   // organizes the imports for all /base and libraries (compass, bootstrap etc)
/base                              // contains things like:
    _variables.scss
    _mixins.scss
    _typography.scss
    _navbar.scss
    _forms.scss
/pages                        // contains partials that only apply to specific controller views, wrap CSS in body.controller {}
    _home.scss
    _users.scss
    _books.scss
@chriseppstein

@macmartine so now you should be able to refactor and the reload time should become more bearable. please let us know how that goes.

@macmartine

I changed it to this: config.assets.precompile += ['.js', 'controllers/.js', 'controllers/admin/.js', 'controllers/shared/.js', '.coffee', 'application.css.scss', '.css', '.png', '.jpg', '*.scss.erb']

But it still fails on deploy "Undefined mixin 'column' in 'account.css.sass". Why would it fail if this file is only imported by application.css.sass which first imports compass and blueprint?

@chriseppstein

@macmartine I don't know. this is very hard to debug without access to your code.

@chrisnicola

@macmartine I had similar problems. Use the underscore in front of anything you are not compiling to a CSS file. Otherwise SASS will automatically create one independent of your other imports. Look at my layout above for an example. The only *.css.scss file without an underscore should be application.css.scss. The rest just _{name}.css.

@macmartine

@lucisferre Ah! I was wondering if the underscore was more than simply a naming convention. I'll do it -- thank you!

@alanhogan

Use the underscore in front of anything you are not compiling to a CSS file. Otherwise SASS will automatically create one independent of your other imports.

Is this actually true in a compass-rails context? Non-underscore-prefixed .sass/.scss files don’t seem to automatically end up as part of the pipeline. Surely they aren’t actually being compiled and discarded?

@chrisnicola

@alanhogan I believe you are right, the underscore isn't that important, it's just a convention for partials. It is the .css.scss file extension I believe that causes a CSS file to be output. So instead just use .scss.

@chrisnicola chrisnicola closed this
@StrangeDays

Install node.js

in Gemfile
*) gem 'execjs'

in application.rb
class Application < Rails::Application
.....

if defined?(ExecJS) && system('which node')
puts "Using Node ExecJS runtime"
ExecJS.runtime = ExecJS::Runtimes::Node
end
end


for me it speed up essentially the rake assets:precompile -- with 'essentially' I'm talking about dozens of minutes (before I canceled after 30 minutes)

@jdelStrother

That would only affect javascript compilation times, presumably? It's made no detectable difference to my precompile times.

@kylefox

I'm still experiencing this issue, are others? Running bundle exec rake RAILS_ENV=production RAILS_GROUPS=assets assets:precompile during deployments takes over 10 minutes. I have multiple files (mostly partials) but they're all quite small.

// Vendor
@import "compass"

// Partial
@import "bootstrap-config"

// Vendor
@import "bootstrap"

// Partials
@import "utils"
@import "base"
@import "header"
@import "signup-form"
@import "offers"
@import "footer"
@chrisnicola

I'd suggest trying not to import all of compass at the top if you can and just the specific parts you are using. While this is a general issue, compass is probably where most of the time is being eaten up.

@kylefox

Thanks for the tip!

I changed it to @import "compass/css3" and moved all the code in my partials to a single file -- no speed improvement :/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.