Experimental web UI framework. Ideas from ReactJS, Polymer, Angular 2, Aurelia, made simple.
People
Repo info
Activity
Antonio Stoilkov
@astoilkov
I also believe that you don't need the window.requestAnimationFrame
The Object.obseve callback is always called before paint
which is the ideal time to update the dom
Nelo Mitranim
@mitranim
ooh? didn't know that, thanks
was able to avoid using a virtual DOM this time, the system is so much simpler now
directives are 3-5x times simpler to write too
anyway it's best to discuss when the result is published
Antonio Stoilkov
@astoilkov
Yeah. I also experiment with similar approach and can say that its worth it
Nelo Mitranim
@mitranim
:beers:
Antonio Stoilkov
@astoilkov
I actually created an observe function which does similar thing to PathObserver. However, it is incomplete. :(
Nelo Mitranim
@mitranim
thanks for the idea about using comments, by the way
Antonio Stoilkov
@astoilkov
It was just a quick experiment but I don't have time at the moment to finish it
I will send you the implementation if I finish it
Nelo Mitranim
@mitranim
one of the reason I originally used a virtual DOM was that it allows to maintain node locations even when they're not in the DOM
Antonio Stoilkov
@astoilkov
No problem...happy to help
Nelo Mitranim
@mitranim
now just using pairs of comments as delimiters, much better
^ haha I also started by writing a custom path observer, but switched to observe-js for the other complementary observers
for observing arrays and objects
was unable to dodge dependency injection this time
it's pretty good with TypeScript param metadata and reflection
too good to pass :D and the simplest implementation can be like 5-6 lines
Feras Khoursheed
@devmondo
@Mitranim so you dont use virtual dom anymore ?
Nelo Mitranim
@mitranim
@devmondo yeah it turned out to be unnecessary, dropping it is a win
Feras Khoursheed
@devmondo
wow
so all tha fad of react is nothing
hhahahah
you are smart
Nelo Mitranim
@mitranim
just checked, just the virtual DOM tree traversal code in atril is larger than the entire implemetation of the new version, huh
Feras Khoursheed
@devmondo
damn
Nelo Mitranim
@mitranim
anyway I honestly don't have a good idea about all the reasons for the virtual DOM in React and analogs
might be missing something
Feras Khoursheed
@devmondo
so there are faster alternatives to virtual dom?
Nelo Mitranim
@mitranim
the only reason I can avoid it now is because observables allow to easily localise changes
Feras Khoursheed
@devmondo
yeah polymer use that, but i thought it is not supported in current browsers
Nelo Mitranim
@mitranim
so when you set up an observable, you also set up local DOM mutations, and that's as efficient as it gets, ever
Yeah their polyfill doesn't entirely work in some browsers, I plan to fall back to zone.js to deal with that (all you need to do is to call an API hook to run change detection in the observable polyfill)
works in Chrome though
Feras Khoursheed
@devmondo
wow what browser you found supported with their polyfill ?
oh
Nelo Mitranim
@mitranim
^
haven't checked others yet
Feras Khoursheed
@devmondo
so firefox, safari is still out of question
weird i thought their polyfill works with them
Nelo Mitranim
@mitranim
I think the core use case for a virtual DOM is when you want to render the view one-way and guarantee consistency; basically ensure that nobody is messing with the rendered result. And it lets you be relatively inefficient with the data structures behind it ("re-render" entire components on each change etc). And this seems to be incompatible with the scenario where you want third parties to mess with the DOM, like for example being compatible with third party JS plugins and whatnot
Feras Khoursheed
@devmondo
yep man,
you summed it up beautifully
this sum of your should be the official answer to why use virtual DOM
Akash
@akashma19
in polymer app-route how to use queryparams??
Nelo Mitranim
@mitranim
probably wrong channel
Will Streeter
@willSonic
Hi. I discovered this angular2-polymer a few days ago and have been implementing various scenarios. One scenario that I have been trying , is how to incorporate neon-animations ... Has anyone had any luck incorporating polymer's neon-animation with angular 2 ? ... perhaps some one point me to example? thank you