head, scripts, css, body tag --> <div id="widget-page-header">...</div> <div id="widget-profile"> <div id="profile-header">...</div> <div id="PLACEHOLDER-profile-left-column"></div> <div id="PLACEHOLDER-profile-right-column"></div> </div> <!-- flush content: js includes and css parsing starts <script> </script> <!-- flush content: js is executed, dom bindings --> <script> </script> <!-- flush content: replace left column --> <script> </script> <!-- footer, end page --> // Lots of inline js createWidget({data}).render( {replace: '#PLACEHOLDER-profile-left-column'} ); createWidget({data}).render( {replace: '#PLACEHOLDER-profile-right-column' );