Event Loop & Microtasks

How are MutationObserver callbacks handled in the event loop?

console.log('Script start');

MutationObserver = class {
  constructor(callback) {
    callback([{type: 'attributes'}], this);
  }
};

const observer = new MutationObserver(() => console.log('Observer'));
console.log('Script end');

As regular synchronous code
As macrotasks
As microtasks
MutationObserver callbacks are handled as microtasks: 1) Execute after synchronous code but before macrotasks, 2) Similar priority to Promise callbacks, 3) Used for DOM mutation notifications, 4) Part of the microtask queue specification, 5) Ensures consistent ordering with other DOM-related operations, 6) Important for implementing reactive DOM updates.
As high-priority interrupts

Next Question (15/20)