-
Hi! this discussion here is out of technical curiosity - I really like mithril-js and lisp, I would like to know if you all already thought about this possible integration. I would like to program mithril-js as lisp, would that be possible?... how to turn mithril-js like as lisp?... has anyone thought of turning mithril-js into lisp? code1_with_mithril_js.html<html>
<body>
<script src="https://unpkg.com/mithril/mithril.js"></script>
<script>
var root = document.body
m.render(root, [
m("main", [
m("h1", {class: "title"}, "My first app"),
m("button", "A button"),
])
])
</script>
</body>
</html> code1_lisp_with_mithril_js.html<html>
<body>
<script src="https://unpkg.com/mithril/mithril.js"></script>
<script>
var root = document.body
render(root, (
("main", (
("h1", (class: "title"), "My first app"),
("button", "A button"),
))
))
</script>
</body>
</html> |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments
-
This wouldn't work in vanilla JS, because ("button", "A button") evaluates to We could use arrays The |
Beta Was this translation helpful? Give feedback.
-
I explored this concept briefly using a build step (though not lisp). The goal was bring auto-completion of tags and in addition css/scss class names. It was rather pleasant to write an app with, eg: m.div(
'row',
'jc-center'
)(
m.div(
'col',
'col-sm-6',
'col-lg-12'
)(
m.ul('list')([
m.li('list-item')('one'),
m.li('list-item')('two')
])
)
) I've considered porting into a esbuild plugin but meh. UngVDeJ4-hATlhwL.mp4_tag.12.mp4 |
Beta Was this translation helpful? Give feedback.
This wouldn't work in vanilla JS, because
evaluates to
"A button"
because of the coma operator semantics.We could use arrays
["button", "A button"]
, but it wouldn't be without problems both semantically and perf-wise. In Mithril,m('a', 'b')
is a<a>
virtual element, whereas ,['a', 'b']
is a fragment of two strings. So we'd need a special syntax for fragments.The
m()
factory also returns objects that have a static structure, which lets the mithril core deal with it efficiently (we say it's monomorphic code, vs. polymorphic). This lets JS engines rely on the hidden class to access the various fields efficiently, making diff and render faster.