Redraw in a frame

abluchet · abluchet · commit c958bbf1afcc · 2017-12-12T18:12:18.000+01:00
diff --git a/examples/index.html b/examples/index.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<html class="no-js" lang="">
+    <head>
+        <meta charset="utf-8">
+        <title></title>
+    </head>
+    <body>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <div class="dpicker"></div>
+      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
+      <script src="../dist/dpicker.js"></script>
+      <script>
+        ;[].slice.call(document.querySelectorAll('.dpicker')).forEach((e) => {
+          var dp = new dpicker(e)
+        })
+      </script>
+    </body>
+</html>
diff --git a/src/dpicker.js b/src/dpicker.js
@@ -543,8 +543,9 @@ DPicker.prototype.modelSetter = function (newValue) {
  * Decorate it with modules to do things before redraw
  */
 DPicker.prototype.redraw = function () {
-  const newTree = this.getTree()
-  this._tree = nanomorph(this._tree, newTree)
+  window.requestAnimationFrame(() => {
+    this._tree = nanomorph(this._tree, this.getTree())
+  })
 }
 
 Object.defineProperties(DPicker.prototype, {
