Compilation time is the same after switching from grunt-contrib-sass to grunt-sass. Both takes the same amount of time as when I was using Ruby

Question

I heard about "lighting fast" Libsass. I switched from Ruby to Grunt. But no matter which compile method I use (Ruby, grunt-contrib-sass, grunt-sass), speed is the same. 15 seconds on compiling bootstrap-scss.

grunt.js:

module.exports = function (grunt) {
    require('time-grunt')(grunt);

    grunt.initConfig({
        watch: {
            src: {
                files: ['public_html/sass/*.scss'],
                tasks: ['compass:dev']
            },
            options: {
                livereload: true
            }
        },
        compass: {
            dev: {
                options: {
                    config: 'config.rb'
                }
            }
        }
    });
    grunt.loadNpmTasks('grunt-contrib-compass');
    grunt.loadNpmTasks('grunt-sass');
    grunt.loadNpmTasks('grunt-contrib-watch');
};

config.rb:

# Require any additional compass plugins here.
require 'bootstrap-sass'

# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "public_html/css"
sass_dir = "public_html/sass"
images_dir = "public_html/images"
javascripts_dir = "public_html/js"
fonts_dir = "public_html/fonts"

# You can select your preferred output style here (can be overridden via the command line):
# output_style = :expanded or :nested or :compact or :compressed
# output_style = :expanded
environment = :development

# To enable relative paths to assets via compass helper functions. Uncomment:
relative_assets = true

# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false
line_comments = true

sourcemap = true
sass_options = {:sourcemap => true}

# If you prefer the indented syntax, you might want to regenerate this
# project again passing --syntax sass, or you can uncomment this:
# preferred_syntax = :sass
# and then run:
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass

score 0 · Accepted Answer · edited Jan 17 '15 at 14:49

With your configuration you are still using Compass to compile your SCSS files, the grunt-sass task is neither being configured nor run at all. You are not seeing an improvement in the compile time since Compass is Ruby based and is still using the Ruby SASS pre-processor.

Libsass is the C/C++ implementation of the SASS compiler which does away with Ruby completely. In the comments of this blog post it is mentioned that Compass has a lot of Ruby dependency and as such will not be ported to Libsass in the foreseeable future. If you are, therefore, relying heavily on Compass mixins and functions you will have to stick with the Ruby pre-processor.

If you can do away with Compass you can use grunt-sass with the following configuration:

module.exports = function(grunt) {
  grunt.initConfig({
    watch: {
        src: {
            files: ['public_html/sass/*.scss'],
            tasks: ['sass:dev']
        },
        options: {
            livereload: true
        }
    },
    sass: {
        options: {
            sourceMap: true,
            outputStyle: 'expanded'
        },
        dev: {
          files: [{
            expand: true,
            src: ['public_html/sass/**/*.{scss,sass}'],
            dest: 'public_html/css/'
          }]
        }
    }
  });

  grunt.loadNpmTasks('grunt-sass');
  grunt.loadNpmTasks('grunt-contrib-watch');
}

Check out the grunt-sass page for more info on the available options.

Compilation time is the same after switching from grunt-contrib-sass to grunt-sass. Both takes the same amount of time as when I was using Ruby

grunt.js:

config.rb:

1 Answers1