WEBVTT

1
00:00:10.900 --> 00:00:14.660
<00:00:10.900>Okay <00:00:11.027>then. <00:00:11.154>Hello, <00:00:11.281>everyone. <00:00:11.409>I'm <00:00:11.536>genuinely <00:00:11.663>glad <00:00:11.790>to <00:00:11.918>see <00:00:12.045>you <00:00:12.172>all <00:00:12.300>here

2
00:00:14.700 --> 00:00:17.560
<00:00:14.700>today, <00:00:14.855>and <00:00:15.011>thank <00:00:15.166>you <00:00:15.322>very <00:00:15.477>much <00:00:15.633>to <00:00:15.788>attending <00:00:15.944>my <00:00:16.099>talk.

3
00:00:18.020 --> 00:00:21.860
<00:00:18.020>I'm <00:00:18.113>going <00:00:18.206>to <00:00:18.300>tell <00:00:18.393>you <00:00:18.486>today <00:00:18.580>the <00:00:18.673>story <00:00:18.766>of <00:00:18.860>the <00:00:18.953>Lord <00:00:19.046>of <00:00:19.140>the <00:00:19.233>Memory <00:00:19.326>and <00:00:19.419>the

4
00:00:21.880 --> 00:00:24.900
<00:00:21.880>Return <00:00:22.080>of <00:00:22.279>the <00:00:22.480>Leak. <00:00:22.680>And <00:00:22.880>let's <00:00:23.080>get <00:00:23.279>acquainted.

5
00:00:24.980 --> 00:00:27.340
<00:00:24.980>My <00:00:25.135>name <00:00:25.291>is <00:00:25.446>Alex, <00:00:25.602>and <00:00:25.757>I <00:00:25.913>am <00:00:26.068>a <00:00:26.224>software <00:00:26.380>engineer.

6
00:00:27.660 --> 00:00:31.500
<00:00:27.660>I <00:00:27.787>fell <00:00:27.914>in <00:00:28.041>love <00:00:28.169>with <00:00:28.296>programming <00:00:28.423>in <00:00:28.550>2019 <00:00:28.678>and <00:00:28.805>writing <00:00:28.932>code <00:00:29.060>ever

7
00:00:31.540 --> 00:00:35.340
<00:00:31.540>since. <00:00:31.740>Currently, <00:00:31.939>I <00:00:32.140>am <00:00:32.339>making <00:00:32.540>scheduling <00:00:32.740>on <00:00:32.940>steel

8
00:00:35.540 --> 00:00:38.239
<00:00:35.540>plants <00:00:35.740>great <00:00:35.940>again, <00:00:36.140>working <00:00:36.339>in <00:00:36.540>smart <00:00:36.740>steel <00:00:36.940>technologies.

9
00:00:38.840 --> 00:00:41.120
<00:00:38.840>I <00:00:39.073>do <00:00:39.306>my <00:00:39.540>front-end <00:00:39.773>magic <00:00:40.006>with <00:00:40.240>JavaScript/TypeScript.

10
00:00:41.180 --> 00:00:45.100
<00:00:41.180>My <00:00:41.413>favorite <00:00:41.646>framework <00:00:41.880>is <00:00:42.113>Vue.js, <00:00:42.346>and <00:00:42.580>in

11
00:00:45.160 --> 00:00:47.900
<00:00:45.160>the <00:00:45.360>meanwhile, <00:00:45.559>I'm <00:00:45.760>exploring <00:00:45.959>C++ <00:00:46.160>and <00:00:46.360>Python <00:00:46.559>worlds.

12
00:00:48.920 --> 00:00:52.040
<00:00:48.920>So <00:00:49.013>what <00:00:49.106>I'm <00:00:49.200>going <00:00:49.293>to <00:00:49.386>tell <00:00:49.480>you <00:00:49.573>about, <00:00:49.666>of <00:00:49.760>course, <00:00:49.853>the <00:00:49.946>one <00:00:50.040>to <00:00:50.133>rule <00:00:50.226>them <00:00:50.320>all.

13
00:00:52.220 --> 00:00:56.160
<00:00:52.220>We <00:00:52.320>will <00:00:52.420>talk <00:00:52.519>about <00:00:52.620>the <00:00:52.720>main <00:00:52.820>memory, <00:00:52.920>how <00:00:53.019>it <00:00:53.120>operates, <00:00:53.220>bits <00:00:53.320>and <00:00:53.420>bytes, <00:00:53.519>and <00:00:53.620>how

14
00:00:56.220 --> 00:00:59.160
<00:00:56.220>it's <00:00:56.394>all <00:00:56.570>connected <00:00:56.745>to <00:00:56.920>the <00:00:57.095>JavaScript <00:00:57.269>and <00:00:57.445>our <00:00:57.620>browser.

15
00:00:59.600 --> 00:01:03.540
<00:00:59.600>Of <00:00:59.693>course, <00:00:59.786>we <00:00:59.880>will <00:00:59.973>see <00:01:00.066>on <00:01:00.160>the <00:01:00.253>bestiary <00:01:00.346>of <00:01:00.440>the <00:01:00.533>memory <00:01:00.626>leaks, <00:01:00.720>how <00:01:00.813>to <00:01:00.906>detect <00:01:01.000>them,

16
00:01:03.620 --> 00:01:07.160
<00:01:03.620>what <00:01:03.775>they <00:01:03.931>are, <00:01:04.086>and <00:01:04.242>maybe <00:01:04.397>how <00:01:04.553>not <00:01:04.708>to <00:01:04.864>make <00:01:05.019>them.

17
00:01:07.780 --> 00:01:09.340
<00:01:07.780>Then, <00:01:08.060>of <00:01:08.340>course, <00:01:08.620>is <00:01:08.900>Elven <00:01:09.180>weaponry.

18
00:01:09.520 --> 00:01:13.380
<00:01:09.520>We <00:01:09.647>will <00:01:09.774>see <00:01:09.901>our <00:01:10.029>favorite <00:01:10.156>dev <00:01:10.283>tools <00:01:10.410>in <00:01:10.538>work, <00:01:10.665>at <00:01:10.792>least <00:01:10.920>on

19
00:01:13.440 --> 00:01:17.140
<00:01:13.440>my <00:01:13.539>experience, <00:01:13.640>how <00:01:13.740>I <00:01:13.840>detect <00:01:13.940>them. <00:01:14.039>And <00:01:14.140>of <00:01:14.240>course, <00:01:14.340>I <00:01:14.440>will <00:01:14.539>tell <00:01:14.640>you <00:01:14.740>about <00:01:14.840>the

20
00:01:17.340 --> 00:01:21.320
<00:01:17.340>War <00:01:17.440>of <00:01:17.540>the <00:01:17.640>Last <00:01:17.740>Elves <00:01:17.840>or <00:01:17.940>how <00:01:18.040>we <00:01:18.140>defeated <00:01:18.240>a <00:01:18.340>memory <00:01:18.440>leak <00:01:18.540>in <00:01:18.640>our <00:01:18.740>system.

21
00:01:22.660 --> 00:01:26.310
<00:01:22.660>So <00:01:22.835>Sauron <00:01:23.009>created <00:01:23.185>the <00:01:23.360>one <00:01:23.535>memory <00:01:23.710>to <00:01:23.884>rule <00:01:24.060>them

22
00:01:26.400 --> 00:01:30.100
<00:01:26.400>all <00:01:26.555>and <00:01:26.711>started <00:01:26.866>the <00:01:27.022>war <00:01:27.177>to <00:01:27.333>conquer <00:01:27.488>the <00:01:27.644>whole <00:01:27.800>machine.

23
00:01:30.120 --> 00:01:33.840
<00:01:30.120>Programmers <00:01:30.295>and <00:01:30.470>garbage <00:01:30.645>collectors <00:01:30.820>gathered <00:01:30.995>in <00:01:31.170>The <00:01:31.345>Last <00:01:31.520>Elves

24
00:01:33.900 --> 00:01:37.620
<00:01:33.900>to <00:01:34.055>fight <00:01:34.211>back <00:01:34.366>Sauron. <00:01:34.522>Team <00:01:34.677>Lead <00:01:34.833>saw <00:01:34.988>in <00:01:35.144>the <00:01:35.300>Palantir

25
00:01:38.100 --> 00:01:41.620
<00:01:38.100>the <00:01:38.240>glimpse <00:01:38.380>of <00:01:38.520>the <00:01:38.660>enemy's <00:01:38.800>plan, <00:01:38.940>that <00:01:39.080>Sauron <00:01:39.220>is <00:01:39.360>gonna <00:01:39.500>strike

26
00:01:42.000 --> 00:01:45.340
<00:01:42.000>his <00:01:42.200>main <00:01:42.400>sources <00:01:42.600>on <00:01:42.800>the <00:01:43.000>scheduling <00:01:43.200>app <00:01:43.400>and

27
00:01:45.420 --> 00:01:46.920
<00:01:45.420>concentrated <00:01:45.870>his <00:01:46.320>leak <00:01:46.770>there.

28
00:01:48.000 --> 00:01:51.780
<00:01:48.000>And <00:01:48.107>of <00:01:48.215>course, <00:01:48.323>in <00:01:48.430>reality, <00:01:48.538>when <00:01:48.646>I <00:01:48.753>joined <00:01:48.861>the <00:01:48.969>company <00:01:49.076>and <00:01:49.184>got <00:01:49.292>this <00:01:49.400>task,

29
00:01:51.860 --> 00:01:54.440
<00:01:51.860>the <00:01:52.093>client's <00:01:52.326>application <00:01:52.560>looked <00:01:52.793>something <00:01:53.026>like <00:01:53.260>this.

30
00:01:56.140 --> 00:01:56.500
<00:01:56.140>And <00:01:56.464>yeah,

31
00:01:57.560 --> 00:02:00.420
<00:01:57.560>the <00:01:57.760>application <00:01:57.960>itself <00:01:58.160>pretty <00:01:58.360>simple, <00:01:58.560>I <00:01:58.760>would <00:01:58.960>say.

32
00:02:00.900 --> 00:02:03.380
<00:02:00.900>It's <00:02:01.100>just <00:02:01.300>the <00:02:01.500>number <00:02:01.700>of <00:02:01.900>tables <00:02:02.100>that <00:02:02.300>should...

33
00:02:03.660 --> 00:02:07.100
<00:02:03.660>The <00:02:03.776>ability <00:02:03.893>to <00:02:04.009>add <00:02:04.126>the <00:02:04.243>rows, <00:02:04.360>to <00:02:04.476>move <00:02:04.593>the <00:02:04.710>rows, <00:02:04.826>and <00:02:04.943>so <00:02:05.060>on.

34
00:02:07.720 --> 00:02:11.640
<00:02:07.720>While <00:02:07.860>the <00:02:08.000>UI <00:02:08.139>and <00:02:08.280>UX <00:02:08.419>is <00:02:08.560>not <00:02:08.699>that <00:02:08.840>complicated, <00:02:08.979>but <00:02:09.120>the

35
00:02:11.900 --> 00:02:15.380
<00:02:11.900>source <00:02:12.027>code <00:02:12.154>is <00:02:12.281>pretty <00:02:12.409>large, <00:02:12.536>I <00:02:12.663>would <00:02:12.790>say, <00:02:12.918>in <00:02:13.045>combination <00:02:13.172>with <00:02:13.300>the

36
00:02:15.500 --> 00:02:19.280
<00:02:15.500>third-party <00:02:15.640>libraries. <00:02:15.780>So <00:02:15.920>you <00:02:16.060>have, <00:02:16.200>I <00:02:16.340>would <00:02:16.480>say, <00:02:16.620>plenty <00:02:16.760>of <00:02:16.900>space

37
00:02:19.320 --> 00:02:20.440
<00:02:19.320>to <00:02:19.521>watch <00:02:19.723>for <00:02:19.924>a <00:02:20.126>memory <00:02:20.328>leak.

38
00:02:21.320 --> 00:02:25.240
<00:02:21.320>And <00:02:21.427>as <00:02:21.535>the <00:02:21.643>Middle-earth <00:02:21.750>hero, <00:02:21.858>I <00:02:21.966>was <00:02:22.073>honored <00:02:22.181>with <00:02:22.289>the <00:02:22.396>mission <00:02:22.504>to <00:02:22.612>fix <00:02:22.720>the

39
00:02:25.280 --> 00:02:25.840
<00:02:25.280>memory <00:02:25.784>leak.

40
00:02:27.640 --> 00:02:31.310
<00:02:27.640>And <00:02:27.756>of <00:02:27.873>course, <00:02:27.989>before <00:02:28.106>I <00:02:28.223>start <00:02:28.339>to <00:02:28.456>dive <00:02:28.573>into <00:02:28.690>theory, <00:02:28.806>I <00:02:28.923>would <00:02:29.040>make

41
00:02:31.800 --> 00:02:35.320
<00:02:31.800>assumption <00:02:31.940>that <00:02:32.080>I <00:02:32.220>will <00:02:32.360>watch <00:02:32.500>from <00:02:32.640>perspective <00:02:32.780>of <00:02:32.920>a <00:02:33.060>Spider <00:02:33.200>Monkey.

42
00:02:35.720 --> 00:02:39.580
<00:02:35.720>There <00:02:35.875>are <00:02:36.031>several <00:02:36.186>other <00:02:36.342>engines, <00:02:36.497>like <00:02:36.653>V8 <00:02:36.808>from <00:02:36.964>Google, <00:02:37.120>and

43
00:02:39.640 --> 00:02:43.620
<00:02:39.640>they <00:02:39.815>all <00:02:39.989>implement <00:02:40.165>ECMAScript <00:02:40.339>standard, <00:02:40.515>but <00:02:40.690>doing <00:02:40.864>some <00:02:41.040>other

44
00:02:43.660 --> 00:02:46.800
<00:02:43.660>ways <00:02:43.859>of-- <00:02:44.060>in <00:02:44.260>terms <00:02:44.460>of <00:02:44.660>implementation, <00:02:44.859>of <00:02:45.060>course.

45
00:02:46.860 --> 00:02:50.640
<00:02:46.860>So <00:02:47.000>starting <00:02:47.140>the <00:02:47.280>path <00:02:47.420>of <00:02:47.560>the <00:02:47.700>Middle-earth <00:02:47.840>hero, <00:02:47.980>I <00:02:48.120>wanted <00:02:48.260>to

46
00:02:50.680 --> 00:02:54.420
<00:02:50.680>equip <00:02:50.835>myself <00:02:50.991>with <00:02:51.146>the <00:02:51.302>sacred <00:02:51.457>knowledge <00:02:51.613>of <00:02:51.768>how <00:02:51.924>the <00:02:52.080>One

47
00:02:54.480 --> 00:02:57.299
<00:02:54.480>works, <00:02:54.679>and <00:02:54.880>joined <00:02:55.079>Gandalf <00:02:55.280>in <00:02:55.480>the <00:02:55.679>Gondor's <00:02:55.880>library.

48
00:02:58.120 --> 00:03:01.910
<00:02:58.120>And <00:02:58.227>of <00:02:58.335>course, <00:02:58.443>I <00:02:58.550>read <00:02:58.658>the <00:02:58.766>sacred <00:02:58.873>knowledge <00:02:58.981>with <00:02:59.089>the <00:02:59.196>Tanenbaum's <00:02:59.304>"Book <00:02:59.412>of <00:02:59.520>Computer

49
00:03:02.520 --> 00:03:03.250
Organization."

50
00:03:05.100 --> 00:03:08.600
<00:03:05.100>Or <00:03:05.275>if <00:03:05.450>somebody <00:03:05.625>have <00:03:05.799>missed <00:03:05.975>the <00:03:06.150>computer <00:03:06.325>architecture <00:03:06.500>course,

51
00:03:09.300 --> 00:03:13.020
<00:03:09.300>it's <00:03:09.475>the <00:03:09.650>memory <00:03:09.825>hierarchy. <00:03:10.000>So <00:03:10.175>everything <00:03:10.350>starts <00:03:10.525>with <00:03:10.700>CPU

52
00:03:13.060 --> 00:03:16.860
<00:03:13.060>registers. <00:03:13.235>The <00:03:13.410>CPU <00:03:13.585>registers <00:03:13.760>contain <00:03:13.935>cells <00:03:14.110>where <00:03:14.285>we <00:03:14.460>store

53
00:03:16.920 --> 00:03:19.820
<00:03:16.920>the <00:03:17.200>first <00:03:17.480>initial <00:03:17.760>data. <00:03:18.040>It <00:03:18.320>usually

54
00:03:20.720 --> 00:03:23.640
<00:03:20.720>operates <00:03:20.953>with <00:03:21.186>bits. <00:03:21.420>Bits <00:03:21.653>collects <00:03:21.886>into <00:03:22.120>bytes.

55
00:03:24.160 --> 00:03:27.970
<00:03:24.160>It's <00:03:24.299>usually <00:03:24.440>eight <00:03:24.579>bytes <00:03:24.720>each, <00:03:24.859>and <00:03:25.000>so <00:03:25.140>everything <00:03:25.280>collected <00:03:25.420>into <00:03:25.560>words,

56
00:03:28.160 --> 00:03:29.980
<00:03:28.160>and <00:03:28.440>words, <00:03:28.720>we <00:03:29.000>are <00:03:29.280>talking <00:03:29.560>about

57
00:03:30.200 --> 00:03:33.920
<00:03:30.200>64-bit <00:03:30.666>machine. <00:03:31.133>Then <00:03:31.600>goes

58
00:03:34.060 --> 00:03:38.010
<00:03:34.060>cache, <00:03:34.160>and <00:03:34.260>of <00:03:34.360>course, <00:03:34.460>the <00:03:34.560>idea <00:03:34.660>behind <00:03:34.760>is <00:03:34.860>very <00:03:34.960>simple, <00:03:35.060>just <00:03:35.160>to <00:03:35.260>collect <00:03:35.360>the <00:03:35.460>most

59
00:03:38.140 --> 00:03:42.030
<00:03:38.140>heavily <00:03:38.279>used <00:03:38.420>words. <00:03:38.559>So <00:03:38.700>when <00:03:38.839>CPU <00:03:38.980>op <00:03:39.119>starts <00:03:39.260>to <00:03:39.399>operate, <00:03:39.540>it

60
00:03:42.060 --> 00:03:45.800
<00:03:42.060>first <00:03:42.153>goes <00:03:42.246>to <00:03:42.340>cache, <00:03:42.433>and <00:03:42.526>if <00:03:42.620>nothing <00:03:42.713>is <00:03:42.806>found, <00:03:42.900>only <00:03:42.993>then <00:03:43.086>it <00:03:43.180>goes <00:03:43.273>to <00:03:43.366>the <00:03:43.460>main

61
00:03:45.860 --> 00:03:49.280
<00:03:45.860>memory. <00:03:46.035>The <00:03:46.210>main <00:03:46.385>memory, <00:03:46.560>I <00:03:46.735>think <00:03:46.910>it <00:03:47.085>needs <00:03:47.260>the

62
00:03:49.300 --> 00:03:52.940
<00:03:49.300>presentation. <00:03:49.500>It's <00:03:49.700>our <00:03:49.900>random-access <00:03:50.100>memory <00:03:50.300>where <00:03:50.500>the <00:03:50.700>CPU

63
00:03:53.000 --> 00:03:55.080
<00:03:53.000>basically <00:03:53.280>stores <00:03:53.560>all <00:03:53.840>the <00:03:54.120>operational <00:03:54.400>data.

64
00:03:55.580 --> 00:03:59.500
<00:03:55.579>And <00:03:55.707>this <00:03:55.834>is <00:03:55.961>the <00:03:56.089>most <00:03:56.216>interesting <00:03:56.343>point <00:03:56.470>for <00:03:56.598>us <00:03:56.725>as <00:03:56.852>everything <00:03:56.980>happening

65
00:03:59.600 --> 00:04:03.090
<00:03:59.600>there. <00:03:59.739>And <00:03:59.880>of <00:04:00.019>course, <00:04:00.160>the <00:04:00.299>place <00:04:00.440>where <00:04:00.579>the <00:04:00.720>memory <00:04:00.859>is <00:04:01.000>allocated,

66
00:04:03.420 --> 00:04:05.560
<00:04:03.420>freed, <00:04:03.769>and <00:04:04.119>unfortunately, <00:04:04.470>sometimes <00:04:04.820>forgotten.

67
00:04:06.500 --> 00:04:10.400
<00:04:06.500>Then <00:04:06.607>goes <00:04:06.715>again <00:04:06.823>the <00:04:06.930>solid-state <00:04:07.038>disk, <00:04:07.146>but <00:04:07.253>we <00:04:07.361>are <00:04:07.469>not <00:04:07.576>that <00:04:07.684>interested <00:04:07.792>in <00:04:07.900>those

68
00:04:10.460 --> 00:04:11.240
<00:04:10.460>lands <00:04:10.811>far <00:04:11.162>beyond.

69
00:04:12.540 --> 00:04:16.200
<00:04:12.540>So <00:04:12.715>now, <00:04:12.890>as <00:04:13.065>understood <00:04:13.239>all <00:04:13.415>the <00:04:13.590>structure <00:04:13.765>of <00:04:13.940>the

70
00:04:16.959 --> 00:04:17.260
enemy,

71
00:04:18.060 --> 00:04:21.541
<00:04:18.060>we <00:04:18.200>started <00:04:18.339>to <00:04:18.480>dive <00:04:18.620>into <00:04:18.760>the <00:04:18.899>maps <00:04:19.040>and <00:04:19.180>see <00:04:19.320>how <00:04:19.459>it

72
00:04:21.899 --> 00:04:25.720
<00:04:21.899>gonna <00:04:22.054>be. <00:04:22.210>So <00:04:22.365>or <00:04:22.521>other <00:04:22.676>words, <00:04:22.832>let's <00:04:22.987>see <00:04:23.143>how <00:04:23.299>JavaScript

73
00:04:25.840 --> 00:04:28.800
<00:04:25.840>engine <00:04:26.015>works. <00:04:26.190>Everything <00:04:26.364>starts, <00:04:26.539>of <00:04:26.715>course, <00:04:26.890>with <00:04:27.065>the <00:04:27.239>engine.

74
00:04:28.980 --> 00:04:32.740
<00:04:28.980>Our <00:04:29.135>code <00:04:29.291>first <00:04:29.446>is <00:04:29.602>represented <00:04:29.757>by <00:04:29.913>a <00:04:30.068>text <00:04:30.224>there, <00:04:30.380>and

75
00:04:32.760 --> 00:04:35.640
<00:04:32.760>it's <00:04:32.993>compiled <00:04:33.226>to <00:04:33.460>the <00:04:33.693>sequence <00:04:33.926>of <00:04:34.159>tokens.

76
00:04:36.220 --> 00:04:39.800
<00:04:36.220>Then <00:04:36.360>from <00:04:36.500>the <00:04:36.640>sequence <00:04:36.780>of <00:04:36.920>tokens, <00:04:37.060>abstract <00:04:37.200>syntax <00:04:37.340>tree <00:04:37.480>is <00:04:37.620>created.

77
00:04:40.140 --> 00:04:42.200
<00:04:40.140>And <00:04:40.419>for <00:04:40.700>now, <00:04:40.979>nothing <00:04:41.260>is <00:04:41.539>allocated.

78
00:04:42.400 --> 00:04:45.469
<00:04:42.400>It's <00:04:42.599>the <00:04:42.799>simplification, <00:04:43.000>but <00:04:43.200>let's <00:04:43.400>say <00:04:43.599>like <00:04:43.799>this.

79
00:04:46.880 --> 00:04:50.840
<00:04:46.880>And <00:04:47.007>this <00:04:47.134>abstract <00:04:47.261>syntax <00:04:47.389>tree <00:04:47.516>is <00:04:47.643>backed <00:04:47.770>by <00:04:47.898>the <00:04:48.025>heap <00:04:48.152>memory <00:04:48.280>or

80
00:04:50.920 --> 00:04:54.780
<00:04:50.920>in-engine <00:04:51.153>memory. <00:04:51.386>And <00:04:51.620>of <00:04:51.853>course, <00:04:52.086>it's <00:04:52.320>pre-allocated

81
00:04:54.820 --> 00:04:56.900
<00:04:54.820>on <00:04:55.053>the <00:04:55.286>start <00:04:55.520>from <00:04:55.753>the <00:04:55.986>operational <00:04:56.219>system.

82
00:04:57.160 --> 00:05:00.560
<00:04:57.159>Then <00:04:57.335>our <00:04:57.510>abstract <00:04:57.684>syntax <00:04:57.859>tree <00:04:58.034>is <00:04:58.210>compiled <00:04:58.385>to <00:04:58.559>the

83
00:05:00.580 --> 00:05:04.120
<00:05:00.580>bytecode. <00:05:00.755>And <00:05:00.930>here <00:05:01.104>is <00:05:01.280>where <00:05:01.455>the <00:05:01.630>magic <00:05:01.805>happens, <00:05:01.979>and

84
00:05:04.480 --> 00:05:08.080
<00:05:04.480>here <00:05:04.635>is <00:05:04.791>the <00:05:04.946>place <00:05:05.102>where <00:05:05.257>actually <00:05:05.413>the <00:05:05.568>engine <00:05:05.724>creates <00:05:05.880>our

85
00:05:08.120 --> 00:05:08.680
variables.

86
00:05:09.540 --> 00:05:13.200
<00:05:09.540>So <00:05:09.715>interpreter <00:05:09.890>walks <00:05:10.065>the <00:05:10.240>instructions <00:05:10.415>until <00:05:10.590>it <00:05:10.765>sees <00:05:10.940>something

87
00:05:13.270 --> 00:05:17.220
<00:05:13.270>like <00:05:13.386>this. <00:05:13.503>Here <00:05:13.620>is <00:05:13.736>the <00:05:13.853>bytecode, <00:05:13.969>and <00:05:14.086>const <00:05:14.203>x <00:05:14.320>here <00:05:14.436>is <00:05:14.553>just <00:05:14.669>for

88
00:05:17.260 --> 00:05:20.680
<00:05:17.260>the <00:05:17.493>example <00:05:17.726>from <00:05:17.960>what <00:05:18.193>the <00:05:18.426>bytecode <00:05:18.659>is

89
00:05:20.700 --> 00:05:24.420
<00:05:20.700>generated. <00:05:20.840>So <00:05:20.979>it <00:05:21.120>goes <00:05:21.260>through, <00:05:21.400>and <00:05:21.539>it <00:05:21.680>see, <00:05:21.820>okay, <00:05:21.960>we <00:05:22.099>have

90
00:05:24.440 --> 00:05:25.840
<00:05:24.440>instantiation <00:05:25.070>of <00:05:25.700>our

91
00:05:27.780 --> 00:05:30.620
<00:05:27.780>global <00:05:27.955>scope <00:05:28.130>here. <00:05:28.304>And <00:05:28.479>we <00:05:28.655>have-- <00:05:28.830>Oh, <00:05:29.005>sorry. <00:05:29.179>Yes.

92
00:05:30.680 --> 00:05:33.810
<00:05:30.680>We <00:05:30.820>have <00:05:30.960>the <00:05:31.100>global <00:05:31.240>instantiation, <00:05:31.380>and <00:05:31.520>then <00:05:31.660>we <00:05:31.800>have <00:05:31.940>declaration <00:05:32.080>of

93
00:05:33.880 --> 00:05:37.600
<00:05:33.880>the <00:05:34.020>x <00:05:34.159>in <00:05:34.300>the <00:05:34.440>global <00:05:34.580>scope. <00:05:34.719>And <00:05:34.860>this <00:05:35.000>is <00:05:35.140>the <00:05:35.280>point

94
00:05:37.660 --> 00:05:40.320
<00:05:37.659>where <00:05:37.939>actual <00:05:38.219>engine <00:05:38.499>creates <00:05:38.780>our <00:05:39.059>variable.

95
00:05:41.080 --> 00:05:45.040
<00:05:41.080>The <00:05:41.207>really <00:05:41.334>important <00:05:41.461>part <00:05:41.589>here <00:05:41.716>is <00:05:41.843>how <00:05:41.970>the <00:05:42.098>heap <00:05:42.225>actually <00:05:42.352>also <00:05:42.479>works.

96
00:05:45.100 --> 00:05:48.120
<00:05:45.100>So <00:05:45.275>first <00:05:45.450>of <00:05:45.625>all, <00:05:45.800>it's <00:05:45.975>divided <00:05:46.150>into <00:05:46.325>three <00:05:46.500>parts.

97
00:05:48.320 --> 00:05:51.540
<00:05:48.320>First <00:05:48.599>part <00:05:48.880>is <00:05:49.159>garbage <00:05:49.440>collector <00:05:49.719>arenas.

98
00:05:51.600 --> 00:05:54.060
<00:05:51.600>We'll <00:05:51.833>talk <00:05:52.066>garbage <00:05:52.300>collector <00:05:52.533>a <00:05:52.766>bit <00:05:53.000>further.

99
00:05:54.600 --> 00:05:56.200
<00:05:54.600>Then <00:05:54.950>zones <00:05:55.300>and <00:05:55.650>compartments. <00:05:56.000>The

100
00:05:57.100 --> 00:06:00.880
<00:05:57.100>interesting <00:05:57.227>part <00:05:57.354>here <00:05:57.481>is <00:05:57.609>arenas, <00:05:57.736>which <00:05:57.863>is <00:05:57.990>divided <00:05:58.118>in <00:05:58.245>equally <00:05:58.372>sized <00:05:58.500>cells,

101
00:06:01.340 --> 00:06:04.520
<00:06:01.340>and <00:06:01.495>each <00:06:01.651>cell <00:06:01.806>contain <00:06:01.962>the <00:06:02.117>same <00:06:02.273>type <00:06:02.428>of <00:06:02.584>the <00:06:02.739>object.

102
00:06:04.560 --> 00:06:07.560
<00:06:04.560>For <00:06:04.715>example, <00:06:04.871>it <00:06:05.026>could <00:06:05.182>be <00:06:05.337>JS <00:06:05.493>object <00:06:05.648>or <00:06:05.804>JS <00:06:05.960>string.

103
00:06:07.600 --> 00:06:11.080
<00:06:07.600>By <00:06:07.755>the <00:06:07.911>way, <00:06:08.066>it's <00:06:08.222>all <00:06:08.377>represented <00:06:08.533>in <00:06:08.688>C++ <00:06:08.844>by <00:06:09.000>C++

104
00:06:11.090 --> 00:06:13.640
<00:06:11.090>structures. <00:06:11.440>And <00:06:11.789>so <00:06:12.140>let's <00:06:12.489>see

105
00:06:15.776 --> 00:06:16.816
<00:06:15.776>Knowing <00:06:16.244>how <00:06:16.712>it's

106
00:06:17.676 --> 00:06:19.096
<00:06:17.676>structured, <00:06:17.931>let's <00:06:18.187>see <00:06:18.442>how <00:06:18.698>it <00:06:18.954>works.

107
00:06:19.476 --> 00:06:19.496
I

108
00:06:21.156 --> 00:06:24.816
<00:06:21.156>like <00:06:21.296>the <00:06:21.436>idea. <00:06:21.576>I <00:06:21.716>pick <00:06:21.856>up <00:06:21.996>this <00:06:22.136>idea <00:06:22.276>in <00:06:22.416>the <00:06:22.556>book,

109
00:06:25.626 --> 00:06:28.476
<00:06:25.626>"You <00:06:25.753>Don't <00:06:25.880>Know <00:06:26.007>JS." <00:06:26.135>Probably <00:06:26.262>all <00:06:26.389>the <00:06:26.516>front-enders <00:06:26.644>should <00:06:26.771>know <00:06:26.898>this <00:06:27.025>book.

110
00:06:29.496 --> 00:06:33.396
<00:06:29.496>It's <00:06:29.612>basically <00:06:29.729>a <00:06:29.846>conversation. <00:06:29.962>Engine <00:06:30.079>tells <00:06:30.195>the <00:06:30.312>heap, <00:06:30.429>"Hey, <00:06:30.546>give <00:06:30.662>me, <00:06:30.779>please, <00:06:30.895>a

111
00:06:33.496 --> 00:06:37.456
<00:06:33.496>free <00:06:33.612>cell." <00:06:33.729>And <00:06:33.846>if <00:06:33.962>we <00:06:34.079>hear <00:06:34.195>the <00:06:34.312>answer, <00:06:34.429>"No, <00:06:34.546>sorry, <00:06:34.662>I <00:06:34.779>don't <00:06:34.895>have

112
00:06:37.496 --> 00:06:41.436
<00:06:37.496>a <00:06:37.623>free <00:06:37.750>cell," <00:06:37.877>then <00:06:38.005>the <00:06:38.132>engine <00:06:38.259>goes <00:06:38.386>to <00:06:38.514>the <00:06:38.641>musl <00:06:38.768>jemalloc <00:06:38.895>library.

113
00:06:41.516 --> 00:06:45.176
<00:06:41.516>And <00:06:41.656>whoever <00:06:41.796>is <00:06:41.936>acquainted <00:06:42.076>with <00:06:42.216>C <00:06:42.356>or <00:06:42.496>C++, <00:06:42.636>the <00:06:42.776>musl <00:06:42.916>jemalloc

114
00:06:45.316 --> 00:06:49.046
<00:06:45.316>library <00:06:45.423>is <00:06:45.531>basically <00:06:45.639>a <00:06:45.746>fork <00:06:45.854>of <00:06:45.962>jemalloc <00:06:46.069>library <00:06:46.177>that <00:06:46.285>is <00:06:46.392>used <00:06:46.500>in <00:06:46.608>C <00:06:46.716>and

115
00:06:49.116 --> 00:06:52.976
<00:06:49.116>C++. <00:06:49.291>And <00:06:49.466>it's <00:06:49.640>primarily <00:06:49.816>used <00:06:49.991>to <00:06:50.166>allocate <00:06:50.341>the <00:06:50.515>memory.

116
00:06:53.805 --> 00:06:57.636
<00:06:53.805>So <00:06:53.932>musl <00:06:54.059>jemalloc <00:06:54.186>library <00:06:54.314>then <00:06:54.441>goes <00:06:54.568>to <00:06:54.695>the <00:06:54.823>operational <00:06:54.950>system <00:06:55.077>and <00:06:55.205>say,

117
00:06:57.726 --> 00:06:59.376
<00:06:57.726>"Hey, <00:06:58.006>give <00:06:58.286>me, <00:06:58.566>please, <00:06:58.846>some <00:06:59.126>memory.

118
00:06:59.476 --> 00:07:03.276
<00:06:59.476>I <00:06:59.631>want <00:06:59.787>to <00:06:59.942>expand <00:07:00.098>my <00:07:00.253>heap." <00:07:00.409>And <00:07:00.564>OS, <00:07:00.720>being <00:07:00.876>so

119
00:07:03.316 --> 00:07:06.916
<00:07:03.316>kind, <00:07:03.491>it <00:07:03.666>allocates <00:07:03.840>the <00:07:04.015>memory. <00:07:04.191>But <00:07:04.366>again, <00:07:04.541>please <00:07:04.715>pay

120
00:07:06.936 --> 00:07:08.616
<00:07:06.936>attention, <00:07:07.402>here <00:07:07.869>is <00:07:08.335>simplification.

121
00:07:08.876 --> 00:07:10.996
<00:07:08.876>We <00:07:09.109>are <00:07:09.342>talking <00:07:09.575>about <00:07:09.809>virtual <00:07:10.042>memory <00:07:10.275>here.

122
00:07:11.056 --> 00:07:14.956
<00:07:11.056>It's <00:07:11.163>not <00:07:11.271>yet <00:07:11.379>the <00:07:11.486>physical <00:07:11.594>memory. <00:07:11.702>Physical <00:07:11.809>memory, <00:07:11.917>I <00:07:12.025>am <00:07:12.132>not <00:07:12.240>going <00:07:12.348>to <00:07:12.455>touch

123
00:07:14.976 --> 00:07:18.756
<00:07:14.976>this <00:07:15.092>topic <00:07:15.209>because <00:07:15.326>it's <00:07:15.442>very <00:07:15.559>deep, <00:07:15.676>and <00:07:15.792>it <00:07:15.909>operates <00:07:16.026>on <00:07:16.142>the <00:07:16.259>operational <00:07:16.376>system

124
00:07:18.815 --> 00:07:21.956
<00:07:18.815>level. <00:07:18.990>So <00:07:19.165>let's <00:07:19.340>say <00:07:19.515>we <00:07:19.690>have <00:07:19.865>acquainted <00:07:20.040>our <00:07:20.215>memory.

125
00:07:23.356 --> 00:07:24.796
<00:07:23.356>And <00:07:23.615>now <00:07:23.874>I <00:07:24.133>would <00:07:24.392>like <00:07:24.652>to

126
00:07:27.036 --> 00:07:30.976
<00:07:27.036>show <00:07:27.191>you <00:07:27.347>some <00:07:27.502>terminal <00:07:27.658>time. <00:07:27.813>Here <00:07:27.969>I <00:07:28.124>have <00:07:28.280>the <00:07:28.436>fork

127
00:07:31.096 --> 00:07:33.166
<00:07:31.096>of <00:07:31.446>the <00:07:31.796>JavaScript <00:07:32.146>engine, <00:07:32.496>SpiderMonkey.

128
00:07:33.556 --> 00:07:36.636
<00:07:33.556>I <00:07:33.683>am <00:07:33.810>not <00:07:33.937>going <00:07:34.065>to <00:07:34.192>show <00:07:34.319>you <00:07:34.446>all <00:07:34.574>the <00:07:34.701>steps <00:07:34.828>of <00:07:34.955>compilation.

129
00:07:36.836 --> 00:07:38.156
<00:07:36.836>Trust <00:07:37.073>me, <00:07:37.311>it <00:07:37.548>will <00:07:37.786>take <00:07:38.024>forever.

130
00:07:39.716 --> 00:07:42.696
<00:07:39.716>Let's <00:07:39.996>just <00:07:40.276>open... <00:07:40.556>Sorry. <00:07:40.836>Let's <00:07:41.116>build.

131
00:07:43.036 --> 00:07:46.456
<00:07:43.036>Let's <00:07:43.211>say <00:07:43.386>we <00:07:43.561>open <00:07:43.736>our <00:07:43.911>JS <00:07:44.086>shell <00:07:44.261>now, <00:07:44.436>and

132
00:07:47.016 --> 00:07:50.516
<00:07:47.016>I <00:07:47.216>want <00:07:47.416>to <00:07:47.616>create <00:07:47.816>a <00:07:48.016>simple <00:07:48.216>object <00:07:48.416>called

133
00:07:50.996 --> 00:07:51.356
hobbit.

134
00:07:52.176 --> 00:07:54.476
<00:07:52.176>And <00:07:52.409>let's <00:07:52.642>say <00:07:52.876>it <00:07:53.109>will <00:07:53.342>be <00:07:53.575>name...

135
00:07:56.036 --> 00:07:56.256
Sorry?

136
00:07:57.346 --> 00:08:00.436
<00:07:57.346>Font <00:07:57.453>bigger. <00:07:57.561>Yeah, <00:07:57.669>I <00:07:57.776>usually <00:07:57.884>use <00:07:57.992>split <00:07:58.099>keyboard, <00:07:58.207>so <00:07:58.315>here <00:07:58.422>is <00:07:58.530>not <00:07:58.638>my <00:07:58.746>usual

137
00:08:00.476 --> 00:08:00.916
environment.

138
00:08:03.716 --> 00:08:07.616
<00:08:03.716>Make <00:08:03.823>the <00:08:03.931>font <00:08:04.039>bigger. <00:08:04.146>What? <00:08:04.254>Make <00:08:04.362>the <00:08:04.469>font <00:08:04.577>bigger. <00:08:04.685>Font <00:08:04.792>bigger. <00:08:04.900>Oh, <00:08:05.008>crap. <00:08:05.116>Sorry.

139
00:08:07.876 --> 00:08:10.716
<00:08:07.876>I <00:08:08.031>don't <00:08:08.187>know. <00:08:08.342>It's <00:08:08.498>terminal. <00:08:08.653>I'll <00:08:08.809>try. <00:08:08.964>But <00:08:09.120>yeah, <00:08:09.275>sorry.

140
00:08:11.296 --> 00:08:13.656
<00:08:11.296>I <00:08:11.451>think <00:08:11.607>let's <00:08:11.762>not <00:08:11.918>pay <00:08:12.073>too <00:08:12.229>much <00:08:12.384>attention <00:08:12.540>to <00:08:12.695>this.

141
00:08:15.476 --> 00:08:17.526
<00:08:15.476>But <00:08:15.756>thank <00:08:16.036>you. <00:08:16.316>I'll <00:08:16.596>mention <00:08:16.876>this.

142
00:08:18.456 --> 00:08:21.816
<00:08:18.456>Frodo, <00:08:18.596>let's <00:08:18.736>say <00:08:18.876>yes. <00:08:19.016>And <00:08:19.156>what <00:08:19.296>we <00:08:19.436>are <00:08:19.576>basically... <00:08:19.716>Yes, <00:08:19.856>crap.

143
00:08:21.856 --> 00:08:22.936
<00:08:21.856>It's <00:08:22.342>really <00:08:22.828>small.

144
00:08:24.755 --> 00:08:25.856
<00:08:24.755>Let <00:08:25.085>me <00:08:25.415>think. <00:08:25.745>Mac.

145
00:08:28.336 --> 00:08:31.796
<00:08:28.336>No, <00:08:28.686>it's <00:08:29.036>Linux. <00:08:29.386>Which <00:08:29.736>one?

146
00:08:33.076 --> 00:08:34.876
<00:08:33.076>Nice. <00:08:33.426>Thank <00:08:33.776>you. <00:08:34.126>That <00:08:34.476>one.

147
00:08:36.996 --> 00:08:37.236
So,

148
00:08:39.036 --> 00:08:42.476
<00:08:39.036>what <00:08:39.176>I <00:08:39.316>so <00:08:39.456>far <00:08:39.596>described, <00:08:39.736>we <00:08:39.876>could <00:08:40.016>see <00:08:40.156>here <00:08:40.296>in <00:08:40.436>our

149
00:08:42.756 --> 00:08:43.317
perfect

150
00:08:44.576 --> 00:08:48.276
<00:08:44.576>terminal. <00:08:44.776>So <00:08:44.976>we <00:08:45.176>enter <00:08:45.376>the <00:08:45.576>JS <00:08:45.776>shell <00:08:45.976>here,

151
00:08:48.656 --> 00:08:52.416
<00:08:48.656>we <00:08:48.811>type <00:08:48.967>our <00:08:49.122>object, <00:08:49.278>and <00:08:49.433>we <00:08:49.589>see <00:08:49.744>the <00:08:49.900>creation <00:08:50.055>or

152
00:08:53.076 --> 00:08:56.536
<00:08:53.076>parsing <00:08:53.216>of <00:08:53.356>the <00:08:53.496>abstract <00:08:53.636>syntax <00:08:53.776>tree. <00:08:53.916>So <00:08:54.056>there <00:08:54.196>are <00:08:54.336>different <00:08:54.476>nodes.

153
00:08:56.576 --> 00:09:00.416
<00:08:56.576>If <00:08:56.683>we <00:08:56.791>will <00:08:56.899>dive <00:08:57.006>into <00:08:57.114>the <00:08:57.222>source <00:08:57.329>code, <00:08:57.437>there <00:08:57.545>are <00:08:57.652>that <00:08:57.760>big <00:08:57.868>list <00:08:57.976>of

154
00:09:00.476 --> 00:09:00.716
those

155
00:09:01.596 --> 00:09:05.096
<00:09:01.596>nodes. <00:09:01.712>But <00:09:01.829>here <00:09:01.946>we <00:09:02.062>could <00:09:02.179>see <00:09:02.296>our <00:09:02.412>const <00:09:02.529>declaration <00:09:02.646>and <00:09:02.762>of <00:09:02.879>course, <00:09:02.996>assignment

156
00:09:05.136 --> 00:09:06.896
<00:09:05.136>expression <00:09:05.369>that <00:09:05.602>we <00:09:05.836>assigned <00:09:06.069>to <00:09:06.302>the <00:09:06.536>const.

157
00:09:08.016 --> 00:09:11.536
<00:09:08.016>Then <00:09:08.171>we <00:09:08.327>see <00:09:08.482>the <00:09:08.638>bytecode. <00:09:08.793>We <00:09:08.949>all <00:09:09.104>know <00:09:09.260>we <00:09:09.415>acquired

158
00:09:11.556 --> 00:09:15.536
<00:09:11.556>17 <00:09:11.731>bytes <00:09:11.906>in <00:09:12.081>the <00:09:12.256>bytecode. <00:09:12.431>And <00:09:12.606>yeah, <00:09:12.781>of <00:09:12.956>course,

159
00:09:15.596 --> 00:09:19.476
<00:09:15.596>we <00:09:15.712>see <00:09:15.829>our <00:09:15.946>object, <00:09:16.062>initialization <00:09:16.179>of <00:09:16.296>lexical <00:09:16.412>scope, <00:09:16.529>the <00:09:16.646>pop <00:09:16.762>where <00:09:16.879>we <00:09:16.996>clear

160
00:09:19.516 --> 00:09:23.136
<00:09:19.516>the <00:09:19.632>stack, <00:09:19.749>and <00:09:19.866>so <00:09:19.982>on. <00:09:20.099>But <00:09:20.216>we'll <00:09:20.332>discuss <00:09:20.449>it <00:09:20.565>also <00:09:20.682>a <00:09:20.799>bit <00:09:20.915>later.

161
00:09:23.286 --> 00:09:25.936
<00:09:23.286>And <00:09:23.486>of <00:09:23.686>course, <00:09:23.886>we <00:09:24.086>have <00:09:24.286>our <00:09:24.486>heap <00:09:24.686>pushed.

162
00:09:27.016 --> 00:09:27.296
So

163
00:09:28.556 --> 00:09:31.576
<00:09:28.556>let's <00:09:28.789>go <00:09:29.022>back <00:09:29.256>to <00:09:29.489>the <00:09:29.722>presentation. <00:09:29.956>Slideshow.

164
00:09:31.736 --> 00:09:33.916
<00:09:31.736>Start <00:09:32.086>from <00:09:32.436>now. <00:09:32.786>Current <00:09:33.136>slide.

165
00:09:34.776 --> 00:09:38.036
<00:09:34.776>Nice. <00:09:35.009>So <00:09:35.242>learned <00:09:35.476>about <00:09:35.709>how <00:09:35.942>it <00:09:36.175>operates.

166
00:09:38.396 --> 00:09:39.956
<00:09:38.396>I <00:09:38.629>am <00:09:38.862>equipped <00:09:39.096>myself <00:09:39.329>with <00:09:39.562>this <00:09:39.795>knowledge.

167
00:09:40.096 --> 00:09:43.976
<00:09:40.096>But <00:09:40.251>Alas <00:09:40.407>would <00:09:40.562>say <00:09:40.718>Gandalf, <00:09:40.873>"Let's <00:09:41.029>prepare <00:09:41.184>ourselves <00:09:41.340>a <00:09:41.496>bit

168
00:09:44.076 --> 00:09:45.056
<00:09:44.076>more <00:09:44.517>and <00:09:44.958>see

169
00:09:46.216 --> 00:09:49.586
<00:09:46.216>about <00:09:46.391>memory <00:09:46.566>leaks." <00:09:46.741>And <00:09:46.916>let's <00:09:47.091>see <00:09:47.266>actually <00:09:47.441>on <00:09:47.616>the

170
00:09:49.716 --> 00:09:50.896
<00:09:49.716>bestiary <00:09:50.247>of <00:09:50.778>those.

171
00:09:52.796 --> 00:09:56.136
<00:09:52.796>But <00:09:52.951>what <00:09:53.107>is <00:09:53.262>the <00:09:53.418>memory <00:09:53.573>leak? <00:09:53.729>So <00:09:53.884>there <00:09:54.040>are <00:09:54.196>numerous

172
00:09:56.536 --> 00:10:00.456
<00:09:56.536>definitions <00:09:56.663>out <00:09:56.790>there <00:09:56.917>in <00:09:57.045>the <00:09:57.172>wild, <00:09:57.299>in <00:09:57.426>the <00:09:57.554>internet, <00:09:57.681>but <00:09:57.808>I <00:09:57.936>personally

173
00:10:00.476 --> 00:10:00.936
prefer...

174
00:10:01.856 --> 00:10:05.236
<00:10:01.856>I <00:10:02.136>prefer... <00:10:02.415>No, <00:10:02.696>not <00:10:02.976>this <00:10:03.256>guy.

175
00:10:07.056 --> 00:10:09.576
<00:10:07.056>I <00:10:07.756>prefer <00:10:08.456>nothing.

176
00:10:11.716 --> 00:10:12.076
Oh,

177
00:10:13.776 --> 00:10:15.256
<00:10:13.776>I <00:10:14.219>am <00:10:14.664>so <00:10:15.108>sorry.

178
00:10:17.276 --> 00:10:20.636
<00:10:17.276>Maybe <00:10:17.383>a <00:10:17.491>different <00:10:17.599>font <00:10:17.706>size? <00:10:17.814>Maybe. <00:10:17.922>Okay. <00:10:18.029>I'll <00:10:18.137>just <00:10:18.245>tell <00:10:18.352>you <00:10:18.460>what <00:10:18.568>I <00:10:18.675>prefer.

179
00:10:22.476 --> 00:10:26.396
<00:10:22.476>Okay. <00:10:22.616>I <00:10:22.756>prefer <00:10:22.896>more <00:10:23.036>the <00:10:23.176>AWAS <00:10:23.316>Foundation <00:10:23.456>definition, <00:10:23.596>where <00:10:23.736>it's <00:10:23.876>clearly

180
00:10:26.496 --> 00:10:30.036
<00:10:26.496>stated <00:10:26.651>that <00:10:26.807>the <00:10:26.962>memory <00:10:27.118>leak <00:10:27.273>is <00:10:27.429>the <00:10:27.584>fault <00:10:27.740>of <00:10:27.896>the

181
00:10:30.096 --> 00:10:31.396
<00:10:30.096>developer <00:10:30.681>who <00:10:31.266>forgot

182
00:10:32.235 --> 00:10:33.156
<00:10:32.235>to <00:10:32.649>free <00:10:33.063>it.

183
00:10:35.516 --> 00:10:35.795
Yes.

184
00:10:38.556 --> 00:10:39.216
<00:10:38.556>Where <00:10:38.754>is <00:10:38.952>my <00:10:39.150>font?

185
00:10:42.276 --> 00:10:44.255
<00:10:42.276>It's <00:10:42.555>leaked. <00:10:42.835>It's <00:10:43.116>leaked. <00:10:43.396>Oh, <00:10:43.675>yes.

186
00:10:45.316 --> 00:10:48.916
<00:10:45.316>Yes, <00:10:45.516>sir. <00:10:45.716>Okay. <00:10:45.916>But <00:10:46.116>one <00:10:46.316>could <00:10:46.516>say, <00:10:46.716>what

187
00:10:48.996 --> 00:10:50.916
<00:10:48.996>about <00:10:49.462>the <00:10:49.929>browser? <00:10:50.396>All

188
00:10:51.916 --> 00:10:55.556
<00:10:51.915>so <00:10:52.043>far <00:10:52.170>that <00:10:52.297>what <00:10:52.425>I've <00:10:52.552>described <00:10:52.679>sounds <00:10:52.806>very <00:10:52.934>like <00:10:53.061>C <00:10:53.188>and <00:10:53.315>C++.

189
00:10:56.446 --> 00:11:00.116
<00:10:56.446>But <00:10:56.621>basically, <00:10:56.796>the <00:10:56.971>browser <00:10:57.146>works <00:10:57.321>in <00:10:57.496>some <00:10:57.671>kind <00:10:57.846>of

190
00:11:00.156 --> 00:11:04.116
<00:11:00.156>different, <00:11:00.295>in <00:11:00.435>the <00:11:00.575>similar <00:11:00.715>way. <00:11:00.856>But <00:11:00.996>again, <00:11:01.136>the <00:11:01.276>simplification <00:11:01.415>that <00:11:01.555>we

191
00:11:04.156 --> 00:11:06.536
<00:11:04.156>don't <00:11:04.389>allocate <00:11:04.622>and <00:11:04.856>free <00:11:05.089>the <00:11:05.322>memory <00:11:05.555>ourselves.

192
00:11:07.096 --> 00:11:10.956
<00:11:07.096>And <00:11:07.251>here <00:11:07.407>where <00:11:07.562>this <00:11:07.718>beautiful <00:11:07.873>man <00:11:08.029>called <00:11:08.184>garbage <00:11:08.340>collector <00:11:08.496>comes

193
00:11:10.976 --> 00:11:11.456
<00:11:10.976>into <00:11:11.408>play.

194
00:11:12.316 --> 00:11:15.876
<00:11:12.316>So <00:11:12.666>garbage <00:11:13.016>collector <00:11:13.366>is <00:11:13.716>basically

195
00:11:15.896 --> 00:11:19.876
<00:11:15.896>implemented <00:11:16.051>for <00:11:16.207>allocated <00:11:16.362>the <00:11:16.518>memory <00:11:16.673>for <00:11:16.829>all <00:11:16.984>JavaScript <00:11:17.140>data <00:11:17.295>structures,

196
00:11:19.916 --> 00:11:23.596
<00:11:19.916>and <00:11:20.116>of <00:11:20.316>course, <00:11:20.516>free <00:11:20.716>it. <00:11:20.916>It <00:11:21.116>tries <00:11:21.316>to

197
00:11:23.656 --> 00:11:27.476
<00:11:23.656>allocate <00:11:23.856>in <00:11:24.055>batches. <00:11:24.256>And <00:11:24.455>in <00:11:24.656>terms <00:11:24.856>of <00:11:25.055>deallocation,

198
00:11:27.516 --> 00:11:30.435
<00:11:27.516>it's <00:11:27.671>the <00:11:27.827>same, <00:11:27.982>and <00:11:28.138>in <00:11:28.293>the <00:11:28.449>least <00:11:28.604>time <00:11:28.760>as <00:11:28.915>possible.

199
00:11:32.776 --> 00:11:35.576
<00:11:32.776>Please <00:11:32.950>don't <00:11:33.126>tell <00:11:33.300>me <00:11:33.476>that <00:11:33.651>you <00:11:33.825>are <00:11:34.001>broken. <00:11:34.175>Yes.

200
00:11:37.536 --> 00:11:41.136
<00:11:37.536>But <00:11:37.652>garbage <00:11:37.769>collector <00:11:37.886>is <00:11:38.002>the <00:11:38.119>theme <00:11:38.236>that <00:11:38.352>I <00:11:38.469>want <00:11:38.586>to <00:11:38.702>discuss, <00:11:38.819>and <00:11:38.936>let's

201
00:11:41.516 --> 00:11:45.416
<00:11:41.516>please <00:11:41.643>go <00:11:41.770>to <00:11:41.897>the <00:11:42.025>example <00:11:42.152>that <00:11:42.279>we <00:11:42.406>already <00:11:42.534>had <00:11:42.661>with <00:11:42.788>our <00:11:42.915>hobbit

202
00:11:45.486 --> 00:11:48.576
<00:11:45.486>object. <00:11:45.626>And <00:11:45.766>the <00:11:45.906>most <00:11:46.045>interesting <00:11:46.186>part <00:11:46.326>here <00:11:46.466>is, <00:11:46.606>of <00:11:46.746>course, <00:11:46.886>our

203
00:11:48.756 --> 00:11:52.416
<00:11:48.756>bytecode. <00:11:48.896>And <00:11:49.036>what <00:11:49.175>is <00:11:49.315>relevant <00:11:49.456>here <00:11:49.596>for <00:11:49.736>the <00:11:49.876>garbage <00:11:50.016>collector <00:11:50.156>is

204
00:11:52.476 --> 00:11:56.376
<00:11:52.476>here <00:11:52.631>on <00:11:52.787>the <00:11:52.942>row <00:11:53.098>0 <00:11:53.253>and <00:11:53.409>5, <00:11:53.564>creation <00:11:53.720>of <00:11:53.876>our

205
00:11:56.456 --> 00:11:59.876
<00:11:56.456>object. <00:11:56.656>Every <00:11:56.856>time <00:11:57.056>the <00:11:57.256>JS <00:11:57.456>object <00:11:57.656>is <00:11:57.856>created,

206
00:12:00.236 --> 00:12:02.316
<00:12:00.236>again, <00:12:00.411>I <00:12:00.586>am <00:12:00.761>telling <00:12:00.936>you, <00:12:01.111>JS <00:12:01.286>object <00:12:01.461>is <00:12:01.636>not

207
00:12:03.736 --> 00:12:04.356
<00:12:03.736>just <00:12:04.294>a

208
00:12:05.516 --> 00:12:06.196
<00:12:05.516>phrase, <00:12:06.128>it's

209
00:12:07.256 --> 00:12:10.496
<00:12:07.256>C++ <00:12:07.456>JavaScript <00:12:07.656>object <00:12:07.856>struct. <00:12:08.055>And <00:12:08.256>every <00:12:08.456>time <00:12:08.656>it's

210
00:12:10.956 --> 00:12:13.256
<00:12:10.956>inherited, <00:12:11.156>and <00:12:11.356>it's <00:12:11.556>tagged <00:12:11.756>by <00:12:11.956>the <00:12:12.156>garbage <00:12:12.356>collector.

211
00:12:14.516 --> 00:12:18.168
<00:12:14.516>And <00:12:14.643>then <00:12:14.770>On <00:12:14.897>the <00:12:15.025>next <00:12:15.152>line <00:12:15.279>on <00:12:15.406>zeros <00:12:15.534>and <00:12:15.661>10, <00:12:15.788>when <00:12:15.915>the

212
00:12:18.228 --> 00:12:21.958
<00:12:18.228>instantiation <00:12:18.428>of <00:12:18.627>the <00:12:18.828>global <00:12:19.027>lexical <00:12:19.228>scope <00:12:19.428>is <00:12:19.627>done,

213
00:12:22.348 --> 00:12:25.098
<00:12:22.348>it's <00:12:22.548>basically <00:12:22.747>put <00:12:22.948>there. <00:12:23.147>And <00:12:23.348>from <00:12:23.548>now <00:12:23.747>on,

214
00:12:26.228 --> 00:12:27.908
<00:12:26.228>it's <00:12:26.694>referenced <00:12:27.161>from <00:12:27.627>the

215
00:12:29.248 --> 00:12:32.988
<00:12:29.248>global <00:12:29.403>scope. <00:12:29.559>And <00:12:29.714>here, <00:12:29.870>yes, <00:12:30.025>we <00:12:30.181>push <00:12:30.336>first <00:12:30.492>in <00:12:30.648>the

216
00:12:33.048 --> 00:12:36.308
<00:12:33.048>heap, <00:12:33.223>so <00:12:33.398>it's <00:12:33.573>got <00:12:33.748>referenced, <00:12:33.923>and <00:12:34.098>then <00:12:34.273>it... <00:12:34.448>Yeah.

217
00:12:36.908 --> 00:12:39.988
<00:12:36.908>Sorry? <00:12:37.063>Yes. <00:12:37.219>It's <00:12:37.374>pushed <00:12:37.530>to <00:12:37.685>the <00:12:37.841>heap. <00:12:37.996>It's <00:12:38.152>got <00:12:38.308>referenced.

218
00:12:40.328 --> 00:12:44.208
<00:12:40.328>And <00:12:40.502>then <00:12:40.678>on <00:12:40.853>the <00:12:41.028>pop <00:12:41.203>here, <00:12:41.377>it's <00:12:41.553>got <00:12:41.728>retrieved

219
00:12:44.228 --> 00:12:47.128
<00:12:44.228>from <00:12:44.428>the <00:12:44.627>stack, <00:12:44.828>but <00:12:45.027>it's <00:12:45.228>still <00:12:45.428>got <00:12:45.627>referenced.

220
00:12:48.028 --> 00:12:48.428
<00:12:48.028>So <00:12:48.388>yes,

221
00:12:49.288 --> 00:12:53.108
<00:12:49.288>the <00:12:49.463>global <00:12:49.638>lexical <00:12:49.813>environment <00:12:49.988>now <00:12:50.163>contains <00:12:50.338>our <00:12:50.513>object, <00:12:50.688>and

222
00:12:53.148 --> 00:12:56.648
<00:12:53.148>it <00:12:53.381>will <00:12:53.614>be <00:12:53.848>there <00:12:54.081>as <00:12:54.314>it's <00:12:54.548>referenced.

223
00:12:56.968 --> 00:12:58.868
<00:12:56.968>Sorry. <00:12:57.668>W. <00:12:58.367>Yes.

224
00:13:00.068 --> 00:13:01.428
<00:13:00.068>This <00:13:00.312>is <00:13:00.557>just <00:13:00.802>the <00:13:01.047>path <00:13:01.292>to

225
00:13:02.408 --> 00:13:06.378
<00:13:02.408>show <00:13:02.563>that <00:13:02.719>we <00:13:02.874>have <00:13:03.030>this <00:13:03.185>object. <00:13:03.341>And <00:13:03.496>it's <00:13:03.652>accessible <00:13:03.808>through

226
00:13:06.378 --> 00:13:10.148
<00:13:06.378>our <00:13:06.505>global <00:13:06.632>environment. <00:13:06.759>It's <00:13:06.887>binding <00:13:07.014>COVID, <00:13:07.141>and <00:13:07.268>we <00:13:07.396>will <00:13:07.523>get <00:13:07.650>our <00:13:07.778>object.

227
00:13:10.568 --> 00:13:14.348
<00:13:10.568>And <00:13:10.684>the <00:13:10.801>garbage <00:13:10.918>collectors <00:13:11.034>works <00:13:11.151>in <00:13:11.268>a <00:13:11.384>way <00:13:11.501>that <00:13:11.617>as <00:13:11.734>long <00:13:11.851>as <00:13:11.968>the

228
00:13:14.388 --> 00:13:17.068
<00:13:14.388>variable <00:13:14.563>is <00:13:14.738>referenced, <00:13:14.913>it <00:13:15.088>will <00:13:15.263>be <00:13:15.438>never <00:13:15.613>garbage <00:13:15.788>collected.

229
00:13:18.068 --> 00:13:19.807
<00:13:18.068>So <00:13:18.534>let's <00:13:19.001>see <00:13:19.468>how

230
00:13:21.188 --> 00:13:24.628
<00:13:21.188>actually <00:13:21.328>on <00:13:21.468>those <00:13:21.608>memory <00:13:21.747>leaks. <00:13:21.888>So <00:13:22.028>first <00:13:22.168>of <00:13:22.308>all, <00:13:22.448>this <00:13:22.588>is

231
00:13:25.708 --> 00:13:28.778
<00:13:25.708>a <00:13:25.908>function. <00:13:26.108>Yes. <00:13:26.308>The <00:13:26.507>first <00:13:26.708>type <00:13:26.908>of <00:13:27.108>the

232
00:13:30.088 --> 00:13:34.058
<00:13:30.088>leak <00:13:30.228>called <00:13:30.367>closure <00:13:30.507>leak. <00:13:30.647>So <00:13:30.788>we <00:13:30.928>have <00:13:31.068>a <00:13:31.208>simple <00:13:31.348>function <00:13:31.488>that

233
00:13:34.128 --> 00:13:37.688
<00:13:34.128>return <00:13:34.255>another <00:13:34.382>one <00:13:34.509>function, <00:13:34.637>and <00:13:34.764>here <00:13:34.891>in <00:13:35.018>the <00:13:35.146>closure, <00:13:35.273>we <00:13:35.400>have <00:13:35.528>the

234
00:13:37.728 --> 00:13:41.668
<00:13:37.728>retained <00:13:37.867>array. <00:13:38.007>And <00:13:38.147>each <00:13:38.287>time <00:13:38.428>it <00:13:38.568>will <00:13:38.708>be <00:13:38.848>invocated, <00:13:38.988>it <00:13:39.127>will

235
00:13:41.688 --> 00:13:45.438
<00:13:41.688>be <00:13:41.804>a <00:13:41.921>reference <00:13:42.038>from <00:13:42.154>our <00:13:42.271>callback. <00:13:42.388>And <00:13:42.504>so <00:13:42.621>as <00:13:42.738>soon <00:13:42.854>as <00:13:42.971>it's <00:13:43.088>a

236
00:13:45.488 --> 00:13:47.308
<00:13:45.488>reference <00:13:45.721>there, <00:13:45.954>it <00:13:46.188>will <00:13:46.421>never <00:13:46.654>be <00:13:46.888>cleaned.

237
00:13:47.848 --> 00:13:49.828
<00:13:47.848>And <00:13:48.048>the <00:13:48.247>solution <00:13:48.448>here <00:13:48.647>could <00:13:48.848>be <00:13:49.048>so <00:13:49.247>that

238
00:13:50.788 --> 00:13:54.388
<00:13:50.788>either <00:13:50.988>at <00:13:51.188>some <00:13:51.388>point, <00:13:51.588>we <00:13:51.788>need <00:13:51.988>to <00:13:52.188>refresh

239
00:13:54.908 --> 00:13:58.888
<00:13:54.908>the <00:13:55.083>retained <00:13:55.258>array, <00:13:55.433>or <00:13:55.608>we <00:13:55.783>need <00:13:55.958>to <00:13:56.133>somehow <00:13:56.308>to

240
00:13:58.928 --> 00:14:00.348
<00:13:58.928>restrict <00:13:59.247>its <00:13:59.567>size, <00:13:59.886>not <00:14:00.205>to

241
00:14:01.508 --> 00:14:05.208
<00:14:01.508>leak <00:14:01.635>our <00:14:01.762>memory. <00:14:01.889>Then <00:14:02.017>the <00:14:02.144>most <00:14:02.271>famous <00:14:02.398>one, <00:14:02.526>I <00:14:02.653>would <00:14:02.780>say, <00:14:02.908>is

242
00:14:05.288 --> 00:14:08.968
<00:14:05.288>the <00:14:05.568>leaky <00:14:05.848>timer <00:14:06.128>memory <00:14:06.408>leak. <00:14:06.688>Basically,

243
00:14:09.128 --> 00:14:12.428
<00:14:09.128>everything <00:14:09.283>that's... <00:14:09.439>For <00:14:09.594>example, <00:14:09.750>we <00:14:09.905>have <00:14:10.061>a <00:14:10.216>big <00:14:10.372>variable <00:14:10.528>here,

244
00:14:12.708 --> 00:14:16.438
<00:14:12.708>instantiation, <00:14:12.835>and <00:14:12.962>then <00:14:13.089>it <00:14:13.217>is <00:14:13.344>called <00:14:13.471>by <00:14:13.598>the <00:14:13.726>callback <00:14:13.853>in <00:14:13.980>the <00:14:14.108>set

245
00:14:16.568 --> 00:14:20.448
<00:14:16.568>our <00:14:16.695>interval. <00:14:16.822>And <00:14:16.949>everything <00:14:17.077>that <00:14:17.204>is <00:14:17.331>called <00:14:17.458>there <00:14:17.586>will <00:14:17.713>be <00:14:17.840>there <00:14:17.968>forever.

246
00:14:21.598 --> 00:14:23.528
<00:14:21.598>And <00:14:21.948>so <00:14:22.298>this <00:14:22.647>situation <00:14:22.997>is

247
00:14:25.407 --> 00:14:29.287
<00:14:25.407>most <00:14:25.562>often <00:14:25.718>situation, <00:14:25.873>so <00:14:26.029>please <00:14:26.184>just <00:14:26.340>remember <00:14:26.495>to <00:14:26.651>free <00:14:26.807>your

248
00:14:29.328 --> 00:14:33.288
<00:14:29.328>timer <00:14:29.444>or <00:14:29.561>just <00:14:29.678>put <00:14:29.794>a <00:14:29.911>variable <00:14:30.028>to <00:14:30.144>it. <00:14:30.261>Sorry, <00:14:30.377>to <00:14:30.494>put <00:14:30.611>the <00:14:30.728>parameter

249
00:14:33.368 --> 00:14:37.328
<00:14:33.368>like <00:14:33.495>once <00:14:33.622>true <00:14:33.749>or <00:14:33.877>passive <00:14:34.004>to <00:14:34.131>your <00:14:34.258>timers, <00:14:34.386>so <00:14:34.513>it <00:14:34.640>could <00:14:34.768>be

250
00:14:37.448 --> 00:14:39.828
<00:14:37.448>garbage <00:14:37.681>collected. <00:14:37.914>This <00:14:38.148>one <00:14:38.381>is <00:14:38.614>my <00:14:38.848>favorite.

251
00:14:40.128 --> 00:14:44.008
<00:14:40.128>It's <00:14:40.268>basically <00:14:40.408>every <00:14:40.548>time <00:14:40.688>when <00:14:40.828>you <00:14:40.968>assign <00:14:41.108>a <00:14:41.248>listener <00:14:41.388>to <00:14:41.528>a

252
00:14:44.068 --> 00:14:47.908
<00:14:44.068>node, <00:14:44.223>it <00:14:44.379>will <00:14:44.534>also <00:14:44.690>be <00:14:44.845>referenced <00:14:45.001>forever <00:14:45.156>despite <00:14:45.312>you <00:14:45.468>will

253
00:14:47.948 --> 00:14:51.768
<00:14:47.948>delete <00:14:48.103>the <00:14:48.259>node. <00:14:48.414>So <00:14:48.570>please, <00:14:48.725>if <00:14:48.881>you <00:14:49.036>delete <00:14:49.192>the <00:14:49.348>node,

254
00:14:52.168 --> 00:14:55.387
<00:14:52.168>don't <00:14:52.448>forget <00:14:52.728>to <00:14:53.008>clear <00:14:53.288>your <00:14:53.568>listener.

255
00:14:55.728 --> 00:14:56.148
<00:14:55.728>This <00:14:56.106>one

256
00:14:57.228 --> 00:15:00.708
<00:14:57.228>is <00:14:57.367>not <00:14:57.507>that <00:14:57.647>often <00:14:57.787>seen <00:14:57.928>in <00:14:58.068>the <00:14:58.208>wild, <00:14:58.348>but <00:14:58.488>also <00:14:58.627>important

257
00:15:01.368 --> 00:15:04.068
<00:15:01.368>if <00:15:01.568>you <00:15:01.768>would <00:15:01.968>like <00:15:02.168>to <00:15:02.368>implement <00:15:02.568>some <00:15:02.768>cache.

258
00:15:04.228 --> 00:15:07.998
<00:15:04.228>And <00:15:04.367>here <00:15:04.507>we <00:15:04.647>instantiate <00:15:04.787>our <00:15:04.928>cache <00:15:05.068>variable <00:15:05.208>in <00:15:05.348>the <00:15:05.488>global <00:15:05.627>scope.

259
00:15:08.328 --> 00:15:11.158
<00:15:08.328>And <00:15:08.468>as <00:15:08.608>we've <00:15:08.747>already <00:15:08.887>seen, <00:15:09.028>this <00:15:09.168>global <00:15:09.308>scope <00:15:09.448>will <00:15:09.588>be <00:15:09.728>always...

260
00:15:11.448 --> 00:15:14.158
<00:15:11.448>Sorry, <00:15:11.603>variable <00:15:11.759>will <00:15:11.914>be <00:15:12.070>always <00:15:12.225>referenced <00:15:12.381>by <00:15:12.536>the <00:15:12.692>global <00:15:12.848>scope.

261
00:15:15.108 --> 00:15:18.848
<00:15:15.108>So <00:15:15.247>the <00:15:15.387>solution <00:15:15.527>here <00:15:15.667>is <00:15:15.808>also <00:15:15.948>would <00:15:16.088>be <00:15:16.228>to <00:15:16.367>either <00:15:16.507>somehow

262
00:15:19.868 --> 00:15:23.608
<00:15:19.868>restrict <00:15:20.008>the <00:15:20.148>map <00:15:20.288>size, <00:15:20.428>or <00:15:20.568>please <00:15:20.708>just <00:15:20.848>use <00:15:20.988>the <00:15:21.128>library <00:15:21.268>that

263
00:15:23.628 --> 00:15:24.588
<00:15:23.628>already <00:15:24.060>implemented <00:15:24.492>it.

264
00:15:25.908 --> 00:15:26.368
<00:15:25.908>And <00:15:26.322>so

265
00:15:27.328 --> 00:15:31.268
<00:15:27.328>observed <00:15:27.455>those <00:15:27.582>bestiary <00:15:27.709>of <00:15:27.837>leaks, <00:15:27.964>I <00:15:28.091>headed <00:15:28.218>straight <00:15:28.346>to <00:15:28.473>the <00:15:28.600>city <00:15:28.728>market

266
00:15:31.328 --> 00:15:32.768
<00:15:31.328>to <00:15:31.760>weapon <00:15:32.192>myself <00:15:32.624>with

267
00:15:34.368 --> 00:15:37.108
<00:15:34.368>the <00:15:34.718>weapon <00:15:35.068>against <00:15:35.418>those <00:15:35.768>enemies.

268
00:15:37.398 --> 00:15:40.668
<00:15:37.398>So <00:15:37.631>there <00:15:37.864>are <00:15:38.098>Elven <00:15:38.331>Blades, <00:15:38.564>Vox <00:15:38.798>Securus.

269
00:15:40.788 --> 00:15:44.488
<00:15:40.788>Every <00:15:40.963>developer <00:15:41.138>knows <00:15:41.313>those <00:15:41.488>tools, <00:15:41.663>and <00:15:41.838>those <00:15:42.013>are <00:15:42.188>our

270
00:15:44.528 --> 00:15:44.968
favorite

271
00:15:46.428 --> 00:15:48.828
<00:15:46.428>dev <00:15:46.583>tools. <00:15:46.739>Yes, <00:15:46.894>and <00:15:47.050>the <00:15:47.205>phone <00:15:47.361>completely <00:15:47.516>is <00:15:47.672>broken, <00:15:47.828>sorry.

272
00:15:51.148 --> 00:15:51.608
<00:15:51.148>For <00:15:51.561>example,

273
00:15:52.448 --> 00:15:56.328
<00:15:52.448>when <00:15:52.564>detecting <00:15:52.681>a <00:15:52.798>leak, <00:15:52.914>I <00:15:53.031>often <00:15:53.148>use <00:15:53.264>the <00:15:53.381>Chrome <00:15:53.497>dev <00:15:53.614>tools <00:15:53.731>and <00:15:53.848>especially

274
00:15:56.368 --> 00:15:58.808
<00:15:56.368>the <00:15:56.648>Memory <00:15:56.928>tab. <00:15:57.208>This <00:15:57.488>is <00:15:57.768>amazingly

275
00:16:00.108 --> 00:16:00.568
effective

276
00:16:01.668 --> 00:16:05.388
<00:16:01.668>against <00:16:01.795>those <00:16:01.922>leaks. <00:16:02.049>For <00:16:02.177>example, <00:16:02.304>here <00:16:02.431>we <00:16:02.558>could <00:16:02.686>make <00:16:02.813>a <00:16:02.940>snapshot <00:16:03.068>with

277
00:16:05.608 --> 00:16:09.108
<00:16:05.608>all <00:16:05.808>the <00:16:06.007>references <00:16:06.208>and <00:16:06.407>all <00:16:06.608>nodes <00:16:06.808>and <00:16:07.007>their

278
00:16:09.128 --> 00:16:12.708
<00:16:09.128>sizes <00:16:09.303>shown <00:16:09.478>there. <00:16:09.653>The <00:16:09.828>second <00:16:10.003>tool <00:16:10.178>here <00:16:10.353>is <00:16:10.528>the

279
00:16:12.748 --> 00:16:16.628
<00:16:12.748>allocation <00:16:12.981>timeline. <00:16:13.214>Also <00:16:13.448>very <00:16:13.681>useful <00:16:13.914>when <00:16:14.148>you're

280
00:16:16.668 --> 00:16:19.588
<00:16:16.668>trying <00:16:16.843>to <00:16:17.018>detect <00:16:17.193>them. <00:16:17.368>Then <00:16:17.543>goes <00:16:17.718>the <00:16:17.893>Performance <00:16:18.068>tab.

281
00:16:20.508 --> 00:16:22.408
<00:16:20.508>Here <00:16:20.741>you <00:16:20.974>could <00:16:21.208>see <00:16:21.441>the <00:16:21.674>heap <00:16:21.908>allocations.

282
00:16:22.508 --> 00:16:25.988
<00:16:22.508>Of <00:16:22.624>course, <00:16:22.741>you <00:16:22.858>need <00:16:22.974>to <00:16:23.091>click <00:16:23.208>the <00:16:23.324>Memory <00:16:23.441>checkbox <00:16:23.558>on <00:16:23.674>the <00:16:23.791>top <00:16:23.908>bar.

283
00:16:26.428 --> 00:16:27.648
<00:16:26.428>This <00:16:26.702>will <00:16:26.977>also <00:16:27.251>be <00:16:27.526>useful.

284
00:16:29.668 --> 00:16:30.028
<00:16:29.668>I'm <00:16:29.992>sorry.

285
00:16:31.128 --> 00:16:35.117
<00:16:31.128>Then <00:16:31.283>goes <00:16:31.439>the <00:16:31.594>tools <00:16:31.750>that <00:16:31.905>I <00:16:32.061>didn't <00:16:32.216>use <00:16:32.372>often, <00:16:32.528>but

286
00:16:35.208 --> 00:16:38.988
<00:16:35.208>I <00:16:35.308>would <00:16:35.408>like <00:16:35.507>to <00:16:35.608>equip <00:16:35.708>you <00:16:35.808>with <00:16:35.908>those, <00:16:36.007>and <00:16:36.108>I <00:16:36.208>would <00:16:36.308>be <00:16:36.408>glad <00:16:36.507>if <00:16:36.608>I

287
00:16:39.088 --> 00:16:42.768
<00:16:39.088>would <00:16:39.262>know <00:16:39.438>about <00:16:39.613>them. <00:16:39.788>For <00:16:39.963>example, <00:16:40.137>cleaning <00:16:40.313>JS <00:16:40.488>library.

288
00:16:43.208 --> 00:16:46.948
<00:16:43.208>It <00:16:43.324>allows <00:16:43.441>you <00:16:43.558>to <00:16:43.674>make <00:16:43.791>flame <00:16:43.908>graphs <00:16:44.024>to <00:16:44.141>see <00:16:44.257>your <00:16:44.374>garbage <00:16:44.491>collector <00:16:44.608>behavior.

289
00:16:47.318 --> 00:16:50.888
<00:16:47.318>That <00:16:47.458>would <00:16:47.598>be <00:16:47.738>extremely <00:16:47.877>helpful. <00:16:48.018>Then <00:16:48.158>goes <00:16:48.298>this <00:16:48.438>very <00:16:48.578>simple <00:16:48.718>tool.

290
00:16:50.968 --> 00:16:53.828
<00:16:50.968>You <00:16:51.108>could <00:16:51.247>just <00:16:51.387>create <00:16:51.527>a <00:16:51.668>heap <00:16:51.808>dump <00:16:51.948>in <00:16:52.088>your <00:16:52.228>code <00:16:52.367>directly.

291
00:16:54.468 --> 00:16:58.288
<00:16:54.468>Of <00:16:54.595>course, <00:16:54.722>I <00:16:54.849>can't <00:16:54.977>not <00:16:55.104>tell <00:16:55.231>about <00:16:55.358>dev <00:16:55.486>tools <00:16:55.613>from <00:16:55.740>the <00:16:55.867>specific

292
00:16:58.308 --> 00:16:59.288
<00:16:58.308>frameworks. <00:16:58.749>For <00:16:59.190>example,

293
00:17:00.528 --> 00:17:04.248
<00:17:00.528>Vue <00:17:00.615>dev <00:17:00.703>tools <00:17:00.790>helped <00:17:00.878>me <00:17:00.965>a <00:17:01.053>lot <00:17:01.140>because <00:17:01.228>it <00:17:01.315>just <00:17:01.403>crashed <00:17:01.490>in <00:17:01.578>my <00:17:01.665>browser, <00:17:01.753>so <00:17:01.840>I <00:17:01.928>got

294
00:17:04.408 --> 00:17:07.929
<00:17:04.407>instantly <00:17:04.582>aware <00:17:04.757>that <00:17:04.933>the <00:17:05.108>problem <00:17:05.282>is <00:17:05.457>in <00:17:05.632>our <00:17:05.808>components.

295
00:17:08.088 --> 00:17:10.729
<00:17:08.088>React <00:17:08.367>and <00:17:08.647>Elual <00:17:08.927>provides <00:17:09.207>something <00:17:09.488>similar.

296
00:17:11.368 --> 00:17:14.988
<00:17:11.367>And <00:17:11.508>then <00:17:11.647>we <00:17:11.788>have <00:17:11.927>Task <00:17:12.068>Manager. <00:17:12.207>If <00:17:12.348>you <00:17:12.487>press <00:17:12.627>Shift <00:17:12.768>plus

297
00:17:15.048 --> 00:17:18.908
<00:17:15.048>Escape <00:17:15.188>in <00:17:15.328>your <00:17:15.468>browser, <00:17:15.608>it <00:17:15.748>will <00:17:15.887>show <00:17:16.028>you <00:17:16.167>all <00:17:16.308>the <00:17:16.448>memory,

298
00:17:19.028 --> 00:17:21.588
<00:17:19.028>CPU <00:17:19.203>consumption <00:17:19.377>of <00:17:19.553>the <00:17:19.728>tabs. <00:17:19.903>But <00:17:20.078>that <00:17:20.252>note <00:17:20.428>was

299
00:17:22.528 --> 00:17:26.408
<00:17:22.528>not <00:17:22.655>very <00:17:22.782>useful <00:17:22.909>for <00:17:23.037>me <00:17:23.164>in <00:17:23.291>my <00:17:23.418>case, <00:17:23.546>as <00:17:23.673>I've <00:17:23.800>known <00:17:23.928>which

300
00:17:26.808 --> 00:17:28.708
<00:17:26.808>tab <00:17:27.088>is <00:17:27.367>leaking. <00:17:27.647>Also, <00:17:27.927>you <00:17:28.208>could

301
00:17:30.008 --> 00:17:32.128
<00:17:30.008>see <00:17:30.241>the <00:17:30.474>CPU <00:17:30.708>consumption <00:17:30.941>in <00:17:31.174>your <00:17:31.408>htop.

302
00:17:32.548 --> 00:17:34.728
<00:17:32.548>And <00:17:32.748>this <00:17:32.948>one <00:17:33.148>was <00:17:33.348>very <00:17:33.548>useful <00:17:33.748>for <00:17:33.948>me

303
00:17:35.568 --> 00:17:36.528
<00:17:35.568>because <00:17:36.000>it <00:17:36.432>basically,

304
00:17:37.768 --> 00:17:40.288
<00:17:37.768>yeah, <00:17:38.001>shows <00:17:38.234>in <00:17:38.468>the <00:17:38.701>exact <00:17:38.934>code. <00:17:39.168>So

305
00:17:41.188 --> 00:17:45.008
<00:17:41.188>equipped <00:17:41.295>with <00:17:41.403>the <00:17:41.511>shiny <00:17:41.618>armor <00:17:41.726>and <00:17:41.834>the <00:17:41.941>best <00:17:42.049>elven <00:17:42.157>sword, <00:17:42.264>I <00:17:42.372>am <00:17:42.480>ready <00:17:42.588>to

306
00:17:45.048 --> 00:17:46.088
<00:17:45.048>conquer <00:17:45.516>my <00:17:45.984>enemies.

307
00:17:47.408 --> 00:17:51.328
<00:17:47.408>And <00:17:47.563>so <00:17:47.719>I <00:17:47.874>just <00:17:48.030>jumped <00:17:48.185>into <00:17:48.341>the <00:17:48.496>fixing <00:17:48.652>my <00:17:48.808>application.

308
00:17:51.368 --> 00:17:54.888
<00:17:51.368>And <00:17:51.543>first, <00:17:51.717>what <00:17:51.893>I've <00:17:52.068>seen <00:17:52.243>is <00:17:52.418>the <00:17:52.592>huge, <00:17:52.768>huge

309
00:17:54.928 --> 00:17:58.128
<00:17:54.928>allocations <00:17:55.161>and <00:17:55.394>huge <00:17:55.628>nodes <00:17:55.861>creation <00:17:56.094>in <00:17:56.328>there.

310
00:17:58.928 --> 00:18:02.888
<00:17:58.928>The <00:17:59.068>application <00:17:59.207>was <00:17:59.348>structured <00:17:59.487>in <00:17:59.628>a <00:17:59.767>way <00:17:59.908>that <00:18:00.047>we <00:18:00.187>had <00:18:00.328>polling

311
00:18:02.968 --> 00:18:06.648
<00:18:02.968>every <00:18:03.108>10 <00:18:03.248>seconds, <00:18:03.388>and <00:18:03.528>every <00:18:03.668>10 <00:18:03.808>seconds, <00:18:03.948>all <00:18:04.088>those <00:18:04.228>tables <00:18:04.368>were

312
00:18:06.688 --> 00:18:07.168
rendered.

313
00:18:08.348 --> 00:18:12.208
<00:18:08.348>And <00:18:08.447>of <00:18:08.548>course, <00:18:08.648>you <00:18:08.748>could <00:18:08.848>imagine <00:18:08.947>that <00:18:09.048>there <00:18:09.148>were <00:18:09.248>just <00:18:09.348>a <00:18:09.447>chaos <00:18:09.548>in <00:18:09.648>those <00:18:09.748>allocated

314
00:18:12.268 --> 00:18:16.108
<00:18:12.268>objects. <00:18:12.384>So <00:18:12.501>what <00:18:12.618>I <00:18:12.734>did <00:18:12.851>first, <00:18:12.968>I <00:18:13.084>tried <00:18:13.201>to <00:18:13.318>a <00:18:13.434>bit <00:18:13.551>structure <00:18:13.668>it,

315
00:18:16.288 --> 00:18:20.168
<00:18:16.288>and <00:18:16.415>I <00:18:16.542>put <00:18:16.669>this <00:18:16.797>simple <00:18:16.924>function. <00:18:17.051>So <00:18:17.178>with <00:18:17.306>the <00:18:17.433>help <00:18:17.560>of <00:18:17.688>lodash

316
00:18:20.228 --> 00:18:24.220
<00:18:20.228>is <00:18:20.344>equal, <00:18:20.461>I <00:18:20.578>wanted <00:18:20.694>to <00:18:20.811>see <00:18:20.928>if <00:18:21.044>the <00:18:21.161>data <00:18:21.278>that <00:18:21.394>is <00:18:21.511>fetched <00:18:21.628>...

317
00:18:24.230 --> 00:18:27.560
<00:18:24.230>is <00:18:24.337>the <00:18:24.445>same <00:18:24.553>as <00:18:24.660>we <00:18:24.768>already <00:18:24.876>have, <00:18:24.983>and <00:18:25.091>if <00:18:25.199>yes, <00:18:25.306>we <00:18:25.414>just <00:18:25.522>don't <00:18:25.630>do

318
00:18:28.720 --> 00:18:29.070
anything.

319
00:18:30.780 --> 00:18:32.580
<00:18:30.780>And <00:18:31.129>as <00:18:31.480>I <00:18:31.830>already <00:18:32.180>said,

320
00:18:33.580 --> 00:18:36.880
<00:18:33.580>Vue <00:18:33.720>DevTools <00:18:33.860>helped <00:18:34.000>me <00:18:34.139>a <00:18:34.280>lot <00:18:34.419>as <00:18:34.560>just <00:18:34.699>imagine <00:18:34.840>the <00:18:34.980>situation.

321
00:18:37.240 --> 00:18:40.860
<00:18:37.240>You <00:18:37.367>have <00:18:37.494>polling <00:18:37.621>every <00:18:37.749>10 <00:18:37.876>seconds, <00:18:38.003>everything <00:18:38.130>is <00:18:38.258>rendered, <00:18:38.385>and <00:18:38.512>everything's <00:18:38.640>just

322
00:18:40.880 --> 00:18:44.800
<00:18:40.880>piled <00:18:40.980>up. <00:18:41.080>And <00:18:41.180>so <00:18:41.280>as <00:18:41.380>soon <00:18:41.480>as <00:18:41.580>I <00:18:41.680>opened <00:18:41.780>this <00:18:41.880>components <00:18:41.980>tab <00:18:42.080>in <00:18:42.180>my <00:18:42.280>Vue

323
00:18:44.840 --> 00:18:46.880
<00:18:44.840>DevTools, <00:18:45.189>it <00:18:45.540>was <00:18:45.889>instant <00:18:46.240>crashed.

324
00:18:48.020 --> 00:18:51.520
<00:18:48.020>That <00:18:48.195>gave <00:18:48.370>me <00:18:48.545>a <00:18:48.720>glance <00:18:48.895>of <00:18:49.070>it, <00:18:49.245>so <00:18:49.420>I

325
00:18:51.580 --> 00:18:54.180
<00:18:51.580>instantly <00:18:51.860>started <00:18:52.139>to <00:18:52.419>look <00:18:52.699>for <00:18:52.980>my

326
00:18:55.820 --> 00:18:59.700
<00:18:55.820>components. <00:18:55.995>And <00:18:56.169>what <00:18:56.345>I've <00:18:56.520>seen <00:18:56.695>from <00:18:56.870>the <00:18:57.044>library <00:18:57.220>that

327
00:18:59.760 --> 00:19:01.600
<00:18:59.760>we <00:18:59.935>use <00:19:00.110>for <00:19:00.285>the <00:19:00.460>tables, <00:19:00.635>there <00:19:00.810>was <00:19:00.985>a <00:19:01.160>problem.

328
00:19:02.040 --> 00:19:04.780
<00:19:02.040>So <00:19:02.195>imagine <00:19:02.351>that <00:19:02.506>you <00:19:02.662>have <00:19:02.817>a <00:19:02.973>table, <00:19:03.128>then <00:19:03.284>you <00:19:03.440>have

329
00:19:07.680 --> 00:19:11.440
<00:19:07.680>custom <00:19:07.913>components <00:19:08.146>for <00:19:08.380>cells. <00:19:08.613>In <00:19:08.846>this <00:19:09.080>case,

330
00:19:11.520 --> 00:19:15.380
<00:19:11.520>it's <00:19:11.660>just <00:19:11.800>a <00:19:11.940>simple <00:19:12.080>reproduction <00:19:12.220>that <00:19:12.360>we <00:19:12.500>have <00:19:12.639>a <00:19:12.780>bold <00:19:12.920>custom

331
00:19:15.420 --> 00:19:19.240
<00:19:15.420>cell <00:19:15.620>component. <00:19:15.820>And <00:19:16.020>with <00:19:16.220>every <00:19:16.420>render, <00:19:16.620>basically, <00:19:16.820>the

332
00:19:19.280 --> 00:19:21.640
<00:19:19.280>cell <00:19:19.513>piled <00:19:19.746>up <00:19:19.980>and <00:19:20.213>never <00:19:20.446>been <00:19:20.680>freed.

333
00:19:22.440 --> 00:19:26.400
<00:19:22.440>So <00:19:22.556>I <00:19:22.673>wrote <00:19:22.790>up <00:19:22.906>to <00:19:23.023>the <00:19:23.140>guys <00:19:23.256>who <00:19:23.373>created <00:19:23.490>the <00:19:23.606>small <00:19:23.723>reproduction, <00:19:23.840>and

334
00:19:27.220 --> 00:19:30.820
<00:19:27.220>thankfully, <00:19:27.327>I <00:19:27.435>got <00:19:27.543>the <00:19:27.650>result <00:19:27.758>that, <00:19:27.866>"Yes, <00:19:27.973>sorry, <00:19:28.081>we <00:19:28.189>found <00:19:28.296>the <00:19:28.404>bug <00:19:28.512>and <00:19:28.620>please

335
00:19:31.400 --> 00:19:32.840
<00:19:31.400>take <00:19:31.659>attention <00:19:31.918>to <00:19:32.177>the <00:19:32.436>root <00:19:32.696>cause."

336
00:19:34.280 --> 00:19:36.540
<00:19:34.280>The <00:19:34.513>template <00:19:34.746>instance <00:19:34.980>was <00:19:35.213>never <00:19:35.446>being <00:19:35.680>destroyed.

337
00:19:36.700 --> 00:19:38.420
<00:19:36.700>That's <00:19:36.980>what <00:19:37.260>I'm <00:19:37.540>talking <00:19:37.820>about <00:19:38.100>when

338
00:19:39.320 --> 00:19:41.120
<00:19:39.320>talked <00:19:39.600>about <00:19:39.879>my <00:19:40.159>favorite <00:19:40.439>memory <00:19:40.720>leak.

339
00:19:42.100 --> 00:19:45.560
<00:19:42.100>Then <00:19:42.240>one <00:19:42.379>could <00:19:42.520>say <00:19:42.659>that, <00:19:42.800>okay, <00:19:42.939>the <00:19:43.080>final <00:19:43.219>solution <00:19:43.360>is <00:19:43.500>done.

340
00:19:46.640 --> 00:19:50.580
<00:19:46.640>But <00:19:46.747>I <00:19:46.855>was <00:19:46.963>very <00:19:47.070>amazed <00:19:47.178>when <00:19:47.286>I <00:19:47.393>found <00:19:47.501>the <00:19:47.609>second <00:19:47.716>memory <00:19:47.824>leak <00:19:47.932>in <00:19:48.040>this

341
00:19:51.440 --> 00:19:54.460
<00:19:51.440>very <00:19:51.640>thin <00:19:51.840>bar <00:19:52.040>component. <00:19:52.240>That's <00:19:52.440>actually <00:19:52.640>a <00:19:52.840>splitter.

342
00:19:55.320 --> 00:19:58.280
<00:19:55.320>And <00:19:55.495>what <00:19:55.669>happened, <00:19:55.845>basically, <00:19:56.020>when <00:19:56.195>you <00:19:56.370>do <00:19:56.544>splitter, <00:19:56.720>you

343
00:19:59.080 --> 00:20:02.680
<00:19:59.080>divide <00:19:59.313>into <00:19:59.546>two <00:19:59.780>panes <00:20:00.013>your <00:20:00.246>UI, <00:20:00.480>and

344
00:20:02.840 --> 00:20:06.320
<00:20:02.840>in <00:20:02.995>my <00:20:03.151>case, <00:20:03.306>each <00:20:03.462>UI <00:20:03.617>and <00:20:03.773>every <00:20:03.928>reactive <00:20:04.084>interaction <00:20:04.240>was

345
00:20:06.420 --> 00:20:09.740
<00:20:06.420>duplicated. <00:20:06.653>So <00:20:06.886>I <00:20:07.120>observed <00:20:07.353>it <00:20:07.586>in <00:20:07.820>my

346
00:20:10.940 --> 00:20:14.720
<00:20:10.940>network <00:20:11.095>tab. <00:20:11.251>So <00:20:11.406>anytime <00:20:11.562>I <00:20:11.717>do <00:20:11.873>some <00:20:12.028>interaction, <00:20:12.184>I <00:20:12.340>just

347
00:20:14.780 --> 00:20:17.580
<00:20:14.780>seen <00:20:15.013>how <00:20:15.246>my <00:20:15.480>network <00:20:15.713>request <00:20:15.946>piled <00:20:16.180>up.

348
00:20:17.640 --> 00:20:20.960
<00:20:17.640>So <00:20:17.767>first <00:20:17.894>I <00:20:18.021>seen <00:20:18.149>one, <00:20:18.276>two, <00:20:18.403>four, <00:20:18.530>and <00:20:18.658>eight, <00:20:18.785>and <00:20:18.912>so <00:20:19.040>on.

349
00:20:22.080 --> 00:20:25.820
<00:20:22.080>And <00:20:22.220>yes, <00:20:22.360>I <00:20:22.500>wrote <00:20:22.639>again <00:20:22.780>to <00:20:22.919>the <00:20:23.060>guys <00:20:23.199>and <00:20:23.340>asking <00:20:23.480>them,

350
00:20:25.980 --> 00:20:29.280
<00:20:25.980>"Please <00:20:26.107>take <00:20:26.234>a <00:20:26.361>look <00:20:26.489>with <00:20:26.616>the <00:20:26.743>small <00:20:26.870>reproduction." <00:20:26.998>And <00:20:27.125>again, <00:20:27.252>the <00:20:27.380>root

351
00:20:29.340 --> 00:20:33.180
<00:20:29.340>cause <00:20:29.573>was <00:20:29.806>like, <00:20:30.040>"Oh, <00:20:30.273>we <00:20:30.506>forgot <00:20:30.740>to

352
00:20:33.219 --> 00:20:34.400
<00:20:33.219>clear <00:20:33.750>our <00:20:34.281>templates."

353
00:20:35.480 --> 00:20:39.340
<00:20:35.480>So <00:20:35.607>that's <00:20:35.734>why <00:20:35.861>it's <00:20:35.989>the <00:20:36.116>most <00:20:36.243>why <00:20:36.370>I <00:20:36.498>like <00:20:36.625>the <00:20:36.752>definition <00:20:36.880>of

354
00:20:39.380 --> 00:20:43.200
<00:20:39.380>the <00:20:39.520>AWAS <00:20:39.660>foundation, <00:20:39.800>that <00:20:39.940>basically, <00:20:40.080>the <00:20:40.220>most <00:20:40.360>of <00:20:40.500>the <00:20:40.640>time, <00:20:40.780>the

355
00:20:43.240 --> 00:20:47.140
<00:20:43.240>problem <00:20:43.473>is <00:20:43.706>the <00:20:43.940>forgetance <00:20:44.173>of <00:20:44.406>the <00:20:44.640>clearing

356
00:20:47.200 --> 00:20:49.300
<00:20:47.200>of <00:20:47.433>those <00:20:47.666>nodes <00:20:47.900>and <00:20:48.133>of <00:20:48.366>those <00:20:48.600>variables.

357
00:20:50.020 --> 00:20:51.580
<00:20:50.020>And <00:20:50.220>in <00:20:50.420>the <00:20:50.620>end, <00:20:50.820>I <00:20:51.020>would <00:20:51.220>like <00:20:51.420>to

358
00:20:53.260 --> 00:20:56.980
<00:20:53.260>wish <00:20:53.387>you <00:20:53.514>remember <00:20:53.641>the <00:20:53.769>sacred <00:20:53.896>knowledge, <00:20:54.023>free <00:20:54.150>your <00:20:54.278>memory, <00:20:54.405>and <00:20:54.532>stay <00:20:54.660>safe.

359
00:20:57.720 --> 00:20:59.140
<00:20:57.720>Thank <00:20:58.146>you <00:20:58.572>for <00:20:58.998>listening.