最後の突然変異のみの突然変異監視

Question

私はMutationObserverを使用して、ドラッグ可能なオブジェクトの位置の変更を保存しています。それはこのようになります

：

let observer = new MutationObserver((mutations) => { 
     mutations.forEach((mutation) => { 
      this.builderData[element.id].$position.left = element.style.left; 
      this.builderData[element.id].$position.top = element.style.top; 
      this.saveBuilderData(); 
     }); 
    }); 
    observer.observe(element, { attributes : true, attributeFilter : ['style'] }); 

はしかし、画素毎に、この実行が変わっので、走っている操作を節約たくさんあります。私はそれが約1秒間突然変異を停止した後、または各コールバックが前のものを除外した後にのみ保存した​​いと思います。私は既にRxJavaでこのようなことをしましたが、MutationObserverで動作しませんでした。

アイデア？

Answer 1

setTimeoutで簡単な1秒の遅延を追加できます。

前のコールバックは破棄され、スタイルが唯一の非アクティブの1秒後に変更され、この方法：

let timer; 
let observer = new MutationObserver((mutations) => { 
    if (timer) clearTimeout(timer); 
    timer = setTimeout(() => { 
    mutations.forEach((mutation) => { 
     this.builderData[element.id].$position.left = element.style.left; 
     this.builderData[element.id].$position.top = element.style.top; 
     this.saveBuilderData(); 
    }); 
    }, 1000); 
}); 
observer.observe(element, { attributes : true, attributeFilter : ['style'] });