Redefine element.style.transform property

[PixelsCommander]

We react on style changes via two approaches:

1.Listen to element.style.transform changes.
2.By setting element.styleGL.transform getter / setter

For first case we still move DOM element. Also DOM Mutation Observers are a bit slow;
Second case is not HTML compatible since it introduce styleGL property instead of style.

At the moment I do not know how to overload style.transform or style which is an instance of CSSStyleDeclaration host object in JavaScript

[matthew-dean]

According to the web, mutation observers would be the only way. But at least you only have to have one observer in the document. http://stackoverflow.com/questions/20364687/mutationobserver-and-current-computed-css-styles

[PixelsCommander]

Thank you for hint on one observer. Could save some resources.

Mutations observing is basically done, you may try it here http://pixelscommander.com/polygon/htmlgl/demo/basic-webgl.html . The issue is about finding more performant ways of setting transformations since Mutation Observer is something I would not like to execute 60 times per second even if it is faster than Mutation Events. Also there is no way to avoid DOM Element moving when using real style.transform and that was one of aims - do not animate DOM because it is expensive. So there is a backdoor for performance lovers - styleGL.transform property on DOM node which works as getter/setter and is just a direct access to WebGl sprite`s coordinates, rotation and scale.