-
Notifications
You must be signed in to change notification settings - Fork 10
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Minify Templates based on a white list #14
Changes from 1 commit
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Large diffs are not rendered by default.
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -6,10 +6,13 @@ const stripWhiteSpace = Util.stripWhiteSpace; | |
const isWhitespaceTextNode = Util.isWhitespaceTextNode; | ||
const hasLeadingOrTrailingWhiteSpace = Util.hasLeadingOrTrailingWhiteSpace; | ||
const stripNoMinifyBlocks = Util.stripNoMinifyBlocks; | ||
const canTrimBlockStatementContent = Util.canTrimBlockStatementContent; | ||
const canTrimElementNodeContent = Util.canTrimElementNodeContent; | ||
const assignDefaultValues = Util.assignDefaultValues; | ||
|
||
class HBSMinifierPlugin { | ||
|
||
static createASTPlugin() { | ||
class BasePlugin { | ||
static createASTPlugin(config) { | ||
config = config || {}; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I think at the point |
||
let preStack = []; | ||
let visitor = { | ||
TextNode(node) { | ||
|
@@ -21,13 +24,14 @@ class HBSMinifierPlugin { | |
|
||
BlockStatement: { | ||
enter(node) { | ||
if (node.path.original === 'no-minify') { | ||
preStack.push(true); | ||
let canTrim = canTrimBlockStatementContent(node, config); | ||
if (!canTrim) { | ||
preStack.push(node); | ||
} | ||
}, | ||
|
||
exit(node) { | ||
if (node.path.original === 'no-minify') { | ||
if (preStack[preStack.length - 1] === node) { | ||
preStack.pop(); | ||
} | ||
}, | ||
|
@@ -52,13 +56,19 @@ class HBSMinifierPlugin { | |
|
||
exit(node) { | ||
node.body = stripNoMinifyBlocks(node.body); | ||
|
||
if (preStack[preStack.length - 1] === node) { | ||
preStack.pop(); | ||
} | ||
}, | ||
}, | ||
|
||
ElementNode: { | ||
enter(node) { | ||
if (node.tag === 'pre') { | ||
preStack.push(true); | ||
let canTrim = canTrimElementNodeContent(node, config); | ||
|
||
if (!canTrim) { | ||
preStack.push(node); | ||
} | ||
|
||
if (preStack.length !== 0) { | ||
|
@@ -79,7 +89,7 @@ class HBSMinifierPlugin { | |
exit(node) { | ||
node.children = stripNoMinifyBlocks(node.children); | ||
|
||
if (node.tag === 'pre') { | ||
if (preStack[preStack.length - 1] === node) { | ||
preStack.pop(); | ||
} | ||
} | ||
|
@@ -88,15 +98,26 @@ class HBSMinifierPlugin { | |
|
||
return { name: 'hbs-minifier-plugin', visitor }; | ||
} | ||
|
||
transform(ast) { | ||
let plugin = HBSMinifierPlugin.createASTPlugin(); | ||
|
||
this.syntax.traverse(ast, plugin.visitor); | ||
|
||
return ast; | ||
} | ||
|
||
} | ||
|
||
module.exports = HBSMinifierPlugin; | ||
module.exports = function(config) { | ||
config = config || {}; | ||
config = assignDefaultValues(config); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I am missing the previous default config where (without any configuration) There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
|
||
return class HBSMinifierPlugin extends BasePlugin { | ||
|
||
transform(ast) { | ||
let startLoc = ast.loc ? ast.loc.start : {}; | ||
/* | ||
checking for line and column to avoid registering the plugin for ProgramNode inside a BlockStatement. | ||
*/ | ||
if (startLoc.line !== 1 || startLoc.column !== 0) { | ||
return ast; | ||
} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I don't understand why this is necessary. Isn't the There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. In ember 2.15, the transform is called for all the There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. that is a bug in Ember 2.15 that is already fixed again afaik /cc @rwjblue There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. @Turbo87 Do you want this issue to be patched up or should I keep it as an issue for that particular Ember versions? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I think we should no guard against that. The transform that we do should be idempotent so the only advantage of this guard should be less work to do for the buggy versions. |
||
|
||
let plugin = HBSMinifierPlugin.createASTPlugin(config); | ||
this.syntax.traverse(ast, plugin.visitor); | ||
return ast; | ||
} | ||
}; | ||
}; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,18 +1,30 @@ | ||
/* eslint-env node */ | ||
'use strict'; | ||
let objectHash = require('object-hash'); | ||
|
||
module.exports = { | ||
name: 'ember-hbs-minifier', | ||
|
||
setupPreprocessorRegistry(type, registry) { | ||
if (type === 'parent') { | ||
let HbsMinifierPlugin = require('./hbs-minifier-plugin'); | ||
_setupPreprocessorRegistry(app) { | ||
let registry = app.registry; | ||
let options = app.options || {}; | ||
let config = options['ember-hbs-minifier'] || {}; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I think this is the point at which we should apply the config defaults. If There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. In that case, if the user provides a config, he need to pass the defaults ( {
skip: {
elements: ['pre', 'div'],
components: ['no-minify', 'my-component']
}
} There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. yeah, I think that makes sense. otherwise it wouldn't be possible to not skip |
||
|
||
registry.add('htmlbars-ast-plugin', { | ||
name: 'hbs-minifier-plugin', | ||
plugin: HbsMinifierPlugin, | ||
baseDir() { return __dirname; } | ||
}); | ||
} | ||
let HbsMinifierPlugin = require('./hbs-minifier-plugin')(config.skip || {}); | ||
registry.add('htmlbars-ast-plugin', { | ||
name: 'hbs-minifier-plugin', | ||
plugin: HbsMinifierPlugin, | ||
baseDir() { return __dirname; }, | ||
cacheKey() { return `ember-hbs-minifier-${objectHash.MD5(config)}`; } | ||
}); | ||
}, | ||
|
||
included(app) { | ||
this._super.included.apply(this, arguments); | ||
/* | ||
Calling setupPreprocessorRegistry in included hook since app.options is not accessible | ||
Refer PR: https://github.com/ember-cli/ember-cli/pull/7059 | ||
*/ | ||
this._setupPreprocessorRegistry(app); | ||
} | ||
}; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
import Ember from 'ember'; | ||
import layout from '../templates/components/foo-bar'; | ||
|
||
export default Ember.Component.extend({ | ||
layout | ||
}); |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
import Ember from 'ember'; | ||
import layout from '../templates/components/x-button'; | ||
|
||
export default Ember.Component.extend({ | ||
layout | ||
}); |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
1 | ||
<span> | ||
2 | ||
</span> | ||
<span> | ||
3 | ||
</span> | ||
{{yield}} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
save | ||
{{yield}} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm not sure about the naming of
whiteList
, because the filters essentially blacklist us from doing our transforms.blackList
sounds confusing too though. maybe justskip
?elementNodes
->elements
elementClassNames
->classes
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
skip
sounds good. I have usedelementClassNames
to differentiate fromcomponent classNames
since we cannot minify component boundaries(AsclassNames and classNameBindings
defined in the js file will be resolved only at runtime).