From Node.js to Design Patterns

From Node.js to Design Patterns
Luciano Mammino
@loige

👋 Hello, I am Luciano
Cloud & Full stack software engineer
nodejsdesignpatterns.com
Let’s connect:
🌎 loige.co
🐦 @loige
🧳 lucianomammino

👇 Get the slides (and click around…)
loige.link/devcast
@loige

What is Node.js
Node.js is an open-source, cross-platform,
JavaScript runtime environment that executes
JavaScript code outside a web browser.
@loige

Node.js + JavaScript: when?
● Building for the web
○ Websites, APIs, Servers, Single Page Applications, Bots, etc…
● Command-line applications and tools
● Mobile applications (React Native, Ionic, NativeScript, etc.)
● Desktop apps (Electron)
● Embedded & IoT (Espruino, Johnny-Five)
@loige

Async I/O
In JavaScript and in Node.js, input/output operations (e.g. making an HTTP
request) are non-blocking.
@loige

OkHttpClient client = new OkHttpClient();
Request request = new Request.Builder()
.url("https://google.com")
.build();
Response response = client.newCall(request).execute();
System.out.println(response.body().string());
System.out.println("Request completed");
A blocking HTTP request (Java)
Output
blocking...
blocking...
<google home page HTML code>
Request completed
Code executed
“In order”
@loige

Is blocking I/O bad?
It depends…
If your application is I/O heavy, then you might have a problem...
@loige

Let’s make 3 requests...
Req 1
Req 2
Req 3
time
@loige

You can always use threads...
Req 1
Req 2
Req 3
time
But threads are…
Complicated
Expensive
A lot of idle time per thread!
wait...
wait...
wait...
@loige

client.get('https://google.com',
(err, resp) => {
console.log(resp.body)
}
)
console.log('Request completed (?)')
👍
With Node.js async I/O
Output
Request “in the
background”
Request completed (?)
<google home page HTML code>
⚠ Code executed
“OUT of order”
Not really completed!
Non-blocking:
execution continues
Callback function
1
2
3
@loige

Mental model
You “just” schedule async I/O and you will get notiﬁed when the
operation is completed!
● Async I/O happens in the background asynchronously
● You don’t have to manage threads to get concurrency!
@loige

Let’s do 3 requests with Async I/O
“User” thread
Event loop
(libuv)
time
idle... idle... idle...
Simpler code for the user
Idle time only in one thread
Sched. req1
Sched. req2
Sched. req3 req1 result req3 result req2 result
@loige

I am oversimplifying a bit… 😛
Watch loige.link/event-loop-what-the-heck
if you want to go more in depth!
@loige

Many ways to handle
async ﬂows
@loige

Delete last reservation if conﬁrmed
● Get a guest object from a guest id (async)
● Get the last reservation from the guest object
● Get the details of that reservation (async)
● Delete that reservation if “conﬁrmed” (async)
@loige

Callbacks
function deleteLastReservationIfConfirmed (client, guestId, cb) {
client.getGuest(guestId, (err, guest) => {
if (err) { return cb(err) }
const lastReservation = guest.reservations.pop()
if (typeof lastReservation === 'undefined') {
return cb(null, false)
}
client.getReservation(lastReservation, (err, reservation) => {
if (reservation.status === 'confirmed') {
client.deleteReservation(reservation.id, (err) => {
return cb(null, true)
})
}
})
})
}
@loige

Promises
function deleteLastReservationIfConfirmed (client, guestId) {
return client.getGuest(guestId)
.then((guest) => {
if (typeof lastReservation !== 'undefined') {
return client.getReservation(lastReservation)
}
})
.then((reservation) => {
if (!reservation || reservation.status !== 'confirmed') {
return false
}
return client.deleteReservation(reservation.id)
})
}
@loige

Async/Await
async function deleteLastReservationIfConfirmed (client, guestId) {
const guest = await client.getGuest(guestId)
if (typeof lastReservation === 'undefined') {
return false
}
const reservation = await client.getReservation(lastReservation)
if (!reservation || reservation.status !== 'confirmed') {
return false
}
return client.deleteReservation(reservation.id)
}
@loige

Advantages of Async/Await
● Easier to read and reason about (“sequential ﬂow”)
● Easier to deal with conditional async operations
● Uniﬁed error handling
(you can catch both synchronous and asynchronous errors)
⚠ To fully understand async/await, you still need to understand callbacks and
promises, don’t ignore them!
@loige

Other ways to handle async
● Events
● Streams
● Async iterators/generators
@loige

Some interesting
async patterns
@loige

const guestIds = ['Peach', 'Toad', 'Mario', 'Luigi']
for (const guestId of guestIds) {
await deleteLastReservationIfConfirmed(client, guestId)
}
Sequential execution
@loige

guestIds.forEach(async (guestId) => {
await deleteLastReservationIfConfirmed(client, guestId)
})
Sequential execution ⚠ Common pitfall
Don’t use Array.map or Array.forEach!
forEach will run all the functions without awaiting them, so all the delete
invocations will happen concurrently!
@loige

await Promise.all(
guestIds.map(
guestId => deleteLastReservationIfConfirmed(client, guestId)
)
)
Concurrent execution
⚠ Promise.all rejects as soon as one promise rejects. A failure will result in the failure of the entire operation.
@loige

const results = await Promise.allSettled(
guestIds.map(
guestId => deleteLastReservationIfConfirmed(client, guestId)
)
)
Concurrent execution - Alternative
[
{ status: 'fulfilled', value: true },
{ status: 'fulfilled', value: true },
{ status: 'rejected', reason: Error },
{ status: 'fulfilled', value: true }
]
@loige

const mapLimit = require('async/mapLimit')
const guestIds = ['Peach', 'Toad', 'Mario', 'Luigi', '...']
const results = await mapLimit(
guestIds,
2, // max concurrency
async (guestId) => deleteLastReservationIfConfirmed(client, guestId)
)
Concurrent execution - limited
When you have a lot of tasks to run and what to keep limited concurrency
Uses the third-party async module (npm.im/async)
@loige

Request batching
Classic ﬂow - one user
HTTP
Server DB
/availability/v1/units
@loige

Request batching
Classic ﬂow - multiple users (no batching)
HTTP
Server DB
@loige

Request batching
Classic ﬂow - multiple users (with batching!)
HTTP
Server DB
📘 Requests in-ﬂight
pending
fulfilled
⏱ /availability/v1/units
⏱
@loige

const { createServer } = require('http')
const server = createServer(async (req, res) => {
const url = new URL(req.url, 'http://localhost')
if (url.pathname !== '/availability/v1/units') {
res.writeHead(404, 'Not found')
return res.end()
}
const units = await getAvailableUnitsFromDb()
res.writeHead(200)
res.end(JSON.stringify(units))
})
server.listen(8000)
The web server
@loige

let pendingRequest = null
async function getAvailableUnitsFromDb () {
if (pendingRequest) {
console.log('batching')
return pendingRequest
}
console.log('Getting data from db')
pendingRequest = db.query('SELECT * FROM units WHERE "availability" > 0')
pendingRequest.finally(() => {
pendingRequest = null
})
return pendingRequest
}
Get units from DB
@loige

Performance comparison
Without batching With batching
+15%
throughput
@loige

In conclusion
● Node.js is a great runtime for I/O bound applications
● It’s also great for full stack web development
● The async model allows you to express concurrent computation effectively
● You still need to master callbacks, promises and async / await!
● There are many patterns that can help you out to keep your code organised
and more performant.
@loige

Want to learn more?
● nodejsdesignpatterns.com - possibly a great book :)
● loige.link/javascript-mdn - mozilla guides
● eloquentjavascript.net - free e-book
● freecodecamp.org - interactive code training
● nodejs.org/api - Node.js oﬃcial docs
@loige

Thank you!
loige.link/devcast
@loige

From Node.js to Design Patterns

More Related Content

What's hot (20)

Similar to From Node.js to Design Patterns (20)

More from Luciano Mammino (20)

Recently uploaded (20)

From Node.js to Design Patterns