crysalead-js / dom-layer

Virtual DOM implementation.
MIT License
30 stars 1 forks source link

event management #40

Closed ghost closed 9 years ago

ghost commented 9 years ago

Is there a need for activation the events on every page when you create a virtual DOM tree? You don't think it's better that all events get attached on the page upon pageload, or everytime a dev create / mount a tree? Easy too forget to.

Anyway. It seems that REACT are heading that way.

In native vanila DOM, returning false will trigger prevent default ( it does not stop bubbling). Will this be integrated?

And how are you doing it when you listen to DOM events during bubble phase? And do you have any option for listen to DOM events during capture phase?

I can only see bubble phase support, but REACT etc does support both.

Multiple handler per event OR multiple events per handler? Is this going to be supported?

REACT also sanitize all events and cleanup the broken ones, are you adding this?

REACT are also supporting touch events, see the function listenTo()

jails commented 9 years ago

Personnaly I don't like things that I'm not aware about, especially in low level library. Having a working feature you have no idea how and why it's working is also really confusing.

Nope, if you wan't to prevent default you will need to call preventDefault() explicitly. And also in React returning false from an event handler will be removed https://github.com/facebook/react/blob/0.12-stable/src/browser/eventPlugins/SimpleEventPlugin.js#L307-312

I don't understand what you mean by "listen to DOM events during bubble phase". events use a delegated strategy so you are not actually listening something. Only the document.body listen the events and forward them back to the event.delegateTarget element. So if this element is attaches to a virtual node which has a valid events defined, then it is executed.

Right now I don't see any revelant use case where having multiple handler for a single event may be interesting, so I don't think so. Furthermore, you won't be able to take advantage of if your higher abstraction is based on an html template.

For example in angular there's some directives like "ng-click" which specify custom behavior when an element is clicked.

<div  ng-click="expression"></div>

We can imagine that this kind of template can be automatically transformed into a valid virtual tree. However you won't be able to deal with something like <div ng-click="expression1" ng-click="expression2"></div> since you can't have two attribute with the same name.

React uses a "synthesized event system" which had a price in term of performance since for each "verbose" event like mousemove you need to encapsulate it in its own object and sanitize it etc. And I don't thing it worth the effort just for having full complete support of events for IE9. Especially as IE9 is event less popular as IE8 http://gs.statcounter.com/