Removed refresh staggering everywhere except during periodic render

docs/faq.rst

@@ -128,8 +128,11 @@ be applied, it's as simple as that.
 
 How to limit the timed refresh on a dashboard?
 ----------------------------------------------
-By default, the dashboard timed refresh feature allows you to automatically requery every slice on a dashboard according to a set schedule. Sometimes, however, you won't want all of the slices to be refreshed - especially if some data is slow moving, or run heavy queries.
-To exclude specific slices from the timed refresh process, add the ``timed_refresh_immune_slices`` key to the dashboard ``JSON Metadata`` field:
+By default, the dashboard timed refresh feature allows you to automatically re-query every slice
+on a dashboard according to a set schedule. Sometimes, however, you won't want all of the slices
+to be refreshed - especially if some data is slow moving, or run heavy queries. To exclude specific
+slices from the timed refresh process, add the ``timed_refresh_immune_slices`` key to the dashboard
+``JSON Metadata`` field:
 
 ..code::
 
@@ -140,26 +143,22 @@ To exclude specific slices from the timed refresh process, add the ``timed_refre
         "timed_refresh_immune_slices": [324]
     }
 
-In the example above, if a timed refresh is set for the dashboard, then every slice except 324 will be automatically requeried on schedule.
+In the example above, if a timed refresh is set for the dashboard, then every slice except 324 will
+be automatically re-queried on schedule.
 
-
-How to speed up/slow down dashboard loading?
---------------------------------------------
-Dashboards stagger slice rendering by default over a period of 5 seconds. This reduces loads on
-some databases but slows down loading time. You can disable render staggering by setting the key
-``stagger_refresh`` in the ``JSON Metadata`` to ``false`` or alter the stagger period by setting
-``stagger_time`` to a value in milliseconds:
+Slice refresh will also be staggered over the specified period. You can turn off this staggering
+by setting the ``stagger_refresh`` to ``false`` and modify the stagger period by setting
+``stagger_time`` to a value in milliseconds in the ``JSON Metadata`` field:
 
 ..code::
 
     {
-       "stagger_refresh": false,
-       "stagger_time": 2000
+        "stagger_refresh": false,
+        "stagger_time": 2500
     }
 
-Here, whenever the dashboard refreshes slices, all requests will be issued simultaneously. The
-stagger time of 2 seconds is ignored.
-
+Here, the entire dashboard will refresh at once if periodic refresh is on. The stagger time of
+2.5 seconds is ignored.
 
 Why does fabmanager or superset freezed/hung/not responding when started (my home directory is NFS mounted)?
 -----------------------------------------------------------------------------------------

superset/assets/javascripts/dashboard/Dashboard.jsx

@@ -126,7 +126,8 @@ export function dashboardContainer(dashboard, datasources, userid) {
         }
       });
       this.loadPreSelectFilters();
-      this.startPeriodicRender(0);
+      this.renderSlices(this.sliceObjects);
+      this.firstLoad = false;
       this.bindResizeToWindowResize();
     },
     onChange() {
@@ -255,22 +256,20 @@ export function dashboardContainer(dashboard, datasources, userid) {
         this.refreshTimer = null;
       }
     },
-    renderSlices(slices, interval = 0) {
+    renderSlices(slices, force = false, interval = 0) {
+      if (!interval) {
+        slices.forEach(slice => slice.render(force));
+        return;
+      }
       const meta = this.metadata;
-      const refreshTime = Math.max(interval, meta.stagger_time || 5000);
-      // Delay is zero if not staggerring slice refresh
+      const refreshTime = Math.max(interval, meta.stagger_time || 5000); // default 5 seconds
       if (typeof meta.stagger_refresh !== 'boolean') {
         meta.stagger_refresh = meta.stagger_refresh === undefined ?
           true : meta.stagger_refresh === 'true';
       }
       const delay = meta.stagger_refresh ? refreshTime / (slices.length - 1) : 0;
       slices.forEach((slice, i) => {
-        // Caller may pass array of slices or { slice, force }
-        if (slice.slice) {
-          slice.slice.render(slice.force, delay * i);
-        } else {
-          slice.render(false, delay * i);
-        }
+        setTimeout(() => slice.render(force), delay * i);
       });
     },
     startPeriodicRender(interval) {
@@ -279,10 +278,8 @@ export function dashboardContainer(dashboard, datasources, userid) {
       const immune = this.metadata.timed_refresh_immune_slices || [];
       const refreshAll = () => {
         const slices = dash.sliceObjects
-          .filter(slice => immune.indexOf(slice.data.slice_id) === -1 || dash.firstLoad)
-          .map(slice => ({ slice, force: !dash.firstLoad }));
-        dash.firstLoad = false;
-        dash.renderSlices(slices, interval * 0.2);
+          .filter(slice => immune.indexOf(slice.data.slice_id) === -1);
+        dash.renderSlices(slices, true, interval * 0.2);
       };
       const fetchAndRender = function () {
         refreshAll();

superset/assets/javascripts/dashboard/components/Controls.jsx

@@ -34,8 +34,8 @@ class Controls extends React.PureComponent {
     });
   }
   refresh() {
-    const slices = this.props.dashboard.sliceObjects.map(slice => ({ slice, force: true }));
-    this.props.dashboard.renderSlices(slices);
+    // Force refresh all slices
+    this.props.dashboard.renderSlices(this.props.dashboard.sliceObjects, true);
   }
   changeCss(css) {
     this.setState({ css });

superset/assets/javascripts/modules/superset.js

@@ -200,7 +200,7 @@ const px = function (state) {
           }, 500);
         });
       },
-      render(force, delay = 0) {
+      render(force) {
         if (force === undefined) {
           this.force = false;
         } else {
@@ -215,23 +215,21 @@ const px = function (state) {
         container.fadeTo(0.5, 0.25);
         sliceCell.addClass('slice-cell-highlight');
         container.css('height', this.height());
-        setTimeout(() => {
-          $.ajax({
-            url: this.jsonEndpoint(formDataExtra),
-            timeout: timeout * 1000,
-            success: (queryResponse) => {
-              try {
-                vizMap[formData.viz_type](this, queryResponse);
-                this.done(queryResponse);
-              } catch (e) {
-                this.error('An error occurred while rendering the visualization: ' + e);
-              }
-            },
-            error: (err) => {
-              this.error(err.responseText, err);
-            },
-          });
-        }, delay);
+        $.ajax({
+          url: this.jsonEndpoint(formDataExtra),
+          timeout: timeout * 1000,
+          success: (queryResponse) => {
+            try {
+              vizMap[formData.viz_type](this, queryResponse);
+              this.done(queryResponse);
+            } catch (e) {
+              this.error('An error occurred while rendering the visualization: ' + e);
+            }
+          },
+          error: (err) => {
+            this.error(err.responseText, err);
+          },
+        });
       },
       resize() {
         this.render();