Skip to content

Instantly share code, notes, and snippets.

@rainabba
Last active November 23, 2021 17:08
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save rainabba/6847b06bff1f5a37bb19663c7a4e3c0e to your computer and use it in GitHub Desktop.
Save rainabba/6847b06bff1f5a37bb19663c7a4e3c0e to your computer and use it in GitHub Desktop.
Understanding execution order in Express handlers
/*
To demonstrate the importance of understanding async execution order in the context of Express route handlers
Try in your browser at https://runkit.com/rainabba/understanding-execution-order-in-express-handlers
**/
const express = require('express'),
app = express(),
PORT = 3000,
axios = require('axios');
app.use(express.json());
app.get('/bad', function (req, res) {
res.json( { Date: new Date() } );
console.log("bad:: LOGGED AFTER res.json(), but in same frame."); // Seems safe
setTimeout( function(){
// This async code outside the current frame where res.json() was called and will never execute
console.log("bad:: LOGGED AFTER res.json(), but in different frame that won't execute when expected.");
}, 3000);
})
app.get('/okay', function (req, res) {
console.log("okay:: LOGGED AFTER res.json(), but in same frame."); // safe
setTimeout( function(){
// This async code outside the current frame where res.json() was called and will never execute
console.log("okay:: LOGGED AFTER res.json(), but in different frame that won't execute when expected.");
}, 3000);
return res.json( { Date: new Date() } );
})
app.get('/good', function (req, res) {
console.log("good:: LOGGED AFTER res.json(), but in same frame."); // safe
setTimeout( function(){
// This async code outside the current frame where res.json() was called and will never execute
console.log("good:: LOGGED BEFORE res.json(), but in a different frame via setTImeout, but as expected.");
return res.json( { Date: new Date() } );
}, 3000);
})
app.listen(PORT, function(err){
if (err) { console.error( { err } ); }
console.log("Server listening on PORT", PORT);
});
async function getCall(path) {
console.log("In getCall");
let res = await axios.get("http://localhost:3000/"+path);
// console.log({ res });
return res.data;
}
console.log("Before getCall(bad)");
let badData = await getCall("bad");
console.log({ badData });
console.log("After getCall(bad)");
console.log("Before getCall(okay)");
let okayData = await getCall("okay");
console.log({ okayData });
console.log("After getCall(okay)");
console.log("Before getCall(good)");
let goodData = await getCall("good");
console.log({ goodData });
console.log("After getCall(good)");
/*
"Before getCall(bad)"
"In getCall"
"Server listening on PORT"
3000
"bad:: LOGGED AFTER res.json(), but in same frame."
Object {badData: Object {Date: "2021-11-23T17:00:33.130Z"}}
"After getCall(bad)"
"Before getCall(okay)"
"In getCall"
"okay:: LOGGED AFTER res.json(), but in same frame."
Object {okayData: Object {Date: "2021-11-23T17:00:33.139Z"}}
"After getCall(okay)"
"Before getCall(good)"
"In getCall"
"good:: LOGGED AFTER res.json(), but in same frame."
"bad:: LOGGED AFTER res.json(), but in different frame that won't execute when expected."
"okay:: LOGGED AFTER res.json(), but in different frame that won't execute when expected."
"good:: LOGGED BEFORE res.json(), but in a different frame via setTImeout, but as expected."
Object {goodData: Object {Date: "2021-11-23T17:00:36.143Z"}}
"After getCall(good)"
**/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment