Flattening Nested Data Structures

[00:00:00]
>> David Khourshid: Okay, the next topic that I want to talk about, which has come up in previous questions and conversation, is data normalization. And so the key part of this is avoiding nested and deeply nested data structures. And we want to do this for two reasons. The first reason is performance.

[00:00:21]
So when you have a flat data structure, then you have either constant lookups or lookups of at most o of n instead of O times m, which just gets exponentially bigger when you need to find a specific piece of data. So that's why keeping things flat is really useful.

[00:00:44]
And the second reason is because you want to make things easier to both update and understand in your code base when it comes to nested data. So one of the examples that came up was nested forms. And so let's say that you have a nested form where you're managing, just going with the same travel theme, you're managing multiple passengers.

[00:01:08]
And each passenger has a name. They have a passport number, a known traveler ID number, birth date, et cetera. So the way that you might model this at first is you would say, okay, yeah, this is definitely a just a nested form. We have passengers as an array, and then inside each array is an item with even more things inside.

[00:01:29]
And so they might have, let's say you have to put in countries you visited. So now there's even more nesting going on inside of that object. And so, it becomes difficult to update those items because you have to drill deeply into that object structure. And also, it actually is bad for performance too.

[00:01:54]
And the reason it's bad is because when you're updating something that's deeply nested, you're not only updating that specific item, you're also updating that item's parents and that item's parent's parents, et cetera. And so anything that only cares about the parent is at risk of re rendering, even if it doesn't care about the child's data inside.

[00:02:16]
And so this is why data normalization, it's very good for those two reasons, both performance improvements and also understandability. What we're going to do is we're actually going to learn to normalize data and we're going to be doing the same approach where we're doing things side by side.

[00:02:37]
But I'm just going to show you an example over here, normalization page, and I'm just going to actually make a quick oops, quick demo page. So
>> David Khourshid: Let's say that we have that same example where we have const flight data. So we might have a, you know, reservation ID and that might be a string, you know, flight number or we might have like a flight related to that.

[00:03:18]
And then we might have some passengers. And so each of these passengers will also have some ID. So this might be John Doe, etc. And we might also have visited countries and then we have a lot of nested data going on. So we have our flight inside, we have the reservation ID inside, et cetera.

[00:03:42]
There's just a lot going on here. In fact, let's make another passenger, Jane Doe, they both went to the same three countries. So when you want to update, for example, the name of this passenger or the visited countries, the problem is that we're essentially just changing every single part in this structure and you're potentially causing a re render for anything that relies on anything inside of this flight's data.

[00:04:12]
So what can we do instead? Well, let's actually make this bigger so we have const flights and then we might have a, or let's call this itinerary. And in our itinerary we might have a bunch of flights and inside that we might have like flights data over here or actually let's call this reservations because our itinerary might have multiple reservations.

[00:04:43]
So let's have it generate another one over here just for an example. So instead of having a deeply nested data structure like this, what we could do instead is we could flatten this a little bit and for example, let's pull out passengers over here. So what will this look like?

[00:05:03]
We'll have a passenger, so we'll have the same information right over here. And instead we're going to relate it to the reservation. So we're going to have a reservation ID for example, 123 and same thing over here. So let's just get rid of this. And now the difference is that we no longer need to nest that data deeply inside of there.

[00:05:32]
We could even do the same thing for flights if we wanted to. But just for demonstration purposes, we're going to flatten just this one area. So now let me just do a split screen over here. Before, when we were looking up, for example, the passengers of a specific reservation we would have to do const passengers equals itinerary reservations.

[00:06:02]
First we would have to find the reservations. So we would say r.i =, let's say it's equal to 1, 2, 3. So that's the first level where we have to look at. And then we would have to just grab, let's grab a specific passenger. So then passengers and then we have to find that passenger from there as well.

[00:06:32]
So we're doing a lot of nested searching. But when we have a more normalized structure besides the performance benefits we get, let's say we have a const johnPassenger. We could look directly at the passengers. So we could say itinerary.passengers, where the passenger reservationId is 123 and the passenger id is John Doe.

[00:07:10]
So that's just an example. I mean they're around the same lines of code, but the difference is in the. And that's only because we're word wrapping see that one's actually shorter. But you are going to see benefits in performance and also your data structure is going to be a lot simpler.

[00:07:28]
And the third thing too is going back to a previous exercise that we did. When you're modeling things in an entity relationship diagram, everything is flat, so there is no nesting. Everything is related to each other via those foreign keys. And so we could model that exactly the same and see similar benefits in our front end applications as well.

[00:07:52]
So that's where data normalization just becomes very useful.