Node.js , express and async page building..how do you do this

Ok, I’ve worked with front end JavaScript but im still Shakey on async functions so bear with me.

Ive heard that it’s common practice that you need to fill the page asynchronsly so that if one part of the page is slow for some reason, the rest of the page will load without it until it’s ready.

I know how to do this on a page that already exists, like in the exercise with the weather api, but I don’t really get how to do this if express needs to build the page for you then send it.

Example
Psuedo node
VAR htmlString=’‘
VAR posts=mySql results
mySql…get stuff from database
htmlString+=’<html’>
For(I in posts){
htmlString+=’<\p>’+posts[I]+’</\p>’
}
htmlString+="

App=express()
App.get(/)=>function{app.send(‘htmlString’)}
Console.log(‘sent the html stuff’)

Then the html will show up on the browser and the console will read that it succeeded.

But how would I build each part? If I package all the html into a app.send, I still end up waiting for the whole document to be build into the htmlString then sent out.

What if I need one function building the posts another building a weather widget and another building stock exchange viewer(or whatever just multiple parts)

Do i use multiple sends and let my css handle the rest?

What is the practice here?

There are different ways to call async functions depending on what node version you are on.
Generally if there is data to get for the view you retrieve the data and use a callback function to render the data on the page/view.
The flow would be:

  1. App.get('/')
  2. get data from Db
  3. process data and render results to screen