From c6bea140d023e9ce3cc91cdfcea267fbcca66836 Mon Sep 17 00:00:00 2001 From: paldepind Date: Sun, 10 May 2015 19:55:44 +0200 Subject: [PATCH] Improve performance for text-only elements --- snabbdom.js | 16 ++++++++++------ test/index.js | 10 +++++++--- 2 files changed, 17 insertions(+), 9 deletions(-) diff --git a/snabbdom.js b/snabbdom.js index d210e5b..860229a 100644 --- a/snabbdom.js +++ b/snabbdom.js @@ -30,12 +30,14 @@ var frag = document.createDocumentFragment(); var emptyNode = VNode(undefined, {style: {}, class: {}}, [], undefined); function h(selector, b, c) { - var props = {}, children, tag, i; + var props = {}, children, tag, text, i; if (arguments.length === 3) { - props = b; children = isPrimitive(c) ? [c] : c; + props = b; + if (isArr(c)) { children = c; } + else if (isPrimitive(c)) { text = c; } } else if (arguments.length === 2) { if (isArr(b)) { children = b; } - else if (isPrimitive(b)) { children = [b]; } + else if (isPrimitive(b)) { text = b; } else { props = b; } } // Parse selector @@ -52,7 +54,7 @@ function h(selector, b, c) { if (isPrimitive(children[i])) children[i] = VNode(undefined, undefined, undefined, children[i]); } } - return VNode(tag, props, children, undefined, undefined); + return VNode(tag, props, children, text, undefined); } function updateProps(elm, oldProps, props) { @@ -81,7 +83,7 @@ function updateProps(elm, oldProps, props) { function createElm(vnode) { var elm; - if (isUndef(vnode.text)) { + if (!isUndef(vnode.tag)) { elm = document.createElement(vnode.tag); updateProps(elm, emptyNode.props, vnode.props); var children = vnode.children; @@ -89,6 +91,8 @@ function createElm(vnode) { for (var i = 0; i < vnode.children.length; ++i) { elm.appendChild(createElm(children[i])); } + } else if (isPrimitive(vnode.text)) { + elm.textContent = vnode.text; } } else { elm = document.createTextNode(vnode.text); @@ -199,8 +203,8 @@ function updateChildren(parentElm, oldCh, newCh) { function patchElm(oldVnode, newVnode) { var elm = newVnode.elm = oldVnode.elm; + updateProps(elm, oldVnode.props, newVnode.props); if (isUndef(newVnode.text)) { - updateProps(elm, oldVnode.props, newVnode.props); updateChildren(elm, oldVnode.children, newVnode.children); } else { if (oldVnode.text !== newVnode.text) { diff --git a/test/index.js b/test/index.js index c37012f..1bf09de 100644 --- a/test/index.js +++ b/test/index.js @@ -59,16 +59,15 @@ describe('snabbdom', function() { }); it('can create vnode with text content in string', function() { var vnode = h('a', 'I am a string'); - assert.equal(vnode.children[0].text, 'I am a string'); + assert.equal(vnode.text, 'I am a string'); }); it('can create vnode with props and text content in string', function() { var vnode = h('a', {}, 'I am a string'); - assert.equal(vnode.children[0].text, 'I am a string'); + assert.equal(vnode.text, 'I am a string'); }); it('can create empty vnode at element', function() { var elm = document.createElement('div'); var vnode = snabbdom.emptyNodeAt(elm); - console.log(vnode); assert.equal(vnode.elm, elm); }); }); @@ -103,6 +102,11 @@ describe('snabbdom', function() { var elm = createElm(h('a', ['I am a string'])); assert.equal(elm.innerHTML, 'I am a string'); }); + it('can create elements with span and text content', function() { + var elm = createElm(h('a', [h('span'), 'I am a string'])); + assert.equal(elm.childNodes[0].tagName, 'SPAN'); + assert.equal(elm.childNodes[1].textContent, 'I am a string'); + }); }); describe('pathing an element', function() { it('changes the elements classes', function() {