title: Flow Router Footer Flashes to Top Before Data Loads
body: <p>I'm loading a grid of data with flow router, but when I view the page the footer always flashes to the top before the data loads. What is the best way to fix this?</p>
  
  <p>Here is the route:</p>
  
  <pre><code>AdminRoutes.route('/dashboard', {
    name: 'adminDashboard',
    action() {
      BlazeLayout.render('AppLayout', {page: 'AdminDashboard'});
    }
  });
  </code></pre>
  
  <p>Here is the js file:</p>
  
  <pre><code>import { Template } from 'meteor/templating'
  import Stores from '../../../../api/stores/stores.js'
  
  import './AdminDashboard.html'
  
  Template.AdminDashboard.onCreated(function() {
    var self = this;
    self.autorun(function() {
      self.subscribe('stores.names.links');
    });
  });
  
  Template.AdminDashboard.helpers({
    stores: function () {
      return Stores.find();
    }
  });
  </code></pre>
  
  <p>Here is the html layout file:</p>
  
  <pre><code>&lt;template name='AppLayout'&gt;
  
    {{#if Template.subscriptionsReady}}
  
      {{&gt; Header }}
  
      {{&gt; Template.dynamic template=page}}
  
      {{&gt; Footer }}
  
    {{/if}}
  
  &lt;/template&gt;
  </code></pre>
  
  <p>Here is the dashboard html file:</p>
  
  <pre><code>&lt;template name='AdminDashboard'&gt;
    &lt;div class='admin-dashboard-page'&gt;
  
      &lt;section class='stores-grid'&gt;
        {{#each stores}}
          &lt;div class='store'&gt;
            &lt;h2 class='store-name'&gt;{{name}}&lt;/h2&gt;
            &lt;a href='/admin/dashboard/{{link}}' class='store-button'&gt;Edit&lt;/a&gt;
          &lt;/div&gt;
        {{/each}}
      &lt;/section&gt;
  
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>