There are many difference.
Microtasks vs synchronous callbacks
One difference is that Object.observe
makes callbacks when you enter the message loop. I.e. many changes to the object results in a single callback with all changes rather than multiple callbacks.
When listening to changes on the DOM, the mutation events was replaced with mutation observers for the same reason. The microtask
solution is simply more performant than the synchronous callback.
Standard vs non-standard
In addition, Object.observe
is a suggested Ecmascript standard for Ecmascript 7. I.e. it is a proposed Javascript standard.
Intent
Object.observe is intended as a performant way to monitor changes to an entire object and the use case is expected to entail listening to many objects. This is a requirement for binding frameworks (i.e. client side templating) such as AngularJs and Polymer. Object.watch is more a Firefox feature to monitor a specific property and is sprung out of a debugger feature.