Javascript csom loads slowly causing flicker of pages

Hi,

I am using a publishing site, in which I have a custom Master page.

In the master page, I have added a jquery, which sets the Header and footer. (Header and footer data is stored in custom list)

In the master page, i have the code as :

<script type="text/javascript">

$(document).ready(function () {
  SP.SOD.executeFunc('sp.js', 'SP.ClientContext', loadAllHeader);
  SP.SOD.executeFunc('sp.js', 'SP.ClientContext', loadAllFooter);
  });

The 2 functions are written in a seperate js file. The data is working fine, but the header and footer are loaded after all elements of master page is loaded. This causes the page to flicker or move..

How to retrieve and show the Javascript csom data together with the master page contents?

Thanks