awesome build-less moon (+lazy load components?)
coderofsalvation opened this issue · 5 comments
Awesome project!
I was amazed how fast I could just get an index.html up and running, without having to install any transpiler (babel/webpack etc).
Question: what would you think of promise-support or url-support for the 'view'-property?
So instead of
Moon({
root: "#root",
view: $('#view').innerHTML,
....
It would support:
Moon({
root: "#root",
view: Moon.component('view/myview.html') // moon evaluates promise
...
example (pseudocode):
Moon.component = (url) => {
return new Promise( (resolve,reject) => {
fetch(url)
.then( (d) => d.text() )
.then( resolve )
.catch(reject)
})
}
Why?
Many times i need to livecode HTML. Having the scalability of single-file-components, and not having to use the cli really speeds up the production i my case.
Moon is so incredibly simple & easy to use, it kind of makes it sexy to not need an extra buildstep for single-file-components (like vue).
Thanks for the feedback!
The next version will be a bit different than what you'd normally expect from a UI library, and its API will look something like this.
That version will support having any function as a component rather than single file components. You could still make single file components that export one view function however, and I'm still working on solutions for CSS but you'd probably use something like CSS modules.
Since any function could be a component, it would support something similar to what you showed above :)
Oh definitely excited for the next api
Glad to hear @coderofsalvation @LeviSchuck!
I've tried it out on some small components and experiments, and you're right haha — it's very curryable and it's super easy to create higher-order functions. Even though I created the new design, I haven't explored its full potential.
I just committed the changes in 265252e, definitely one of my larger commits. Feel free to hop on the Slack and I can help you all try it out :)
Let me know what you think — I'm closing this for now because I think it can be achieved through Promises and returning an intermediate loading state inside a component function.