vndb/mithril-vndb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

rename node to vnode

Browse source
This commit is contained in:
Leo Horie 2016-07-29 22:04:04 -04:00
parent 09a0464a01
commit 7c736b511a
20 changed files with 60 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

6
api/router.js
View file

@ -1,6 +1,6 @@
"use strict" "use strict"
var Node = require("../render/node") var Vnode = require("../render/vnode")
var coreRouter = require("../router/router") var coreRouter = require("../router/router")
var autoredraw = require("../api/autoredraw") var autoredraw = require("../api/autoredraw")
@ -13,14 +13,14 @@ module.exports = function($window, renderer, pubsub) {
if (typeof payload.render !== "function") payload.render = function(vnode) {return vnode} if (typeof payload.render !== "function") payload.render = function(vnode) {return vnode}
var render = function(component) { var render = function(component) {
current.route = route, current.component = component current.route = route, current.component = component
renderer.render(root, payload.render(Node(component, null, args, undefined, undefined, undefined))) renderer.render(root, payload.render(Vnode(component, null, args, undefined, undefined, undefined)))
} }
if (typeof payload.resolve !== "function") payload.resolve = function() {render(current.component)} if (typeof payload.resolve !== "function") payload.resolve = function() {render(current.component)}
if (route !== current.route) payload.resolve(render, args, path, route) if (route !== current.route) payload.resolve(render, args, path, route)
else render(current.component) else render(current.component)
} }
else { else {
renderer.render(root, Node(payload, null, args, undefined, undefined, undefined)) renderer.render(root, Vnode(payload, null, args, undefined, undefined, undefined))
} }
}, function() { }, function() {
router.setPath(defaultRoute, null, {replace: true}) router.setPath(defaultRoute, null, {replace: true})

2
api/tests/index.html
View file

@ -12,7 +12,7 @@
<script src="../../test-utils/pushStateMock.js"></script> <script src="../../test-utils/pushStateMock.js"></script>
<script src="../../util/stream.js"></script> <script src="../../util/stream.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/trust.js"></script> <script src="../../render/trust.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>

6
bundler/bundle.js
View file

@ -86,5 +86,9 @@ module.exports = function(input, output, options) {
} }
run() run()
if (options && options.watch) fs.watch(process.cwd(), {recursive: true}, run) if (options && options.watch) {
fs.watch(process.cwd(), {recursive: true}, function(type, file) {
if (path.resolve(output) !== path.resolve(file)) run()
})
}
} }

2
docs/vnodes.md
View file

@ -97,6 +97,6 @@ Only element tag names and components can be the first argument of the `m()` fun
### Monomorphic class ### Monomorphic class
The `mithril/render/node` module is used by Mithril to generate all vnodes. This ensures modern Javascript engines can optimize virtual dom diffing by always compiling vnodes to the same hidden class. The `mithril/render/vnode` module is used by Mithril to generate all vnodes. This ensures modern Javascript engines can optimize virtual dom diffing by always compiling vnodes to the same hidden class.
When creating libraries that emit vnodes, you should use this module instead of writing naked Javascript objects in order to ensure a high level of rendering performance. When creating libraries that emit vnodes, you should use this module instead of writing naked Javascript objects in order to ensure a high level of rendering performance.

2
examples/animation/mosaic.html
View file

@ -22,7 +22,7 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<script src="../../module/module.js"></script> <script src="../../module/module.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>
<script> <script>

2
examples/dbmonster/mithril/index.html
View file

@ -9,7 +9,7 @@
<body> <body>
<div id="app"></div> <div id="app"></div>
<script src="../../../module/module.js"></script> <script src="../../../module/module.js"></script>
<script src="../../../render/node.js"></script> <script src="../../../render/vnode.js"></script>
<script src="../../../render/hyperscript.js"></script> <script src="../../../render/hyperscript.js"></script>
<script src="../../../render/render.js"></script> <script src="../../../render/render.js"></script>
<script src="../ENV.js"></script> <script src="../ENV.js"></script>

2
examples/editor/index.html
View file

@ -14,7 +14,7 @@ h1,h2,h3,h4,h5,h6,p {margin:0 0 10px;}
<div id="editor"></div> <div id="editor"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script>
<script src="../../module/module.js"></script> <script src="../../module/module.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>
<script src="../../render/trust.js"></script> <script src="../../render/trust.js"></script>

2
examples/svg/clock.html
View file

@ -8,7 +8,7 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<script src="../../module/module.js"></script> <script src="../../module/module.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>
<script> <script>

2
examples/svg/ring.html
View file

@ -8,7 +8,7 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<script src="../../module/module.js"></script> <script src="../../module/module.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>
<script> <script>

2
examples/svg/tiger.html
View file

@ -8,7 +8,7 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<script src="../../module/module.js"></script> <script src="../../module/module.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>
<script> <script>

2
examples/threaditjs/index.html
View file

@ -11,7 +11,7 @@
<div id="app"></div> <div id="app"></div>
<script src="http://threaditjs.com/shared.js"></script> <script src="http://threaditjs.com/shared.js"></script>
<script src="../../module/module.js"></script> <script src="../../module/module.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/trust.js"></script> <script src="../../render/trust.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>

2
examples/todomvc/index.html
View file

@ -13,7 +13,7 @@
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p> <p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</footer> </footer>
<script src="../../module/module.js"></script> <script src="../../module/module.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>
<script src="../../querystring/build.js"></script> <script src="../../querystring/build.js"></script>

8
render/hyperscript.js
View file

@ -1,6 +1,6 @@
"use strict" "use strict"
var Node = require("../render/node") var Vnode = require("../render/vnode")
var selectorParser = /(?:(^|#|\.)([^#\.\[\]]+))|(\[(.+?)(?:\s*=\s*("|'|)((?:\\["'\]]|.)*?)\5)?\])/g var selectorParser = /(?:(^|#|\.)([^#\.\[\]]+))|(\[(.+?)(?:\s*=\s*("|'|)((?:\\["'\]]|.)*?)\5)?\])/g
var selectorCache = {} var selectorCache = {}
@ -40,7 +40,7 @@ function hyperscript(selector) {
if (children instanceof Array && children.length == 1 && children[0] != null && children[0].tag === "#") text = children[0].children if (children instanceof Array && children.length == 1 && children[0] != null && children[0].tag === "#") text = children[0].children
else childList = children else childList = children
return Node(tag || "div", attrs.key, hasAttrs ? attrs : undefined, childList, text, undefined) return Vnode(tag || "div", attrs.key, hasAttrs ? attrs : undefined, childList, text, undefined)
} }
} }
} }
@ -58,9 +58,9 @@ function hyperscript(selector) {
for (var i = childrenIndex; i < arguments.length; i++) children.push(arguments[i]) for (var i = childrenIndex; i < arguments.length; i++) children.push(arguments[i])
} }
if (typeof selector === "string") return selectorCache[selector](attrs || {}, Node.normalizeChildren(children)) if (typeof selector === "string") return selectorCache[selector](attrs || {}, Vnode.normalizeChildren(children))
return Node(selector, attrs && attrs.key, attrs || {}, Node.normalizeChildren(children), undefined, undefined) return Vnode(selector, attrs && attrs.key, attrs || {}, Vnode.normalizeChildren(children), undefined, undefined)
} }
module.exports = hyperscript module.exports = hyperscript

16
render/node.js
View file

@ -1,16 +0,0 @@
function Node(tag, key, attrs, children, text, dom) {
return {tag: tag, key: key, attrs: attrs, children: children, text: text, dom: dom, domSize: undefined, state: {}, events: undefined, instance: undefined}
}
Node.normalize = function(node) {
if (node instanceof Array) return Node("[", undefined, undefined, Node.normalizeChildren(node), undefined, undefined)
else if (node != null && typeof node !== "object") return Node("#", undefined, undefined, node, undefined, undefined)
return node
}
Node.normalizeChildren = function normalizeChildren(children) {
for (var i = 0; i < children.length; i++) {
children[i] = Node.normalize(children[i])
}
return children
}
module.exports = Node

14
render/render.js
View file

@ -1,6 +1,6 @@
"use strict" "use strict"
var Node = require("../render/node") var Vnode = require("../render/vnode")
module.exports = function($window) { module.exports = function($window) {
var $doc = $window.document var $doc = $window.document
@ -80,7 +80,7 @@ module.exports = function($window) {
if (vnode.text != null) { if (vnode.text != null) {
if (vnode.text !== "") element.textContent = vnode.text if (vnode.text !== "") element.textContent = vnode.text
else vnode.children = [Node("#", undefined, undefined, vnode.text, undefined, undefined)] else vnode.children = [Vnode("#", undefined, undefined, vnode.text, undefined, undefined)]
} }
if (vnode.children != null) { if (vnode.children != null) {
@ -94,7 +94,7 @@ module.exports = function($window) {
vnode.state = copy(vnode.tag) vnode.state = copy(vnode.tag)
initLifecycle(vnode.tag, vnode, hooks) initLifecycle(vnode.tag, vnode, hooks)
vnode.instance = Node.normalize(vnode.tag.view.call(vnode.state, vnode)) vnode.instance = Vnode.normalize(vnode.tag.view.call(vnode.state, vnode))
if (vnode.instance != null) { if (vnode.instance != null) {
var element = createNode(vnode.instance, hooks, ns) var element = createNode(vnode.instance, hooks, ns)
vnode.dom = vnode.instance.dom vnode.dom = vnode.instance.dom
@ -248,13 +248,13 @@ module.exports = function($window) {
if (old.text.toString() !== vnode.text.toString()) old.dom.firstChild.nodeValue = vnode.text if (old.text.toString() !== vnode.text.toString()) old.dom.firstChild.nodeValue = vnode.text
} }
else { else {
if (old.text != null) old.children = [Node("#", undefined, undefined, old.text, undefined, old.dom.firstChild)] if (old.text != null) old.children = [Vnode("#", undefined, undefined, old.text, undefined, old.dom.firstChild)]
if (vnode.text != null) vnode.children = [Node("#", undefined, undefined, vnode.text, undefined, undefined)] if (vnode.text != null) vnode.children = [Vnode("#", undefined, undefined, vnode.text, undefined, undefined)]
updateNodes(element, old.children, vnode.children, hooks, null, ns) updateNodes(element, old.children, vnode.children, hooks, null, ns)
} }
} }
function updateComponent(parent, old, vnode, hooks, nextSibling, recycling, ns) { function updateComponent(parent, old, vnode, hooks, nextSibling, recycling, ns) {
vnode.instance = Node.normalize(vnode.tag.view.call(vnode.state, vnode)) vnode.instance = Vnode.normalize(vnode.tag.view.call(vnode.state, vnode))
updateLifecycle(vnode.tag, vnode, hooks, recycling) updateLifecycle(vnode.tag, vnode, hooks, recycling)
if (vnode.instance != null) { if (vnode.instance != null) {
if (old.instance == null) insertNode(parent, createNode(vnode.instance, hooks, ns), nextSibling) if (old.instance == null) insertNode(parent, createNode(vnode.instance, hooks, ns), nextSibling)
@ -517,7 +517,7 @@ module.exports = function($window) {
if (dom.vnodes == null) dom.vnodes = [] if (dom.vnodes == null) dom.vnodes = []
if (!(vnodes instanceof Array)) vnodes = [vnodes] if (!(vnodes instanceof Array)) vnodes = [vnodes]
updateNodes(dom, dom.vnodes, Node.normalizeChildren(vnodes), hooks, null, undefined) updateNodes(dom, dom.vnodes, Vnode.normalizeChildren(vnodes), hooks, null, undefined)
dom.vnodes = vnodes dom.vnodes = vnodes
for (var i = 0; i < hooks.length; i++) hooks[i]() for (var i = 0; i < hooks.length; i++) hooks[i]()
if ($doc.activeElement !== active) active.focus() if ($doc.activeElement !== active) active.focus()

2
render/tests/index.html
View file

@ -9,7 +9,7 @@
<script src="../../test-utils/callAsync.js"></script> <script src="../../test-utils/callAsync.js"></script>
<script src="../../test-utils/domMock.js"></script> <script src="../../test-utils/domMock.js"></script>
<script src="../../render/node.js"></script> <script src="../../render/vnode.js"></script>
<script src="../../render/trust.js"></script> <script src="../../render/trust.js"></script>
<script src="../../render/hyperscript.js"></script> <script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script> <script src="../../render/render.js"></script>

18
render/tests/test-normalize.js
View file

@ -1,17 +1,17 @@
"use strict" "use strict"
var o = require("../../ospec/ospec") var o = require("../../ospec/ospec")
var Node = require("../../render/node") var Vnode = require("../../render/vnode")
o.spec("normalize", function() { o.spec("normalize", function() {
o("normalizes array into fragment", function() { o("normalizes array into fragment", function() {
var node = Node.normalize([]) var node = Vnode.normalize([])
o(node.tag).equals("[") o(node.tag).equals("[")
o(node.children.length).equals(0) o(node.children.length).equals(0)
}) })
o("normalizes nested array into fragment", function() { o("normalizes nested array into fragment", function() {
var node = Node.normalize([[]]) var node = Vnode.normalize([[]])
o(node.tag).equals("[") o(node.tag).equals("[")
o(node.children.length).equals(1) o(node.children.length).equals(1)
@ -19,37 +19,37 @@ o.spec("normalize", function() {
o(node.children[0].children.length).equals(0) o(node.children[0].children.length).equals(0)
}) })
o("normalizes string into text node", function() { o("normalizes string into text node", function() {
var node = Node.normalize("a") var node = Vnode.normalize("a")
o(node.tag).equals("#") o(node.tag).equals("#")
o(node.children).equals("a") o(node.children).equals("a")
}) })
o("normalizes falsy string into text node", function() { o("normalizes falsy string into text node", function() {
var node = Node.normalize("") var node = Vnode.normalize("")
o(node.tag).equals("#") o(node.tag).equals("#")
o(node.children).equals("") o(node.children).equals("")
}) })
o("normalizes number into text node", function() { o("normalizes number into text node", function() {
var node = Node.normalize(1) var node = Vnode.normalize(1)
o(node.tag).equals("#") o(node.tag).equals("#")
o(node.children).equals(1) o(node.children).equals(1)
}) })
o("normalizes falsy number into text node", function() { o("normalizes falsy number into text node", function() {
var node = Node.normalize(0) var node = Vnode.normalize(0)
o(node.tag).equals("#") o(node.tag).equals("#")
o(node.children).equals(0) o(node.children).equals(0)
}) })
o("normalizes boolean into text node", function() { o("normalizes boolean into text node", function() {
var node = Node.normalize(true) var node = Vnode.normalize(true)
o(node.tag).equals("#") o(node.tag).equals("#")
o(node.children).equals(true) o(node.children).equals(true)
}) })
o("normalizes falsy boolean into text node", function() { o("normalizes falsy boolean into text node", function() {
var node = Node.normalize(false) var node = Vnode.normalize(false)
o(node.tag).equals("#") o(node.tag).equals("#")
o(node.children).equals(false) o(node.children).equals(false)

6
render/tests/test-normalizeChildren.js
View file

@ -1,17 +1,17 @@
"use strict" "use strict"
var o = require("../../ospec/ospec") var o = require("../../ospec/ospec")
var Node = require("../../render/node") var Vnode = require("../../render/vnode")
o.spec("normalizeChildren", function() { o.spec("normalizeChildren", function() {
o("normalizes arrays into fragments", function() { o("normalizes arrays into fragments", function() {
var children = Node.normalizeChildren([[]]) var children = Vnode.normalizeChildren([[]])
o(children[0].tag).equals("[") o(children[0].tag).equals("[")
o(children[0].children.length).equals(0) o(children[0].children.length).equals(0)
}) })
o("normalizes strings into text nodes", function() { o("normalizes strings into text nodes", function() {
var children = Node.normalizeChildren(["a"]) var children = Vnode.normalizeChildren(["a"])
o(children[0].tag).equals("#") o(children[0].tag).equals("#")
o(children[0].children).equals("a") o(children[0].children).equals("a")

4
render/trust.js
View file

@ -1,7 +1,7 @@
"use strict" "use strict"
var Node = require("../render/node") var Vnode = require("../render/vnode")
module.exports = function(html) { module.exports = function(html) {
return Node("<", undefined, undefined, html, undefined, undefined) return Vnode("<", undefined, undefined, html, undefined, undefined)
} }

16
render/vnode.js Normal file
View file

@ -0,0 +1,16 @@
function Vnode(tag, key, attrs, children, text, dom) {
return {tag: tag, key: key, attrs: attrs, children: children, text: text, dom: dom, domSize: undefined, state: {}, events: undefined, instance: undefined}
}
Vnode.normalize = function(node) {
if (node instanceof Array) return Vnode("[", undefined, undefined, Vnode.normalizeChildren(node), undefined, undefined)
else if (node != null && typeof node !== "object") return Vnode("#", undefined, undefined, node, undefined, undefined)
return node
}
Vnode.normalizeChildren = function normalizeChildren(children) {
for (var i = 0; i < children.length; i++) {
children[i] = Vnode.normalize(children[i])
}
return children
}
module.exports = Vnode