Object.observe() and AngularJS

Miško Hevery misko at google.com
Fri Sep 14 14:30:14 PDT 2012


AngularJS (http://angularjs.org) is a framework for building
web-applications, and which supports data-binding. In order to make
data-binding work without the use of wrapper objects which provide
accessors to data, we have to use dirty-checking to detect model changes.
We have reimplemented our dirty checking algorithm with Object.observe as a
proof of concept
here<http://www.google.com/url?q=https%3A%2F%2Fgithub.com%2Fmhevery%2Fangular.js%2Fcommit%2F5fb650998a240523170674c50df71b70109ca412&sa=D&sntz=1&usg=AFQjCNFJNh4ynRiS4_tRoyIRPosaPAMy5A>[1].
The integration work was surprisingly straight forward, because the
Object.observe async nature maps well to Angular's existing model. The only
place where we could not use Object.observe is in watching computed values
/ functions, but this is an already understood issue.

To measure performance improvements we have created a crude benchmark of a
table of 20 columns (a repeater) and 100 rows (another repeater) and placed
a binding in each cell for a total of 2000 cells. We then proceeded to
change a small portion of the model to see the performance characteristics
of the update. The result is summarized below.

Dirt checking:  40ms per update
Object.observe: 1-2ms per update (improvement of 20x-40x faster)


[1]
http://www.google.com/url?q=https%3A%2F%2Fgithub.com%2Fmhevery%2Fangular.js%2Fcommit%2F5fb650998a240523170674c50df71b70109ca412&sa=D&sntz=1&usg=AFQjCNFJNh4ynRiS4_tRoyIRPosaPAMy5A
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mail.mozilla.org/pipermail/es-discuss/attachments/20120914/028a0896/attachment.html>


More information about the es-discuss mailing list