1
00:00:00,240 --> 00:00:05,450
In the last video we answer to the question what is no J.S. in this video.

2
00:00:05,460 --> 00:00:11,670
We're going to turn our attention towards the why behind No J So why is no J as a tool you should spend

3
00:00:11,670 --> 00:00:12,800
your time learning.

4
00:00:12,870 --> 00:00:20,310
And why is no J ust a good tool for the job of building out applications now as you know based off of

5
00:00:20,310 --> 00:00:26,400
the fact that you're here taking this class more and more when people want to learn a new back end technology

6
00:00:26,610 --> 00:00:33,870
they are choosing node j s as their tool of choice the node J.S. skillset is in hot demand with companies

7
00:00:33,870 --> 00:00:40,800
like Netflix Uber and Wal-Mart all using Node in production nodes also useful for developers anywhere

8
00:00:40,800 --> 00:00:41,660
on the stack.

9
00:00:41,790 --> 00:00:46,530
So we have front end developers you might need to use a little node here and there to compile their

10
00:00:46,530 --> 00:00:48,580
apps or maybe serve up a Web site.

11
00:00:48,600 --> 00:00:55,320
They're working with and obviously back and engineers are using no J.S. extensively to build out their

12
00:00:55,320 --> 00:00:59,710
web app back ends API eyes and command line applications.

13
00:00:59,760 --> 00:01:06,360
Now in the last video we broke down this first sentence we talked about how no J.S. is a javascript

14
00:01:06,360 --> 00:01:13,250
runtime built on Chrome's V8 JavaScript engine and this one we're gonna break down the other two sentences.

15
00:01:13,260 --> 00:01:14,630
There's only three total.

16
00:01:14,670 --> 00:01:17,250
We got the second one and the third one.

17
00:01:17,370 --> 00:01:22,260
Now you'll notice that you don't have those second two sentences on your screen.

18
00:01:22,260 --> 00:01:26,610
If I were to load up No j s dot org I just get that first sentence.

19
00:01:26,610 --> 00:01:33,060
We already discussed in the past this was the complete summary on the Web site and I've cached it so

20
00:01:33,060 --> 00:01:34,130
we can talk about it.

21
00:01:34,200 --> 00:01:39,870
In my opinion I think it's a shame they took it down because it concisely summed up why no JSA is an

22
00:01:39,910 --> 00:01:42,000
ecosystem worth getting into.

23
00:01:42,000 --> 00:01:44,630
Let's go ahead and start with that second sentence.

24
00:01:44,640 --> 00:01:52,530
No J.S. uses an event driven non blocking I O model that makes it lightweight and efficient.

25
00:01:52,560 --> 00:01:55,670
Now let's just focus on non blocking I O.

26
00:01:55,710 --> 00:02:04,320
What exactly is I O I O stands for input output and your node application is gonna use I O anytime it's

27
00:02:04,320 --> 00:02:07,010
trying to communicate with the outside world.

28
00:02:07,080 --> 00:02:10,600
So if you're node app it needs to communicate with the machine it's running on.

29
00:02:10,720 --> 00:02:16,040
That's I O for example reading some data from a file on the file system.

30
00:02:16,170 --> 00:02:21,180
If you're node app needs to communicate with some other server that's I O as well.

31
00:02:21,270 --> 00:02:28,230
For example querying a database to fetch some records for a given user that's gonna be an I O operation

32
00:02:28,470 --> 00:02:34,890
and I O operations take time now with no J S we get non blocking I O.

33
00:02:34,980 --> 00:02:39,410
That means that well your node application is waiting for a response.

34
00:02:39,420 --> 00:02:41,660
Let's say a response from that database.

35
00:02:41,700 --> 00:02:43,260
It can do other things.

36
00:02:43,260 --> 00:02:48,530
It can continue to process other code and make other requests.

37
00:02:48,720 --> 00:02:56,970
Now non blocking is actually from the browser so non blocking I O started in the browser because otherwise

38
00:02:57,180 --> 00:03:02,180
the browser would completely freeze up whenever an IO operation was happening.

39
00:03:02,220 --> 00:03:08,100
So if I was trying to fetch some data to render it to a user well that data was being fetched the user

40
00:03:08,100 --> 00:03:13,320
wouldn't be able to do anything they wouldn't be able to click links or buttons and obviously that's

41
00:03:13,320 --> 00:03:21,480
a bad experience with non blocking I O it frees up the browser to allow the user to interact with the

42
00:03:21,480 --> 00:03:22,740
user interface.

43
00:03:22,740 --> 00:03:27,450
Well those Io operations are running in the background and the same thing is true with node.

44
00:03:27,450 --> 00:03:33,690
We can continue to do other things while we're waiting for those long running Io operations to complete

45
00:03:33,980 --> 00:03:38,040
and this is a critical feature of what makes node so great.

46
00:03:38,040 --> 00:03:45,210
And I put together a quick visualization so we can compare non blocking to blocking I O in this quick

47
00:03:45,210 --> 00:03:46,180
visualization.

48
00:03:46,200 --> 00:03:51,870
We're going to work through two code examples now both code examples aim to get the exact same thing

49
00:03:51,870 --> 00:03:52,470
done.

50
00:03:52,560 --> 00:03:55,050
They just do it in slightly different ways.

51
00:03:55,140 --> 00:03:59,150
On the left hand side we have a blocking example on the right hand side.

52
00:03:59,160 --> 00:04:05,490
We have a non blocking example and there's no need to write any of this out as we're just going to explore

53
00:04:05,580 --> 00:04:10,040
how these programs would execute using these timelines down below.

54
00:04:10,050 --> 00:04:16,210
That's going to allow us to visualize the differences between blocking and non blocking ie.

55
00:04:16,380 --> 00:04:17,550
Now what do we have here.

56
00:04:17,550 --> 00:04:20,480
We have a bunch of regular javascript code.

57
00:04:20,520 --> 00:04:27,240
The only thing specific to know J.S. is this require a function which is called on the first line of

58
00:04:27,270 --> 00:04:28,980
each little snippet.

59
00:04:28,980 --> 00:04:31,930
You'll learn all about require in the next section.

60
00:04:31,980 --> 00:04:36,960
For now all you need to know is that it's a way to get functionality from another file.

61
00:04:36,960 --> 00:04:39,180
So in this case both of these scripts.

62
00:04:39,270 --> 00:04:46,560
They load in a function defined elsewhere and they call them a couple of times to perform some I O operations

63
00:04:46,650 --> 00:04:48,430
the I O operation for both.

64
00:04:48,430 --> 00:04:52,430
It's attempting to do the same thing so over here for the blocking example.

65
00:04:52,500 --> 00:04:59,370
The goal is to take in a user I.D. and then go off to a database and actually fetch that user's profile

66
00:04:59,370 --> 00:05:04,270
information and we do the same thing over here in the non blocking example.

67
00:05:04,320 --> 00:05:07,910
So to start we try to fetch the user with an idea of one.

68
00:05:07,920 --> 00:05:09,480
Then we print it to the console.

69
00:05:09,480 --> 00:05:14,340
We do the same thing over here using a slightly different pattern which we'll get into shortly.

70
00:05:14,340 --> 00:05:19,480
Then over here we try to fetch the user with the idea of two and we print that to the console.

71
00:05:19,590 --> 00:05:21,780
And we do the same thing over here.

72
00:05:21,810 --> 00:05:27,870
Finally both snippets attempt to add up to numbers and print that sum to the console as well.

73
00:05:27,870 --> 00:05:28,960
And that's all they do.

74
00:05:29,120 --> 00:05:34,680
Now down below I have some units for each timeline that's gonna help us compare the relative operating

75
00:05:34,680 --> 00:05:35,560
speeds.

76
00:05:35,610 --> 00:05:40,850
They're not exactly seconds but for the sake of this example you can definitely think of them as seconds

77
00:05:40,860 --> 00:05:45,240
and now we're actually going to run through each seeing how they execute.

78
00:05:45,240 --> 00:05:50,610
We're going to start with the blocking example and for both examples we're going to ignore that first

79
00:05:50,610 --> 00:05:51,070
line.

80
00:05:51,080 --> 00:05:52,770
The first line is the same for both.

81
00:05:52,860 --> 00:05:56,900
And it's not part of this whole blocking verse non blocking discussion.

82
00:05:57,000 --> 00:06:02,190
So the first thing we really do over here is we pass one into get user sync.

83
00:06:02,190 --> 00:06:08,940
The goal here is to go off to the database and get the user profile for the user whose idea is one.

84
00:06:08,940 --> 00:06:11,010
Now what does that look like while down below.

85
00:06:11,010 --> 00:06:12,650
It looks a bit like this.

86
00:06:12,720 --> 00:06:17,310
Here I have a block representing the time this entire operation takes to complete.

87
00:06:17,460 --> 00:06:22,710
And in this case I've chosen to make the length of our IO operation two seconds and that's going to

88
00:06:22,710 --> 00:06:28,920
be the exact same length of all Io operations in these examples regardless of whether it's blocking

89
00:06:29,130 --> 00:06:30,650
or non blocking.

90
00:06:30,660 --> 00:06:32,270
So this includes everything.

91
00:06:32,280 --> 00:06:38,130
It includes initiating their request and actually waiting for the database to fetch the data and send

92
00:06:38,130 --> 00:06:40,790
it back to our node application.

93
00:06:40,800 --> 00:06:42,570
So once that's done what do we do.

94
00:06:42,570 --> 00:06:45,950
We go ahead and just print user 1 to the console.

95
00:06:46,050 --> 00:06:48,080
That is not an I O operation.

96
00:06:48,150 --> 00:06:53,180
And it runs really quickly from there we continue working through our program.

97
00:06:53,190 --> 00:06:54,750
One line at a time.

98
00:06:54,750 --> 00:06:56,880
We go one after the previous.

99
00:06:56,910 --> 00:06:58,830
So right here what do we have.

100
00:06:58,830 --> 00:07:04,760
We have user 2 and we get the second user by passing two into get user sync.

101
00:07:04,770 --> 00:07:09,750
Once again we wait two seconds to actually get that second user right here.

102
00:07:09,750 --> 00:07:13,010
These two blocks are the exact same length.

103
00:07:13,080 --> 00:07:18,420
The next thing we do is we go ahead and print that second user that happens on line 7.

104
00:07:18,420 --> 00:07:24,030
Once again not an IO operation it runs really quickly and the same thing is true of the last thing we

105
00:07:24,030 --> 00:07:27,180
do which is we calculate and print the sum.

106
00:07:27,180 --> 00:07:31,700
So this is the order of operations and this is the entire time it takes to run.

107
00:07:31,740 --> 00:07:35,840
In this case let's say it's basically four and a half seconds.

108
00:07:35,850 --> 00:07:41,670
Now you notice the bulk of this four and a half seconds is taken up by fetching second user and fetching

109
00:07:41,670 --> 00:07:42,680
first user.

110
00:07:42,810 --> 00:07:44,060
And well that's happening.

111
00:07:44,100 --> 00:07:45,930
Our app isn't doing anything.

112
00:07:46,020 --> 00:07:49,330
It's waiting for the database to send the data back.

113
00:07:49,350 --> 00:07:51,780
It's not actually doing any work on its own.

114
00:07:52,320 --> 00:07:58,110
Now let's go ahead and run through the example on the right to see how this differs even when the IO

115
00:07:58,110 --> 00:08:00,870
operations still take two seconds.

116
00:08:00,870 --> 00:08:05,730
The first thing that happens over here is the same thing that happened over here we are attempting to

117
00:08:05,730 --> 00:08:08,700
flash the user with the idea of one.

118
00:08:08,700 --> 00:08:09,750
So what does that look like.

119
00:08:09,750 --> 00:08:15,390
Well you'll notice that over here we're actually passing a function in as our second argument to get

120
00:08:15,390 --> 00:08:16,040
user.

121
00:08:16,140 --> 00:08:20,390
This is using the callback pattern and if it's something you're not familiar with.

122
00:08:20,400 --> 00:08:25,680
If this code looks really foreign that is a ok for the moment we're actually going to cover all of this

123
00:08:25,710 --> 00:08:27,420
in detail in the class.

124
00:08:27,420 --> 00:08:32,770
For now we're just using it to illustrate at a high level the differences between the two patterns.

125
00:08:32,790 --> 00:08:34,110
So over here what do we do.

126
00:08:34,110 --> 00:08:36,750
We start to fetch the first user.

127
00:08:36,780 --> 00:08:41,720
Now the first thing you're going to notice is that this is not a two second operation.

128
00:08:41,720 --> 00:08:43,620
It happens basically instantly.

129
00:08:43,620 --> 00:08:47,190
That's because we're not waiting for the response from the database.

130
00:08:47,220 --> 00:08:48,630
That's the long running.

131
00:08:48,660 --> 00:08:49,220
Oh.

132
00:08:49,260 --> 00:08:53,890
Instead we are just starting that process allowing it to run in the background.

133
00:08:53,910 --> 00:09:00,960
So right here we are essentially registering our Iowa event with no J.S. telling it to call this callback

134
00:09:01,170 --> 00:09:04,990
when at some point in the future we get the response we were hoping for.

135
00:09:05,010 --> 00:09:07,060
Now the same thing is true down below.

136
00:09:07,080 --> 00:09:12,810
So the next thing we do is we actually start the process of fetching the second user exactly like we

137
00:09:12,810 --> 00:09:13,920
did up above.

138
00:09:14,310 --> 00:09:20,100
So at this point node is actually waiting for too long running Io operations to complete and they're

139
00:09:20,100 --> 00:09:25,740
both happening in the background it's not taking up our applications time preventing it from doing other

140
00:09:25,740 --> 00:09:26,170
things.

141
00:09:26,190 --> 00:09:31,950
So we can prove that by talking about the next step the next thing that happens is we actually calculate

142
00:09:31,980 --> 00:09:35,110
and print out some these two lines down below.

143
00:09:35,130 --> 00:09:41,610
They do not care about the user response for either User 1 or user 2 they should be able to operate

144
00:09:41,610 --> 00:09:44,850
completely independently and that's what we're seeing right here.

145
00:09:44,850 --> 00:09:50,910
There's no need to wait for those two responses before calculating and printing the sum.

146
00:09:50,970 --> 00:09:52,260
Now what happens.

147
00:09:52,260 --> 00:09:57,570
Well I mentioned that regardless of which example we're working with the IO operation doesn't get shorter

148
00:09:57,570 --> 00:10:04,010
it still takes those two second so right here I have a box of the exact same width as our two boxes

149
00:10:04,070 --> 00:10:10,640
over here and it's a dashed box and it represents the time our node app has to wait for a response to

150
00:10:10,640 --> 00:10:11,630
come back.

151
00:10:11,630 --> 00:10:13,720
Now the nice thing is that while it's waiting.

152
00:10:13,760 --> 00:10:15,700
It can still do other things.

153
00:10:15,770 --> 00:10:21,110
So while it was waiting for a user one it was able to start up a another request and it was able to

154
00:10:21,110 --> 00:10:23,120
calculate and print the sum.

155
00:10:23,240 --> 00:10:26,770
Now after those two seconds we still get the user data back.

156
00:10:26,780 --> 00:10:32,870
This is when node j s calls our callback function and we are able to print the user and that's what

157
00:10:32,870 --> 00:10:34,760
I see right here.

158
00:10:34,760 --> 00:10:37,400
Next up we wait for that second request.

159
00:10:37,400 --> 00:10:42,320
This starts just a little bit later than the first and it finishes a little bit later and once we get

160
00:10:42,320 --> 00:10:46,830
that data back we are able to print the second user to the console.

161
00:10:46,850 --> 00:10:52,250
If we look at the total operating time I can see that the non blocking example was able to finish in

162
00:10:52,250 --> 00:10:57,950
just over two seconds while the blocking example was able to finish in just over four seconds.

163
00:10:58,010 --> 00:11:03,450
A difference of 50 percent making the non blocking example twice as fast.

164
00:11:03,560 --> 00:11:09,140
Now obviously that's because we were able to overlap the part of our application that took the longest

165
00:11:09,350 --> 00:11:16,160
which was waiting for the I O to finish down below we were able to wait for both at the same time and

166
00:11:16,160 --> 00:11:17,390
well we were waiting.

167
00:11:17,390 --> 00:11:22,520
Our app could even perform other things like firing off another request or calculating and printing

168
00:11:22,520 --> 00:11:27,020
the sum that just is not possible using a blocking model.

169
00:11:27,020 --> 00:11:32,060
So in this course we're gonna be working with non blocking code throughout the class and that's what

170
00:11:32,060 --> 00:11:38,300
makes node so ideal for things like server side development where we're making web servers and application

171
00:11:38,300 --> 00:11:45,080
back ends it's going to allow your node app to process multiple requests at the exact same time for

172
00:11:45,080 --> 00:11:46,130
different users.

173
00:11:46,250 --> 00:11:52,520
So you could be fetching some data for a user 1 while processing a new request from user 2.

174
00:11:52,520 --> 00:11:58,450
Now let's go ahead and run some node code to actually see these two examples in action right here.

175
00:11:58,490 --> 00:12:04,780
I'm gonna put on a quick demonstration actually running the two files we just had over in that visualization.

176
00:12:04,850 --> 00:12:10,010
On the left I have my blocking example character for character what I had in the other file and the

177
00:12:10,010 --> 00:12:13,690
same thing is true on the right with the non blocking example.

178
00:12:13,700 --> 00:12:18,010
Once again you don't have to worry about opening this project up or writing this code.

179
00:12:18,020 --> 00:12:20,680
This is just for demonstration purposes.

180
00:12:20,720 --> 00:12:24,600
We'll start diving into coding together in the next video for now.

181
00:12:24,620 --> 00:12:29,900
What we're gonna do is run these two scripts to see how they execute which is gonna be exactly how we

182
00:12:29,900 --> 00:12:33,290
describe them in the visualization on the left hand side.

183
00:12:33,290 --> 00:12:37,220
I'm going to use one terminal for the blocking example on the right hand side.

184
00:12:37,220 --> 00:12:43,000
I have a second tiny terminal for the non blocking example now to actually run a file.

185
00:12:43,010 --> 00:12:46,990
We still use that node command followed by a space and the file name.

186
00:12:47,030 --> 00:12:55,330
So here node space blocking dot J S is the file I'm trying to run now to make things easier to see.

187
00:12:55,370 --> 00:13:02,060
I've delayed the IO operations to take five seconds so it's a bit easier to talk about things as they're

188
00:13:02,060 --> 00:13:02,870
happening.

189
00:13:02,870 --> 00:13:05,510
Let's go ahead and kick off the blocking example.

190
00:13:05,510 --> 00:13:06,530
So what happens.

191
00:13:06,530 --> 00:13:07,190
Nothing.

192
00:13:07,190 --> 00:13:12,080
We are sitting here and we're waiting and we are waiting for a full five seconds before that first user

193
00:13:12,080 --> 00:13:12,890
comes back.

194
00:13:12,890 --> 00:13:13,670
There it is.

195
00:13:13,670 --> 00:13:15,890
We have their I.D. and their name.

196
00:13:15,890 --> 00:13:19,710
Then we wait a another 5 seconds to get the second user.

197
00:13:19,760 --> 00:13:24,930
Finally these some prints exactly as we saw over in the visualization.

198
00:13:25,010 --> 00:13:28,310
So five seconds for just five more seconds for Mark.

199
00:13:28,400 --> 00:13:33,160
Then basically instantly after Mark printed we got 30 for printing.

200
00:13:33,440 --> 00:13:39,050
So this is the blocking example for a total runtime of just over 10 seconds.

201
00:13:39,050 --> 00:13:46,000
Now let's try the non blocking example in this case getting the user still takes a full five seconds.

202
00:13:46,010 --> 00:13:51,600
So right here node space the file non blocking dot J.

203
00:13:51,610 --> 00:13:53,900
S I'm gonna go ahead and run it.

204
00:13:53,900 --> 00:13:57,180
And once again we get the number printing right away.

205
00:13:57,200 --> 00:14:04,370
It started up the two Io operations it printed the number then five seconds later both basically printed

206
00:14:04,370 --> 00:14:06,460
at the exact same time.

207
00:14:06,470 --> 00:14:11,890
That's because we were able to overlap the process of our node app waiting.

208
00:14:11,900 --> 00:14:17,990
So the total runtime here for our non blocking example was just over five seconds.

209
00:14:17,990 --> 00:14:22,940
Once again running twice as fast as the blocking example over here.

210
00:14:22,940 --> 00:14:27,230
So that is it for our little illustration of blocking verse non blocking.

211
00:14:27,230 --> 00:14:31,880
We're gonna talk a lot more about this a bit later in the class when we start to get into some more

212
00:14:31,880 --> 00:14:35,080
advanced know J.S. application code.

213
00:14:35,120 --> 00:14:40,250
For now though we have done a pretty decent job at exploring this second sentence.

214
00:14:40,310 --> 00:14:46,820
No J.S. uses an event driven non blocking I O model that makes it lightweight and efficient.

215
00:14:46,820 --> 00:14:49,440
So we now know what non blocking I O is.

216
00:14:49,450 --> 00:14:55,160
And we've seen that it definitely creates a more lightweight and efficient application and event driven

217
00:14:55,160 --> 00:15:01,510
is just that process of registering those callbacks and having them call when the IO operation is done

218
00:15:01,720 --> 00:15:06,040
and it's something we will talk about in detail later on in the class.

219
00:15:06,100 --> 00:15:13,900
The last sentence we have here no J S's package ecosystem NPM is the largest ecosystem of open source

220
00:15:13,900 --> 00:15:15,770
libraries in the world.

221
00:15:15,910 --> 00:15:22,630
Now NPM is a tool that was actually installed on your machine when a node was installed and you can

222
00:15:22,630 --> 00:15:27,170
find the Web site at NPM J S dot com.

223
00:15:27,190 --> 00:15:31,210
Here a Web site we'll be spending plenty of time in in the class.

224
00:15:31,210 --> 00:15:37,480
You can search for all sorts of pre written packages that you can use inside of your application.

225
00:15:37,540 --> 00:15:40,520
So if you want to validate emails there's a package for that.

226
00:15:40,630 --> 00:15:46,570
If you want to send emails off or communicate with a database or create a web server or pretty much

227
00:15:46,570 --> 00:15:49,060
do anything else you can do with node.

228
00:15:49,060 --> 00:15:53,140
There are libraries and packages that make your life much easier.

229
00:15:53,140 --> 00:15:58,930
We're gonna make heavy use of NPM packages throughout this class which is exactly what real developers

230
00:15:58,930 --> 00:16:02,320
do when they're building out node applications.

231
00:16:02,320 --> 00:16:08,350
This is something we'll start to explore in the very next section so we know a little bit about what

232
00:16:08,350 --> 00:16:12,340
node is and why it's a tool worth learning in the next video.

233
00:16:12,340 --> 00:16:18,070
We're going to wrap up this little introductory section by actually creating and running a script on

234
00:16:18,070 --> 00:16:18,760
our own.

235
00:16:18,760 --> 00:16:20,660
I'm very excited to get to that.

236
00:16:20,710 --> 00:16:23,830
So let's go ahead and jump right in to the next video.