Meteor Template rendering order

I have the following code in Meteor.js written by someone else

<div>
 <div> {{> yield region='tickets'}} </div>
 <div> {{> yield region='ticketView'}} </div>
 <div> {{> yield region='analytics'}} </div>
</div>

It works fine but I have an issue with the order in which those components are rendered. When that page is opened, the ‘analytics’ clearly loads/renders first, then once that is done the rest of it renders. I would like it to load/render in the order that the components are called.

Any help would be much appreciated!

It’s probably because the data is ready first.

You could coordinate the order creating some state in the top level component to avoid displaying the one from the bottom first.

I’m not sure what this order is causing in your app but if the problem is because your UI is moving during the load process maybe you could use a Skeleton during the load. You can read more about this pattern here.