Skip to content

Instantly share code, notes, and snippets.

@trueadm
Last active January 25, 2016 21:27
Show Gist options
  • Save trueadm/f192079e9dcace6d45ae to your computer and use it in GitHub Desktop.
Save trueadm/f192079e9dcace6d45ae to your computer and use it in GitHub Desktop.
// calling create tree would do this
// only the attrs/children then are dynamic will by in the given nodes
// the nodes all should be monomorphic thus have the same properties (null if not used)
// we will clone these nodes
const precompiledNode1 = document.createElement('div');
const precompiledNode2 = document.createElement('div');
precompiledNode2.textContent = 'Node!';
precompiledNode2.className = 'foo';
const precompiledNode3 = document.createElement('span');
precompiledNode3.textContent = 'Static node';
precompiledNode3.className = 'foo';
function myTemplate(v1, v2, v3) {
return { id: 0x0001, key: null, dom: precompiledNode1, attrs: null, children: [v1, ' ', v2].concat(v3) }
}
function myTemplate2() {
return { id: 0x0002, key: null, dom: precompiledNode2, attrs: null, children: null };
}
function someRender() {
// template
// <div>
// Hello world <div className='foo'>Node!</div><div className='foo'>Node!</div><div className='foo'>Node!</div>
// </div>
return myTemplate('Hello', 'world!', [ myTemplate2(), myTemplate2(), myTemplate2() ])
}
function myTemplate3(v1, v2) {
return { id: 0x0003, key: null, dom: precompiledNode1, attrs: { className: v1 }, children: [
{ id: 0x0004, key: null, dom: precompiledNode3, attrs: null, children: null }
].concat(v2)};
}
function someRender2() {
// template
// <div className='test'>
// <span className='foo'>Static node</span>
// <div className='foo'>Node!</div><div className='foo'>Node!</div><div className='foo'>Node!</div>
// </div>
return myTemplate3('test', [ myTemplate2(), myTemplate2(), myTemplate2() ])
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment