webCoder
webCoder

Reputation: 2222

how to remove whitespaces in HTML source code in Demandware?

I am working on demandware platform. I getting too much spaces in source code(HTML). I dont have any idea how can i optimize it, please help me.

Thanks in advance

Upvotes: 11

Views: 3051

Answers (6)

Kevin Truin
Kevin Truin

Reputation: 21

There seems to be issues with local includes in sourcecode leaving multiple blank lines. Modules.isml can be especially offensive. Setting compact to 'true' doesn't help.

I recently combined @sholsinger's answer with the Demandware/SFCC Build Suite, which uses grunt rather than gulp, to address this.

The basics look something like this:

Added grunt-contrib-htmlmin to task_loader.js and package.json and ran npm install.

Added htmlmin.js in grunt/config.

module.exports = {
minify: {
    options: {
        removeComments: true,
        collapseWhitespace: true
    },
    files: {
        '<%= dw_properties.folders.code %>app_core/cartridge/templates/default/util/modules.isml': '<%= dw_properties.folders.code %>app_core/cartridge/templates/default/util/modules.isml',  
    }
}
}

Then added it to alises.yaml: 'htmlmin:minify'

Upvotes: 2

Ed Gonzalez
Ed Gonzalez

Reputation: 1882

We have limited control over the end result, however there is the iscontent tag, which has an attribute compact.

<iscontent type="text/html" compact="true" />

Note, this tag does not filter down to included templates. Each included template requires its own iscontent tag to compress whitespace. Demandware states that compact might break the layout of tags like <pre>, so use caution.

Upvotes: 12

sholsinger
sholsinger

Reputation: 3088

Moku has successfully used the html-minifier package to compress template files to remove white space on sheplers.com. We added it to the gulp process that is based on Site Genesis's build scripts. (circa late 2015) Since we're using gulp we used the gulp wrapper package gulp-htmlmin. The gulp task looks like:

gulp.task('isml', function() {
    var htmlminOptions = {
    collapseWhitespace: true,
    includeAutoGeneratedTags: false
    };

    paths.isml.forEach(function(p) {
        gulp.src(path.join(rootPath, p), { base: './' })
            .pipe(htmlmin(htmlminOptions))
            .pipe(gulp.dest('./'));
    });
});

The package.json paths directive for isml looks like the following. Note that you can add any ISML files that generate excessive whitespace to this list but we found that the majority of the offending whitespace was generated by this one file alone.

"isml" : [
  "app_storefront_core/cartridge/templates/default/util/modules.isml"
]

Upvotes: 0

Michael GIllman
Michael GIllman

Reputation: 86

If you use Demandware's Build Suite, you can have it concatenate whitespace during the build process.

You can find information about the Build Suite here: https://bitbucket.org/demandware/build-suite (private repo)

Upvotes: 0

SpliFF
SpliFF

Reputation: 38976

Depends what you mean by 'optimize'. If you simply want to reduce the download size then enabling Gzip compression on the web server is preferable as it collapses the data required for whitespace down to nearly zero and in addition compresses the rest of your markup. If you had another reason in mind then please elaborate. If for example you want the source code to be 'clean' for debugging/development purposes then you may achieve the same result using a source code cleaner on the client side (ie, a Firefox plugin or interface to HTMLTidy).

Upvotes: 4

davehale23
davehale23

Reputation: 4372

I am assuming that you are using their Demandware Commerce or another one of their Services. Since they provide all the back end code for their eCommerce sites, it is extremely unlikely that you will be able to tone down their 'whitespace'. If you view the source on their own home page you will also see tons of extra 'whitespace'. This is just a product of their content management system.

Are you just worried about the extra overhead (file size) of the pages or do you have another concern?

Upvotes: -1

Related Questions