diff --git a/benchmark/vdom/index.marko.js b/benchmark/vdom/index.marko.js index da0a456ef..30674ea9c 100644 --- a/benchmark/vdom/index.marko.js +++ b/benchmark/vdom/index.marko.js @@ -1,27 +1,30 @@ -function create(__markoHelpers) { - var __browser_json = require.resolve("./browser.json"), - marko_loadTag = __markoHelpers.t, - lasso_page_tag = marko_loadTag(require("lasso/taglib/page-tag")), - lasso_head_tag = marko_loadTag(require("lasso/taglib/head-tag")), - lasso_body_tag = marko_loadTag(require("lasso/taglib/body-tag")); +var template = require("marko/html").c(__filename); - return function render(data, out) { - lasso_page_tag({ - packagePath: __browser_json, - dirname: __dirname, - filename: __filename - }, out); +module.exports = template; - out.w("marko-vdom benchmarks"); +var __browser_json = require.resolve("./browser.json"), + marko_helpers = require("marko/runtime/html/helpers"), + marko_loadTag = marko_helpers.t, + lasso_page_tag = marko_loadTag(require("lasso/taglib/page-tag")), + lasso_head_tag = marko_loadTag(require("lasso/taglib/head-tag")), + lasso_body_tag = marko_loadTag(require("lasso/taglib/body-tag")); - lasso_head_tag({}, out); +function render(data, out) { + lasso_page_tag({ + packagePath: __browser_json, + dirname: __dirname, + filename: __filename + }, out); - out.w("
\n

todos

"); + out.w("marko-vdom benchmarks"); - lasso_body_tag({}, out); + lasso_head_tag({}, out); - out.w(""); - }; + out.w("
\n

todos

"); + + lasso_body_tag({}, out); + + out.w(""); } -module.exports = require("marko/html").c(__filename, create); +template._ = render; diff --git a/compiler/CompileContext.js b/compiler/CompileContext.js index 68110db29..88812aba0 100644 --- a/compiler/CompileContext.js +++ b/compiler/CompileContext.js @@ -57,13 +57,14 @@ const helpers = { 'classList': 'cl', 'const': 'const', 'createElement': 'e', - 'createInlineTemplate': 'i', + 'createInlineTemplate': 'inline', 'escapeXml': 'x', 'escapeXmlAttr': 'xa', 'escapeScript': 'xs', 'forEach': 'f', 'forEachProp': 'fp', 'forEachWithStatusVar': 'fv', + 'include': 'i', 'loadTag': 't', 'loadTemplate': 'l', 'merge': 'm', diff --git a/runtime/helpers.js b/runtime/helpers.js index 147fc261a..65605d3cc 100644 --- a/runtime/helpers.js +++ b/runtime/helpers.js @@ -227,5 +227,19 @@ module.exports = { /** * Loads a template (__helpers.l --> marko_loadTemplate(path)) */ - l: load + l: load, + + i: function(target, out, data) { + if (target) { + if (typeof target === 'function') { + target(out, data); + } else if (target.renderer) { + target.renderer(data, out); + } else if (target.render) { + target.render(data, out); + } else { + throw new Error('Invalid include target: ' + target); + } + } + } }; diff --git a/runtime/html/helpers.js b/runtime/html/helpers.js index 737edb78a..6a920a618 100644 --- a/runtime/html/helpers.js +++ b/runtime/html/helpers.js @@ -116,5 +116,5 @@ module.exports = extend({ } }, - i: require('./')._inline + inline: require('./')._inline }, commonHelpers); diff --git a/runtime/vdom/helpers.js b/runtime/vdom/helpers.js index bcbca2b75..4231dbe0e 100644 --- a/runtime/vdom/helpers.js +++ b/runtime/vdom/helpers.js @@ -85,5 +85,5 @@ module.exports = extend({ } }, - i: require('./')._inline + inline: require('./')._inline }, commonHelpers); \ No newline at end of file diff --git a/taglibs/core/include-tag.js b/taglibs/core/include-tag.js index b59412e22..6d81eb639 100644 --- a/taglibs/core/include-tag.js +++ b/taglibs/core/include-tag.js @@ -18,12 +18,15 @@ module.exports = function codeGenerator(el, codegen) { } let templatePath = args[0]; - let templateVar; + let targetVar; + + var isTemplate = false; if (templatePath.type === 'Literal') { - templateVar = codegen.context.importTemplate(templatePath.value); + targetVar = codegen.context.importTemplate(templatePath.value); + isTemplate = true; } else { - templateVar = templatePath; + targetVar = templatePath; } let templateData = {}; @@ -55,8 +58,19 @@ module.exports = function codeGenerator(el, codegen) { templateData = builder.literal(templateData); } - let renderMethod = builder.memberExpression(templateVar, builder.identifier('render')); - let renderArgs = [ templateData, 'out' ]; - let renderFunctionCall = builder.functionCall(renderMethod, renderArgs); - return renderFunctionCall; + if (isTemplate) { + let renderMethod = builder.memberExpression(targetVar, builder.identifier('render')); + let renderArgs = [ templateData, 'out' ]; + let renderFunctionCall = builder.functionCall(renderMethod, renderArgs); + return renderFunctionCall; + } else { + let includeVar = codegen.context.helper('include'); + let includeArgs = [ targetVar, 'out']; + + if (Object.keys(templateData).length > 0) { + includeArgs.push(templateData); + } + + return builder.functionCall(includeVar, includeArgs); + } }; \ No newline at end of file diff --git a/test/autotests/render/include-component/components/my-component/index.js b/test/autotests/render/include-component/components/my-component/index.js new file mode 100644 index 000000000..a916b6b91 --- /dev/null +++ b/test/autotests/render/include-component/components/my-component/index.js @@ -0,0 +1,7 @@ +module.exports = { + renderer: function(input, out) { + out.beginElement('div'); + out.text(input.name.toUpperCase()); + out.endElement(); + } +}; \ No newline at end of file diff --git a/test/autotests/render/include-component/expected.html b/test/autotests/render/include-component/expected.html new file mode 100644 index 000000000..f5082886f --- /dev/null +++ b/test/autotests/render/include-component/expected.html @@ -0,0 +1 @@ +
FRANK
\ No newline at end of file diff --git a/test/autotests/render/include-component/include-html-target.html b/test/autotests/render/include-component/include-html-target.html new file mode 100644 index 000000000..26ada550c --- /dev/null +++ b/test/autotests/render/include-component/include-html-target.html @@ -0,0 +1,5 @@ +
+

+ Hello World! +

+
\ No newline at end of file diff --git a/test/autotests/render/include-component/template.marko b/test/autotests/render/include-component/template.marko new file mode 100644 index 000000000..3da0b99b1 --- /dev/null +++ b/test/autotests/render/include-component/template.marko @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/autotests/render/include-component/test.js b/test/autotests/render/include-component/test.js new file mode 100644 index 000000000..81ec063c9 --- /dev/null +++ b/test/autotests/render/include-component/test.js @@ -0,0 +1,5 @@ +var myComponent = require('./components/my-component'); + +exports.templateData = { + component: myComponent +}; diff --git a/test/autotests/render/include-renderBody-no-data/expected.html b/test/autotests/render/include-renderBody-no-data/expected.html new file mode 100644 index 000000000..066a48b65 --- /dev/null +++ b/test/autotests/render/include-renderBody-no-data/expected.html @@ -0,0 +1 @@ +
foo
\ No newline at end of file diff --git a/test/autotests/render/include-renderBody-no-data/include-html-target.html b/test/autotests/render/include-renderBody-no-data/include-html-target.html new file mode 100644 index 000000000..26ada550c --- /dev/null +++ b/test/autotests/render/include-renderBody-no-data/include-html-target.html @@ -0,0 +1,5 @@ +
+

+ Hello World! +

+
\ No newline at end of file diff --git a/test/autotests/render/include-renderBody-no-data/template.marko b/test/autotests/render/include-renderBody-no-data/template.marko new file mode 100644 index 000000000..8f4f9e3ac --- /dev/null +++ b/test/autotests/render/include-renderBody-no-data/template.marko @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/autotests/render/include-renderBody-no-data/test.js b/test/autotests/render/include-renderBody-no-data/test.js new file mode 100644 index 000000000..18a5e488e --- /dev/null +++ b/test/autotests/render/include-renderBody-no-data/test.js @@ -0,0 +1,7 @@ +exports.templateData = { + renderBody(out) { + out.beginElement('div'); + out.text('foo'); + out.endElement(); + } +}; diff --git a/test/autotests/render/include-renderBody-string-arg/expected.html b/test/autotests/render/include-renderBody-string-arg/expected.html new file mode 100644 index 000000000..c2a9ebcf7 --- /dev/null +++ b/test/autotests/render/include-renderBody-string-arg/expected.html @@ -0,0 +1 @@ +
Frank
\ No newline at end of file diff --git a/test/autotests/render/include-renderBody-string-arg/include-html-target.html b/test/autotests/render/include-renderBody-string-arg/include-html-target.html new file mode 100644 index 000000000..26ada550c --- /dev/null +++ b/test/autotests/render/include-renderBody-string-arg/include-html-target.html @@ -0,0 +1,5 @@ +
+

+ Hello World! +

+
\ No newline at end of file diff --git a/test/autotests/render/include-renderBody-string-arg/template.marko b/test/autotests/render/include-renderBody-string-arg/template.marko new file mode 100644 index 000000000..6b123054c --- /dev/null +++ b/test/autotests/render/include-renderBody-string-arg/template.marko @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/autotests/render/include-renderBody-string-arg/test.js b/test/autotests/render/include-renderBody-string-arg/test.js new file mode 100644 index 000000000..11bdfc3f7 --- /dev/null +++ b/test/autotests/render/include-renderBody-string-arg/test.js @@ -0,0 +1,7 @@ +exports.templateData = { + renderBody(out, name) { + out.beginElement('div'); + out.text(name); + out.endElement(); + } +}; diff --git a/test/autotests/render/include-renderBody/expected.html b/test/autotests/render/include-renderBody/expected.html new file mode 100644 index 000000000..c2a9ebcf7 --- /dev/null +++ b/test/autotests/render/include-renderBody/expected.html @@ -0,0 +1 @@ +
Frank
\ No newline at end of file diff --git a/test/autotests/render/include-renderBody/include-html-target.html b/test/autotests/render/include-renderBody/include-html-target.html new file mode 100644 index 000000000..26ada550c --- /dev/null +++ b/test/autotests/render/include-renderBody/include-html-target.html @@ -0,0 +1,5 @@ +
+

+ Hello World! +

+
\ No newline at end of file diff --git a/test/autotests/render/include-renderBody/template.marko b/test/autotests/render/include-renderBody/template.marko new file mode 100644 index 000000000..c0c3d0ad9 --- /dev/null +++ b/test/autotests/render/include-renderBody/template.marko @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/test/autotests/render/include-renderBody/test.js b/test/autotests/render/include-renderBody/test.js new file mode 100644 index 000000000..d792435ef --- /dev/null +++ b/test/autotests/render/include-renderBody/test.js @@ -0,0 +1,7 @@ +exports.templateData = { + renderBody(out, data) { + out.beginElement('div'); + out.text(data.name); + out.endElement(); + } +};