Tobias Uhlig
2 min readMay 3, 2021

--

Hi Siberio,

thanks for your input! I was just looking for some simple examples to show XML ish formatted render outputs (well, these are JSX). It is probably worse in Angular and I went through template scoping hell (was using Ext JS in the past).

You are referring to a functional approach using hooks, right? In this case you would still return a markup, where logic is included. I would actually like to create a functional example for neo.mjs, but have not found the time to dive into it. The current roadmap is too intense.

There is a lot more to JSON based vdom than just the normal "declarative vs programmatic" discussion.

To be fair: For rather static apps or simple components it does not really matter. The concept gets incredibly powerful the more changes happen at run time.

The vdom object of a component persists throughout the entire component lifecycle, meaning you can change it any way you like to before and after rendering / mounting.

E.g. to achieve infinite scrolling for a list, you could just use something like `vdom.cn.push(vdom.cn.shift());`.

Feel free to take a look into the online examples for demos how it plays out inside an environment where web workers are the main actors. This is actually another benefit: workers rely on post messages, and you can use JSON.stringify() and JSON.parse() to quickly transform back and forth.

*Desktop* please (have not found time to polish more examples for mobile):

https://neomjs.github.io/pages/

In neo.mjs, you would most of the time only define your vdom on a component level and for creating apps switch to the component tree abstraction layer on top of it. This one is also JSON based, so you can mix it.

Example including lazy loading views:

https://github.com/neomjs/neo/blob/dev/apps/covid/view/MainContainer.mjs#L33

What I personally like is a sharp separation of class configs and dom attributes (it can get blurry with custom tags where you drop in class props and dom attributes on the same level).

A config system is something I miss the most looking at other current libs or frameworks.

Best regards,

Tobias

--

--

No responses yet