1
00:00:00,480 --> 00:00:06,460
In such an important topic like promised, I have prepared some of my own resources as well.

2
00:00:06,930 --> 00:00:11,730
We'll start with the slides and move on to the closed examples in the next video.

3
00:00:12,120 --> 00:00:18,000
As I note, I met all the slides available on course API dot com.

4
00:00:18,330 --> 00:00:21,900
Again, their website name is called Dash API dot com.

5
00:00:22,240 --> 00:00:26,820
And once you click on the slides link, you'll see all the slides.

6
00:00:27,450 --> 00:00:34,140
And I would want to start our discussion by taking a look at what it means that a JavaScript is synchronous

7
00:00:34,380 --> 00:00:42,300
and single and effectively is just a fancy way of saying that JavaScript reads everything on line by

8
00:00:42,300 --> 00:00:42,630
line.

9
00:00:43,110 --> 00:00:49,380
So, for example, if I have counsel along with the first task, then I have a folder that takes some

10
00:00:49,380 --> 00:00:49,680
time.

11
00:00:49,950 --> 00:00:51,150
In this case, two seconds.

12
00:00:51,150 --> 00:00:52,370
But that could be 10 seconds.

13
00:00:52,380 --> 00:00:53,940
That could be 20 or whatever.

14
00:00:54,300 --> 00:00:56,690
And then I have another console log off.

15
00:00:56,700 --> 00:01:03,450
Next task, JavaScript will just start reading everything and it will read it line by line.

16
00:01:03,990 --> 00:01:12,810
And if this takes a long time, it will only run the next task once it's done performing the this time

17
00:01:12,810 --> 00:01:13,530
consuming one.

18
00:01:13,980 --> 00:01:15,270
So hopefully that is clear.

19
00:01:15,930 --> 00:01:19,200
JavaScript just reads everything line by line.

20
00:01:20,210 --> 00:01:22,380
Now let's take a look at our second slide.

21
00:01:22,710 --> 00:01:30,480
And in here we can see the solution if we would want to offload something to the browser.

22
00:01:30,780 --> 00:01:37,870
So when we're building browser JavaScript apps, we have this option of offloading through the browser.

23
00:01:37,920 --> 00:01:40,950
Now, of course, it doesn't mean that we can afford the photo.

24
00:01:41,370 --> 00:01:42,570
That's not going to work.

25
00:01:42,810 --> 00:01:45,480
This effectively is still going to be the blocking code.

26
00:01:45,840 --> 00:01:49,140
But Browser nicely provides the API.

27
00:01:50,150 --> 00:01:58,430
Where we can offload those tasks to the browser and only when the task is done, then we execute the

28
00:01:58,430 --> 00:02:04,940
callback and probably the example we have done the most is the fetch, essentially when we make the

29
00:02:05,090 --> 00:02:05,990
network request.

30
00:02:06,230 --> 00:02:09,810
But we can also do that, for example, with a set amount.

31
00:02:10,190 --> 00:02:18,800
So I still have a lot with first task, but then even though my set time function as the second argument

32
00:02:18,800 --> 00:02:19,500
of zero.

33
00:02:19,790 --> 00:02:21,950
So essentially I have set Timrod function.

34
00:02:22,370 --> 00:02:28,430
I provide the callback function that's going to be executed in a certain amount of time, even if this

35
00:02:28,430 --> 00:02:32,740
is zero, meaning you would expect this one to run right away.

36
00:02:33,020 --> 00:02:37,080
It only runs after the next task.

37
00:02:37,400 --> 00:02:45,470
So once JavaScript is done executing the immediate code, only then it executes the callback.

38
00:02:45,920 --> 00:02:50,930
So in this case, we have the time of the API that is provided from the browser.

39
00:02:51,170 --> 00:02:55,250
And we just said that we would want to execute that in zero seconds.

40
00:02:55,490 --> 00:02:57,590
So effectively there is no wait time.

41
00:02:57,590 --> 00:03:04,240
However, JavaScript will first execute this code and only then will execute the callback.

42
00:03:04,430 --> 00:03:11,190
So that way we can offload those time consuming operations to the browser.

43
00:03:11,220 --> 00:03:14,060
Again, it doesn't mean that we can offload for loops.

44
00:03:14,240 --> 00:03:20,570
It means that browser does provide some APIs where we don't have to write the blocking code.

45
00:03:20,840 --> 00:03:27,680
Now, let me be very clear, though, when I say we cannot offload loops, what I mean is that we can

46
00:03:27,680 --> 00:03:31,430
still write blocking code in JavaScript.

47
00:03:31,940 --> 00:03:40,070
But the browser does provide some nice APIs where we can offload those time consuming tasks.

48
00:03:40,700 --> 00:03:46,660
And that brings us to our main friend, the node event.

49
00:03:46,670 --> 00:03:50,540
Look, again, before I go Resample, let me stress something.

50
00:03:51,050 --> 00:03:56,820
That loop is somewhat complex, and this is just to give you a general understanding.

51
00:03:57,500 --> 00:03:59,150
So let's imagine the scenario.

52
00:03:59,270 --> 00:04:02,330
I have an app just like any app.

53
00:04:02,720 --> 00:04:06,950
I have subscribers or users or however you would want to call them.

54
00:04:07,310 --> 00:04:11,950
And this guy, since my app is so, so popular, I have eight of them.

55
00:04:12,590 --> 00:04:15,230
And what do the users do?

56
00:04:15,620 --> 00:04:20,480
Well, they're probably being annoying and they're requesting something from the application.

57
00:04:20,490 --> 00:04:30,210
And as the requests are coming in, the event loop is responsible for avoiding this type of scenario.

58
00:04:30,770 --> 00:04:32,270
So let's imagine this.

59
00:04:32,450 --> 00:04:33,800
I have all these users.

60
00:04:33,800 --> 00:04:34,940
The requests are coming in.

61
00:04:35,360 --> 00:04:37,100
But Larry, the little.

62
00:04:38,040 --> 00:04:45,210
Besides that, in his request, there's going to be some kind of time consuming, I don't know, database

63
00:04:45,210 --> 00:04:48,680
crawl or something like that, so effectively he's requesting something.

64
00:04:48,990 --> 00:04:54,870
And behind the scenes in my code, that means that I need to perform something that takes a long time.

65
00:04:55,680 --> 00:05:01,320
So in this case, the event loop just registers the callback.

66
00:05:02,160 --> 00:05:06,410
So it registers what needs to be done when the task is complete.

67
00:05:06,420 --> 00:05:12,570
Because if the event loop wouldn't do that, then we would have the scenario where the requests are

68
00:05:12,570 --> 00:05:13,080
coming in.

69
00:05:13,560 --> 00:05:21,410
And because Larry is requesting something that takes a long time, rest of the users would have to wait.

70
00:05:21,690 --> 00:05:25,620
And essentially, it's not that the actual operation takes a long time.

71
00:05:25,980 --> 00:05:33,930
It's just the fact that we're wasting our time on waiting for that operation to be done and only then

72
00:05:33,930 --> 00:05:36,260
we can serve the other users.

73
00:05:36,660 --> 00:05:40,410
But what the event loop does, it registers the callback.

74
00:05:40,650 --> 00:05:45,210
And only when the operation is complete, it executes it.

75
00:05:45,660 --> 00:05:51,960
Now, keep in mind that, again, we're not executing this right away when we can effectively.

76
00:05:51,960 --> 00:06:00,450
It's the same scenario where we run our immediate code first and only then when we have the time, we

77
00:06:00,450 --> 00:06:01,530
execute the callback.

78
00:06:01,560 --> 00:06:08,610
So, for example, in this scenario, if I would have hundred of logs after the next task, I would

79
00:06:08,610 --> 00:06:10,950
run them first and only then.

80
00:06:10,950 --> 00:06:18,240
The second task would appear here, regardless of what is the time set in here, because again, we're

81
00:06:18,240 --> 00:06:22,020
running our immediate task first and only then we're here on the callbacks.

82
00:06:22,200 --> 00:06:26,220
So the same thing happens here where our requests are coming in.

83
00:06:26,470 --> 00:06:29,130
Let's say that the operation is complete.

84
00:06:29,310 --> 00:06:35,400
We first registered, the callback operation is complete, and instead of executing that callback right

85
00:06:35,400 --> 00:06:39,680
away, it effectively gets put at the end of the line.

86
00:06:40,080 --> 00:06:46,020
And then when there is no immediate Cothran, then we execute the callback.

87
00:06:46,380 --> 00:06:47,500
Hopefully that is clear.

88
00:06:48,120 --> 00:06:55,560
Event Loop is our best friend because with the help of a loop, we can offload some time consuming operations

89
00:06:55,950 --> 00:06:58,890
and effectively just keep all our users happy.