WEBVTT

1
00:00:03.225 --> 00:00:03.885
<00:00:03.225>Hi <00:00:03.819>everyone.

2
00:00:04.865 --> 00:00:08.805
<00:00:04.865>My <00:00:05.040>name <00:00:05.215>is <00:00:05.390>Eileen <00:00:05.565>and <00:00:05.740>I <00:00:05.915>like <00:00:06.090>to <00:00:06.265>drink.

3
00:00:10.425 --> 00:00:13.325
<00:00:10.425>Now, <00:00:10.600>this <00:00:10.775>doesn't <00:00:10.950>make <00:00:11.125>me <00:00:11.300>an <00:00:11.475>alcoholic, <00:00:11.650>I <00:00:11.825>hope,

4
00:00:13.825 --> 00:00:17.085
<00:00:13.825>but <00:00:13.980>it <00:00:14.136>does <00:00:14.291>make <00:00:14.447>me <00:00:14.602>someone <00:00:14.758>who <00:00:14.913>enjoys, <00:00:15.069>uh, <00:00:15.225>going

5
00:00:17.085 --> 00:00:19.765
<00:00:17.085>to <00:00:17.212>a <00:00:17.339>bar <00:00:17.466>here <00:00:17.594>and <00:00:17.721>there, <00:00:17.848>having <00:00:17.975>a <00:00:18.103>chat <00:00:18.230>with <00:00:18.357>some <00:00:18.485>friends,

6
00:00:20.305 --> 00:00:22.205
<00:00:20.305>and, <00:00:20.538>uh, <00:00:20.771>just <00:00:21.005>having <00:00:21.238>a <00:00:21.471>good <00:00:21.705>time.

7
00:00:23.225 --> 00:00:25.285
<00:00:23.225>So <00:00:23.380>let's <00:00:23.536>get <00:00:23.691>to <00:00:23.847>know <00:00:24.002>each <00:00:24.158>other <00:00:24.313>a <00:00:24.469>bit <00:00:24.625>better.

8
00:00:25.665 --> 00:00:27.885
<00:00:25.665>Please <00:00:25.898>raise <00:00:26.131>your <00:00:26.365>hand <00:00:26.598>if <00:00:26.831>you <00:00:27.064>agree.

9
00:00:28.465 --> 00:00:31.685
<00:00:28.465>Uh, <00:00:28.640>who <00:00:28.815>here <00:00:28.990>likes <00:00:29.165>to <00:00:29.340>go <00:00:29.515>to <00:00:29.690>bars <00:00:29.865>sometimes

10
00:00:32.065 --> 00:00:33.725
<00:00:32.064>and <00:00:32.298>have <00:00:32.531>a <00:00:32.765>couple <00:00:32.998>of <00:00:33.231>drinks <00:00:33.464>there?

11
00:00:34.415 --> 00:00:38.085
<00:00:34.415>Raise <00:00:34.589>your <00:00:34.765>hands. <00:00:34.940>Uh, <00:00:35.115>it's <00:00:35.290>nice, <00:00:35.464>you're <00:00:35.640>my <00:00:35.815>people.

12
00:00:38.985 --> 00:00:41.925
<00:00:38.985>Um, <00:00:39.265>then <00:00:39.545>another <00:00:39.825>question <00:00:40.105>to <00:00:40.385>you,

13
00:00:42.105 --> 00:00:45.045
<00:00:42.105>please <00:00:42.245>also <00:00:42.385>raise <00:00:42.525>your <00:00:42.665>hand <00:00:42.805>if <00:00:42.944>you <00:00:43.084>were <00:00:43.224>ever <00:00:43.364>in <00:00:43.504>the

14
00:00:45.325 --> 00:00:47.725
<00:00:45.325>situation <00:00:45.480>where <00:00:45.636>you're <00:00:45.791>in <00:00:45.947>a <00:00:46.102>bar <00:00:46.258>and <00:00:46.413>the <00:00:46.569>waiter <00:00:46.725>comes

15
00:00:47.865 --> 00:00:49.485
<00:00:47.865>and <00:00:48.065>you <00:00:48.265>are <00:00:48.465>like <00:00:48.665>chatting <00:00:48.865>with <00:00:49.065>your <00:00:49.265>friends

16
00:00:49.505 --> 00:00:50.645
<00:00:49.505>and <00:00:49.710>you're <00:00:49.915>busy <00:00:50.120>with <00:00:50.325>other <00:00:50.531>things.

17
00:00:50.665 --> 00:00:53.245
<00:00:50.665>And <00:00:50.792>then <00:00:50.919>he <00:00:51.046>asks <00:00:51.174>you, <00:00:51.301>what <00:00:51.428>would <00:00:51.555>you <00:00:51.683>like <00:00:51.810>to <00:00:51.937>try <00:00:52.065>next?

18
00:00:53.245 --> 00:00:54.805
<00:00:53.245>Which <00:00:53.478>wine <00:00:53.711>would <00:00:53.945>you <00:00:54.178>like <00:00:54.411>to <00:00:54.644>order?

19
00:00:55.585 --> 00:00:58.005
<00:00:55.585>And <00:00:55.740>you're <00:00:55.896>like, <00:00:56.051>I <00:00:56.207>don't <00:00:56.362>really <00:00:56.518>know. <00:00:56.673>I'm <00:00:56.829>so <00:00:56.985>indecisive.

20
00:00:58.545 --> 00:01:00.445
<00:00:58.545>Did <00:00:58.720>this <00:00:58.895>ever <00:00:59.070>happen <00:00:59.245>to <00:00:59.420>you? <00:00:59.595>Raise <00:00:59.770>your <00:00:59.945>hand.

21
00:01:02.275 --> 00:01:05.405
<00:01:02.275>Alright, <00:01:02.402>I <00:01:02.529>can <00:01:02.656>see <00:01:02.784>a <00:01:02.911>couple <00:01:03.038>of <00:01:03.165>people <00:01:03.293>that <00:01:03.420>makes <00:01:03.547>me <00:01:03.675>happy

22
00:01:05.405 --> 00:01:07.765
<00:01:05.405>because <00:01:05.580>you <00:01:05.755>folks <00:01:05.930>and <00:01:06.105>me, <00:01:06.280>we <00:01:06.455>are <00:01:06.630>very <00:01:06.805>similar.

23
00:01:10.115 --> 00:01:11.845
<00:01:10.115>Picture <00:01:10.348>this, <00:01:10.581>I'm <00:01:10.815>out <00:01:11.048>with <00:01:11.281>my <00:01:11.515>friends.

24
00:01:11.945 --> 00:01:13.765
<00:01:11.945>The <00:01:12.178>waiter <00:01:12.411>comes <00:01:12.645>and <00:01:12.878>he <00:01:13.111>asked <00:01:13.345>me,

25
00:01:14.235 --> 00:01:15.565
<00:01:14.235>what <00:01:14.474>wine <00:01:14.713>do <00:01:14.953>you <00:01:15.192>wanna <00:01:15.432>try?

26
00:01:15.865 --> 00:01:17.325
<00:01:15.865>I'm <00:01:16.127>like, <00:01:16.390>I <00:01:16.653>have <00:01:16.916>no <00:01:17.179>idea.

27
00:01:17.995 --> 00:01:20.565
<00:01:17.995>It's <00:01:18.228>the <00:01:18.461>same <00:01:18.695>level <00:01:18.928>of <00:01:19.161>being <00:01:19.395>indecisive

28
00:01:20.745 --> 00:01:23.805
<00:01:20.745>as <00:01:20.872>when <00:01:20.999>I'm <00:01:21.126>sometimes <00:01:21.254>coding <00:01:21.381>and <00:01:21.508>I <00:01:21.635>have <00:01:21.763>to <00:01:21.890>name <00:01:22.017>a <00:01:22.145>variable.

29
00:01:24.665 --> 00:01:28.765
<00:01:24.664>So <00:01:25.014>stressful. <00:01:25.365>But <00:01:25.714>Lucky <00:01:26.065>enough,

30
00:01:28.945 --> 00:01:30.325
<00:01:28.945>I'm <00:01:29.255>also <00:01:29.566>a <00:01:29.876>software <00:01:30.187>engineer.

31
00:01:30.905 --> 00:01:34.845
<00:01:30.905>And <00:01:31.045>with <00:01:31.185>that, <00:01:31.325>I <00:01:31.465>decided <00:01:31.605>to <00:01:31.745>tackle <00:01:31.885>this <00:01:32.025>problem <00:01:32.165>hands <00:01:32.305>on

32
00:01:35.425 --> 00:01:38.925
<00:01:35.425>by <00:01:35.600>developing <00:01:35.774>an <00:01:35.950>application <00:01:36.125>that <00:01:36.300>would <00:01:36.475>shuffle <00:01:36.649>the <00:01:36.825>menu

33
00:01:38.985 --> 00:01:41.805
<00:01:38.985>of <00:01:39.140>my <00:01:39.296>favorite <00:01:39.451>wine <00:01:39.607>bar <00:01:39.762>so <00:01:39.918>that <00:01:40.073>I <00:01:40.229>wouldn't <00:01:40.385>have

34
00:01:41.805 --> 00:01:42.885
<00:01:41.805>to <00:01:42.048>make <00:01:42.291>a <00:01:42.533>decision <00:01:42.776>anymore.

35
00:01:46.785 --> 00:01:49.205
<00:01:46.785>Now, <00:01:46.940>for <00:01:47.096>me, <00:01:47.251>this <00:01:47.407>was <00:01:47.562>like <00:01:47.718>a <00:01:47.873>win-win <00:01:48.029>win <00:01:48.185>situation.

36
00:01:50.025 --> 00:01:52.645
<00:01:50.025>Um, <00:01:50.180>I <00:01:50.336>would <00:01:50.491>get <00:01:50.647>the <00:01:50.802>chance <00:01:50.958>to <00:01:51.113>try <00:01:51.269>new <00:01:51.425>wines.

37
00:01:53.725 --> 00:01:56.405
<00:01:53.725>I <00:01:53.865>would <00:01:54.005>be <00:01:54.145>relieved <00:01:54.285>from <00:01:54.425>the <00:01:54.565>burden <00:01:54.705>of <00:01:54.845>making <00:01:54.985>a <00:01:55.125>decision.

38
00:01:57.825 --> 00:02:01.645
<00:01:57.825>And <00:01:58.025>most <00:01:58.225>importantly, <00:01:58.425>I <00:01:58.625>could <00:01:58.825>impress <00:01:59.025>my <00:01:59.225>friends.

39
00:02:03.185 --> 00:02:07.445
<00:02:03.185>But <00:02:03.385>to <00:02:03.585>impress <00:02:03.785>my <00:02:03.985>friends <00:02:04.185>properly, <00:02:04.385>of <00:02:04.585>course,

40
00:02:08.325 --> 00:02:10.285
<00:02:08.324>I <00:02:08.524>had <00:02:08.725>to <00:02:08.924>make <00:02:09.125>sure <00:02:09.324>that <00:02:09.524>my <00:02:09.725>application

41
00:02:10.285 --> 00:02:11.925
<00:02:10.285>would <00:02:10.751>actually <00:02:11.218>perform <00:02:11.685>well.

42
00:02:12.985 --> 00:02:17.925
<00:02:12.985>So <00:02:13.112>what <00:02:13.239>did <00:02:13.366>I <00:02:13.494>do? <00:02:13.621>Well, <00:02:13.748>I <00:02:13.875>started <00:02:14.003>scribbling <00:02:14.130>a <00:02:14.257>ice <00:02:14.385>design

43
00:02:19.705 --> 00:02:22.325
<00:02:19.704>and <00:02:19.984>I <00:02:20.265>implemented <00:02:20.545>it <00:02:20.825>using <00:02:21.105>TypeScript,

44
00:02:23.015 --> 00:02:25.725
<00:02:23.015>using <00:02:23.481>next <00:02:23.948>Js <00:02:24.415>tailwind.

45
00:02:27.065 --> 00:02:29.605
<00:02:27.065>And <00:02:27.265>as <00:02:27.465>I'm <00:02:27.665>a <00:02:27.865>developer <00:02:28.065>coffee <00:02:28.265>of <00:02:28.465>course.

46
00:02:30.705 --> 00:02:32.725
<00:02:30.704>And <00:02:30.880>then <00:02:31.054>I <00:02:31.230>went <00:02:31.404>to <00:02:31.579>the <00:02:31.755>Google <00:02:31.929>Chrome <00:02:32.105>browser

47
00:02:33.305 --> 00:02:36.485
<00:02:33.305>and <00:02:33.538>I <00:02:33.771>performed, <00:02:34.005>uh, <00:02:34.238>a <00:02:34.471>performance <00:02:34.705>check.

48
00:02:38.265 --> 00:02:39.525
<00:02:38.265>And <00:02:38.453>this <00:02:38.643>is <00:02:38.832>how <00:02:39.021>it <00:02:39.210>turned <00:02:39.399>out.

49
00:02:40.425 --> 00:02:44.965
<00:02:40.425>So <00:02:40.565>I <00:02:40.705>reached <00:02:40.845>the <00:02:40.985>performance <00:02:41.125>score <00:02:41.265>of <00:02:41.405>52 <00:02:41.545>only, <00:02:41.685>which <00:02:41.825>is

50
00:02:45.485 --> 00:02:48.205
<00:02:45.485>honestly <00:02:45.835>not <00:02:46.185>my <00:02:46.535>best <00:02:46.885>work

51
00:02:56.225 --> 00:03:00.205
<00:02:56.225>now <00:02:56.380>because <00:02:56.536>I <00:02:56.691>want <00:02:56.847>this <00:02:57.002>to <00:02:57.158>be <00:02:57.313>an <00:02:57.469>interactive <00:02:57.625>session

52
00:03:00.985 --> 00:03:02.765
<00:03:00.985>and <00:03:01.185>I <00:03:01.385>want <00:03:01.585>you <00:03:01.785>to <00:03:01.985>feel <00:03:02.185>my <00:03:02.385>frustration.

53
00:03:03.405 --> 00:03:05.485
<00:03:03.405>I <00:03:03.580>would <00:03:03.755>like <00:03:03.930>you <00:03:04.105>to <00:03:04.280>participate <00:03:04.455>a <00:03:04.630>bit <00:03:04.805>now.

54
00:03:05.985 --> 00:03:08.845
<00:03:05.985>So <00:03:06.101>if <00:03:06.218>I <00:03:06.335>ask <00:03:06.451>you <00:03:06.568>a <00:03:06.685>question, <00:03:06.801>please <00:03:06.918>shout <00:03:07.035>the <00:03:07.151>answer <00:03:07.268>to <00:03:07.385>me

55
00:03:09.545 --> 00:03:11.685
<00:03:09.545>and <00:03:09.684>uh, <00:03:09.825>no <00:03:09.964>worries, <00:03:10.105>you'll <00:03:10.244>find <00:03:10.385>the <00:03:10.524>answer <00:03:10.665>on <00:03:10.804>the <00:03:10.945>slides.

56
00:03:12.865 --> 00:03:14.245
<00:03:12.865>So <00:03:14.107>remember,

57
00:03:14.405 --> 00:03:17.165
<00:03:14.405>I <00:03:14.545>was <00:03:14.685>very <00:03:14.825>upset <00:03:14.965>about <00:03:15.105>the <00:03:15.245>bad <00:03:15.385>performance <00:03:15.525>of <00:03:15.665>my <00:03:15.805>application.

58
00:03:18.595 --> 00:03:20.965
<00:03:18.595>This <00:03:18.828>is <00:03:19.061>why <00:03:19.295>I'm <00:03:19.528>asking <00:03:19.761>you <00:03:19.995>also

59
00:03:20.965 --> 00:03:22.325
<00:03:20.965>because <00:03:21.169>we <00:03:21.373>had <00:03:21.577>a <00:03:21.781>great <00:03:21.984>event <00:03:22.189>today.

60
00:03:23.105 --> 00:03:25.445
<00:03:23.105>Uh, <00:03:23.454>guys, <00:03:23.804>who <00:03:24.155>are <00:03:24.505>we

61
00:03:27.585 --> 00:03:28.855
<00:03:27.585>developers <00:03:28.727>exactly.

62
00:03:30.115 --> 00:03:31.415
<00:03:30.115>And, <00:03:30.310>uh, <00:03:30.505>what <00:03:30.700>do <00:03:30.895>we <00:03:31.090>wanna <00:03:31.285>do?

63
00:03:35.515 --> 00:03:37.655
<00:03:35.515>That's <00:03:35.864>actually <00:03:36.214>hilarious. <00:03:36.565>Thank <00:03:36.915>you.

64
00:03:37.875 --> 00:03:40.055
<00:03:37.875>Uh, <00:03:38.075>of <00:03:38.275>course <00:03:38.475>we <00:03:38.675>wanna <00:03:38.875>build <00:03:39.075>great <00:03:39.275>applications.

65
00:03:41.475 --> 00:03:42.975
<00:03:41.475>And <00:03:41.700>then <00:03:41.924>lastly, <00:03:42.150>how <00:03:42.375>are <00:03:42.600>we <00:03:42.825>gonna

66
00:03:42.975 --> 00:03:44.255
<00:03:42.975>measure <00:03:43.551>these <00:03:44.127>applications?

67
00:03:48.075 --> 00:03:52.055
<00:03:48.075>Web <00:03:48.250>vitals. <00:03:48.424>Exactly. <00:03:48.600>So <00:03:48.774>this <00:03:48.950>brings <00:03:49.125>up <00:03:49.299>a <00:03:49.475>question.

68
00:03:53.005 --> 00:03:54.255
<00:03:53.005>What <00:03:53.380>are <00:03:53.755>web <00:03:54.130>vitals

69
00:03:54.875 --> 00:03:56.935
<00:03:54.875>and <00:03:55.155>how <00:03:55.435>are <00:03:55.715>they <00:03:55.995>actually <00:03:56.275>related

70
00:03:57.115 --> 00:03:59.375
<00:03:57.115>to <00:03:57.465>us <00:03:57.815>being <00:03:58.165>exceptional <00:03:58.515>developers

71
00:03:59.675 --> 00:04:01.615
<00:03:59.675>and <00:04:00.141>building <00:04:00.608>exceptional <00:04:01.075>applications?

72
00:04:03.275 --> 00:04:05.975
<00:04:03.275>Now <00:04:03.450>we <00:04:03.625>are <00:04:03.800>all <00:04:03.975>lucky <00:04:04.150>that <00:04:04.325>I'm <00:04:04.500>here <00:04:04.675>today

73
00:04:06.695 --> 00:04:10.295
<00:04:06.695>'cause <00:04:06.822>I'm <00:04:06.949>gonna <00:04:07.076>take <00:04:07.204>you <00:04:07.331>on <00:04:07.458>a <00:04:07.585>round <00:04:07.713>trip <00:04:07.840>to <00:04:07.967>the <00:04:08.095>wonderland

74
00:04:10.295 --> 00:04:14.135
<00:04:10.295>of <00:04:10.575>website <00:04:10.855>performance <00:04:11.135>and <00:04:11.415>website <00:04:11.695>quality.

75
00:04:15.115 --> 00:04:17.895
<00:04:15.115>And <00:04:15.465>in <00:04:15.815>website <00:04:16.165>performance <00:04:16.515>wonderland,

76
00:04:18.475 --> 00:04:21.015
<00:04:18.475>we <00:04:18.650>care <00:04:18.825>about <00:04:19.000>something <00:04:19.175>that <00:04:19.350>is <00:04:19.525>called <00:04:19.700>web <00:04:19.875>vitals.

77
00:04:22.075 --> 00:04:26.135
<00:04:22.075>Now, <00:04:22.250>web <00:04:22.425>vitals <00:04:22.599>are <00:04:22.775>a <00:04:22.950>set <00:04:23.125>of <00:04:23.300>performance <00:04:23.474>metrics

78
00:04:26.805 --> 00:04:28.535
<00:04:26.805>that <00:04:27.155>are <00:04:27.505>in <00:04:27.855>place, <00:04:28.205>uh,

79
00:04:28.535 --> 00:04:30.535
<00:04:28.535>because <00:04:28.710>of <00:04:28.885>a <00:04:29.060>project <00:04:29.235>that <00:04:29.410>was <00:04:29.585>spearheaded <00:04:29.760>by <00:04:29.935>Google.

80
00:04:31.075 --> 00:04:34.935
<00:04:31.075>And <00:04:31.230>they <00:04:31.386>are <00:04:31.541>basically <00:04:31.697>a <00:04:31.852>set <00:04:32.008>of <00:04:32.163>metrics, <00:04:32.319>uh, <00:04:32.474>designed

81
00:04:35.355 --> 00:04:37.415
<00:04:35.355>to <00:04:35.588>give <00:04:35.821>you <00:04:36.055>an <00:04:36.288>idea <00:04:36.521>about <00:04:36.755>how

82
00:04:37.975 --> 00:04:41.295
<00:04:37.975>a <00:04:38.150>user <00:04:38.325>would <00:04:38.500>experience <00:04:38.675>the <00:04:38.850>performance <00:04:39.025>of <00:04:39.200>your <00:04:39.375>application.

83
00:04:41.875 --> 00:04:44.175
<00:04:41.875>Uh, <00:04:41.991>it's <00:04:42.108>a <00:04:42.225>set <00:04:42.341>of <00:04:42.458>metrics <00:04:42.575>that <00:04:42.691>you <00:04:42.808>can <00:04:42.925>see <00:04:43.041>on <00:04:43.158>the <00:04:43.275>slide,

84
00:04:45.235 --> 00:04:49.595
<00:04:45.235>and <00:04:45.515>they <00:04:45.795>focus <00:04:46.075>on <00:04:46.355>different <00:04:46.635>key

85
00:04:49.595 --> 00:04:50.955
<00:04:49.595>aspects, <00:04:49.799>each <00:04:50.003>and <00:04:50.207>every <00:04:50.411>one <00:04:50.615>of <00:04:50.818>them.

86
00:04:51.615 --> 00:04:54.715
<00:04:51.615>So <00:04:51.848>one <00:04:52.081>of <00:04:52.315>them <00:04:52.548>is <00:04:52.781>loading <00:04:53.015>performance,

87
00:04:54.715 --> 00:04:56.235
<00:04:54.715>another <00:04:55.171>one <00:04:55.627>is <00:04:56.083>interactivity.

88
00:04:56.895 --> 00:04:59.395
<00:04:56.895>And <00:04:57.128>then <00:04:57.361>visual <00:04:57.594>stability <00:04:57.828>is <00:04:58.061>also <00:04:58.294>something

89
00:04:59.395 --> 00:05:00.755
<00:04:59.395>that <00:04:59.639>plays <00:04:59.884>a <00:05:00.129>crucial <00:05:00.374>role <00:05:00.619>here.

90
00:05:02.335 --> 00:05:06.035
<00:05:02.335>Now <00:05:02.474>if <00:05:02.614>you're <00:05:02.755>asking <00:05:02.895>yourself, <00:05:03.034>why <00:05:03.174>should <00:05:03.315>I <00:05:03.455>care <00:05:03.594>about <00:05:03.734>this?

91
00:05:06.635 --> 00:05:08.235
<00:05:06.635>I <00:05:06.914>was <00:05:07.195>mentioning <00:05:07.474>user <00:05:07.755>experience <00:05:08.034>before,

92
00:05:08.735 --> 00:05:10.715
<00:05:08.735>and <00:05:08.910>this <00:05:09.085>is <00:05:09.260>also <00:05:09.435>something <00:05:09.610>that <00:05:09.785>is <00:05:09.960>very <00:05:10.135>crucial,

93
00:05:11.575 --> 00:05:14.275
<00:05:11.575>but <00:05:11.775>user <00:05:11.974>experience <00:05:12.175>alone <00:05:12.375>is <00:05:12.575>not <00:05:12.775>the <00:05:12.974>goal.

94
00:05:14.815 --> 00:05:18.835
<00:05:14.815>Uh, <00:05:14.970>the <00:05:15.126>goal <00:05:15.281>is <00:05:15.437>especially <00:05:15.592>in <00:05:15.748>a <00:05:15.903>situation <00:05:16.059>where, <00:05:16.215>um,

95
00:05:19.175 --> 00:05:20.715
<00:05:19.175>you <00:05:19.521>deal <00:05:19.868>with, <00:05:20.214>with <00:05:20.561>something

96
00:05:20.965 --> 00:05:23.555
<00:05:20.965>where <00:05:21.198>the <00:05:21.431>customer <00:05:21.664>satisfaction <00:05:21.898>actually <00:05:22.131>makes <00:05:22.364>an

97
00:05:23.815 --> 00:05:24.835
<00:05:23.815>impact <00:05:24.121>on <00:05:24.426>the <00:05:24.733>business.

98
00:05:25.225 --> 00:05:27.635
<00:05:25.225>It's <00:05:25.425>crucial <00:05:25.625>that <00:05:25.825>perform <00:05:26.025>apps <00:05:26.225>that <00:05:26.425>perform <00:05:26.625>well.

99
00:05:29.135 --> 00:05:31.435
<00:05:29.135>Um, <00:05:29.414>And <00:05:29.695>next <00:05:29.974>to <00:05:30.255>this, <00:05:30.534>uh,

100
00:05:31.495 --> 00:05:33.915
<00:05:31.495>the <00:05:31.728>search <00:05:31.961>engine <00:05:32.195>optimization <00:05:32.428>is <00:05:32.661>also <00:05:32.895>something

101
00:05:34.265 --> 00:05:37.275
<00:05:34.265>that <00:05:34.544>could <00:05:34.825>influence <00:05:35.104>your <00:05:35.385>client's <00:05:35.664>business

102
00:05:37.295 --> 00:05:38.435
<00:05:37.295>to <00:05:37.551>a <00:05:37.808>very <00:05:38.064>high <00:05:38.321>extent.

103
00:05:40.415 --> 00:05:43.515
<00:05:40.415>And <00:05:40.695>lastly, <00:05:40.975>remember, <00:05:41.255>who <00:05:41.535>are <00:05:41.815>we

104
00:05:45.335 --> 00:05:46.525
<00:05:45.335>developers <00:05:46.405>Exactly.

105
00:05:47.425 --> 00:05:48.725
<00:05:47.425>And, <00:05:47.659>uh, <00:05:47.893>because <00:05:48.127>we <00:05:48.361>are <00:05:48.595>great

106
00:05:49.305 --> 00:05:52.285
<00:05:49.305>and <00:05:49.505>exceptional <00:05:49.705>developers, <00:05:49.905>we <00:05:50.105>wanna <00:05:50.305>build <00:05:50.505>great <00:05:50.705>things.

107
00:05:55.555 --> 00:05:58.525
<00:05:55.555>So <00:05:55.710>I <00:05:55.866>hope <00:05:56.021>that <00:05:56.177>I <00:05:56.332>convinced <00:05:56.488>you <00:05:56.643>now <00:05:56.799>that, <00:05:56.955>uh,

108
00:05:58.665 --> 00:06:00.845
<00:05:58.665>web <00:05:58.820>vitals <00:05:58.976>are <00:05:59.131>something <00:05:59.287>to <00:05:59.442>look <00:05:59.598>at <00:05:59.753>a <00:05:59.909>bit <00:06:00.065>closer.

109
00:06:03.705 --> 00:06:05.205
<00:06:03.705>I'm <00:06:03.974>showing <00:06:04.245>a <00:06:04.515>face <00:06:04.784>of <00:06:05.055>irritation

110
00:06:05.205 --> 00:06:07.725
<00:06:05.205>because <00:06:05.380>this <00:06:05.555>monitor <00:06:05.729>just <00:06:05.905>died <00:06:06.080>and <00:06:06.255>it's <00:06:06.430>all <00:06:06.604>black.

111
00:06:08.305 --> 00:06:09.965
<00:06:08.305>Uh, <00:06:08.538>but <00:06:08.771>I'm <00:06:09.005>just <00:06:09.238>gonna <00:06:09.471>continue <00:06:09.705>talking

112
00:06:10.225 --> 00:06:12.205
<00:06:10.225>as <00:06:10.400>my <00:06:10.575>slides <00:06:10.750>are <00:06:10.925>still <00:06:11.100>there, <00:06:11.275>which <00:06:11.450>is <00:06:11.625>nice.

113
00:06:12.945 --> 00:06:17.245
<00:06:12.945>So, <00:06:13.100>uh, <00:06:13.256>web <00:06:13.411>vitals, <00:06:13.567>if <00:06:13.722>you <00:06:13.878>look <00:06:14.033>at <00:06:14.189>them <00:06:14.344>closer,

114
00:06:17.345 --> 00:06:18.485
<00:06:17.345>we <00:06:17.550>are <00:06:17.755>gonna <00:06:17.960>come <00:06:18.165>across <00:06:18.371>something

115
00:06:18.485 --> 00:06:20.125
<00:06:18.485>that <00:06:18.765>is <00:06:19.045>called <00:06:19.325>Core <00:06:19.605>Web <00:06:19.885>Vitals.

116
00:06:20.385 --> 00:06:21.765
<00:06:20.385>My <00:06:20.695>monitors <00:06:21.006>back. <00:06:21.316>That's <00:06:21.627>amazing.

117
00:06:22.625 --> 00:06:24.725
<00:06:22.625>Um, <00:06:22.905>the <00:06:23.185>first <00:06:23.465>core <00:06:23.745>web <00:06:24.025>vital

118
00:06:24.725 --> 00:06:26.565
<00:06:24.725>that <00:06:24.925>you <00:06:25.125>should <00:06:25.325>know <00:06:25.525>about <00:06:25.725>is <00:06:25.925>the <00:06:26.125>LCP,

119
00:06:26.745 --> 00:06:28.045
<00:06:26.745>the <00:06:27.037>largest <00:06:27.330>content <00:06:27.622>for <00:06:27.915>paint.

120
00:06:28.435 --> 00:06:31.325
<00:06:28.435>This <00:06:28.610>is <00:06:28.785>the <00:06:28.960>one <00:06:29.135>that <00:06:29.310>looks <00:06:29.485>closely <00:06:29.660>at <00:06:29.835>performance,

121
00:06:32.185 --> 00:06:34.885
<00:06:32.185>and <00:06:32.325>what <00:06:32.465>it <00:06:32.605>does <00:06:32.745>is <00:06:32.885>it <00:06:33.025>measures <00:06:33.165>the <00:06:33.305>time <00:06:33.445>it <00:06:33.585>takes

122
00:06:34.985 --> 00:06:36.765
<00:06:34.985>for <00:06:35.218>the <00:06:35.451>largest <00:06:35.685>content <00:06:35.918>element <00:06:36.151>on <00:06:36.385>your

123
00:06:36.765 --> 00:06:37.925
<00:06:36.765>page <00:06:37.026>to <00:06:37.287>actually <00:06:37.548>become <00:06:37.809>visible.

124
00:06:39.905 --> 00:06:43.445
<00:06:39.905>The <00:06:40.060>second <00:06:40.216>one <00:06:40.371>is <00:06:40.527>the <00:06:40.682>CLS, <00:06:40.838>the <00:06:40.993>cumulative <00:06:41.149>layout <00:06:41.304>shift.

125
00:06:43.875 --> 00:06:45.805
<00:06:43.875>This <00:06:44.155>one <00:06:44.435>focuses <00:06:44.715>on <00:06:44.995>visual <00:06:45.275>stability,

126
00:06:46.385 --> 00:06:49.125
<00:06:46.385>and <00:06:46.618>it <00:06:46.851>looks <00:06:47.085>at <00:06:47.318>weird <00:06:47.551>layout <00:06:47.784>shifts

127
00:06:49.125 --> 00:06:51.765
<00:06:49.125>that <00:06:49.300>might <00:06:49.475>happen <00:06:49.650>while <00:06:49.825>your <00:06:50.000>page <00:06:50.175>is <00:06:50.350>loading <00:06:50.525>initially.

128
00:06:53.825 --> 00:06:55.525
<00:06:53.825>And <00:06:54.025>the <00:06:54.224>third <00:06:54.425>one <00:06:54.625>here <00:06:54.825>is <00:06:55.025>the <00:06:55.224>INP.

129
00:06:55.875 --> 00:06:57.685
<00:06:55.875>This <00:06:56.108>has <00:06:56.341>been <00:06:56.575>in <00:06:56.808>place <00:06:57.041>since <00:06:57.275>March.

130
00:06:58.145 --> 00:07:01.805
<00:06:58.145>Um, <00:06:58.320>and <00:06:58.495>it <00:06:58.669>looks <00:06:58.844>at <00:06:59.020>interactivity <00:06:59.195>in <00:06:59.370>a <00:06:59.544>way

131
00:07:01.805 --> 00:07:04.965
<00:07:01.805>that <00:07:01.980>it <00:07:02.155>accumulates <00:07:02.330>all <00:07:02.505>the <00:07:02.680>delays <00:07:02.855>that <00:07:03.030>happen <00:07:03.205>in

132
00:07:04.965 --> 00:07:08.725
<00:07:04.965>between <00:07:05.140>the <00:07:05.315>time <00:07:05.489>where <00:07:05.664>a <00:07:05.840>user <00:07:06.015>clicks <00:07:06.190>on <00:07:06.364>something

133
00:07:08.725 --> 00:07:11.885
<00:07:08.725>and <00:07:08.900>then <00:07:09.075>the <00:07:09.250>respective <00:07:09.425>visual <00:07:09.600>updates <00:07:09.775>that <00:07:09.950>are <00:07:10.125>supposed

134
00:07:11.885 --> 00:07:14.165
<00:07:11.885>to <00:07:12.235>happen <00:07:12.585>on <00:07:12.935>your <00:07:13.284>website.

135
00:07:16.785 --> 00:07:20.325
<00:07:16.785>So <00:07:16.960>to <00:07:17.135>sum <00:07:17.310>this <00:07:17.485>up, <00:07:17.660>web <00:07:17.835>vitals <00:07:18.010>pretty <00:07:18.185>important.

136
00:07:21.105 --> 00:07:22.525
<00:07:21.105>And <00:07:21.744>also, <00:07:22.383>um,

137
00:07:23.065 --> 00:07:25.165
<00:07:23.065>if <00:07:23.220>you <00:07:23.376>wanna <00:07:23.531>stay <00:07:23.687>in <00:07:23.842>the <00:07:23.998>little <00:07:24.153>wine <00:07:24.309>world <00:07:24.465>example

138
00:07:25.165 --> 00:07:28.885
<00:07:25.165>that <00:07:25.305>I <00:07:25.445>opened, <00:07:25.585>you <00:07:25.725>might <00:07:25.865>wanna <00:07:26.005>look <00:07:26.145>at <00:07:26.285>them <00:07:26.425>as <00:07:26.565>a

139
00:07:28.905 --> 00:07:31.365
<00:07:28.905>so <00:07:29.104>Soel <00:07:29.304>years <00:07:29.505>guide <00:07:29.705>to <00:07:29.905>a <00:07:30.104>good <00:07:30.304>website.

140
00:07:32.795 --> 00:07:36.185
<00:07:32.795>Um, <00:07:33.145>these <00:07:33.495>are <00:07:33.845>the <00:07:34.195>highlights

141
00:07:36.525 --> 00:07:38.585
<00:07:36.525>so <00:07:36.680>far <00:07:36.836>on <00:07:36.991>the <00:07:37.147>menu <00:07:37.302>for <00:07:37.458>you <00:07:37.613>as <00:07:37.769>a <00:07:37.924>summary.

142
00:07:39.285 --> 00:07:42.585
<00:07:39.284>Uh, <00:07:39.424>so <00:07:39.564>as <00:07:39.705>I <00:07:39.844>said <00:07:39.984>before, <00:07:40.124>the <00:07:40.265>web <00:07:40.405>items <00:07:40.544>are <00:07:40.684>metrics

143
00:07:42.735 --> 00:07:44.185
<00:07:42.735>that <00:07:43.061>are <00:07:43.387>crucial <00:07:43.713>for <00:07:44.040>performance,

144
00:07:44.445 --> 00:07:48.455
<00:07:44.445>and <00:07:44.600>they <00:07:44.756>were <00:07:44.911>introduced <00:07:45.067>by <00:07:45.222>Google <00:07:45.378>to <00:07:45.533>guide <00:07:45.689>us <00:07:45.844>developers.

145
00:07:49.515 --> 00:07:52.095
<00:07:49.515>And, <00:07:49.690>uh, <00:07:49.865>they <00:07:50.039>impact <00:07:50.215>user <00:07:50.390>experience, <00:07:50.565>they <00:07:50.740>impact <00:07:50.914>zero

146
00:07:52.715 --> 00:07:54.495
<00:07:52.715>and, <00:07:53.065>uh, <00:07:53.415>it's <00:07:53.765>especially <00:07:54.115>useful

147
00:07:54.495 --> 00:07:56.055
<00:07:54.495>to <00:07:54.695>look <00:07:54.895>at <00:07:55.095>the <00:07:55.295>core, <00:07:55.495>but <00:07:55.695>that's <00:07:55.895>closer.

148
00:07:56.595 --> 00:07:59.215
<00:07:56.595>The <00:07:56.828>SAP, <00:07:57.061>the <00:07:57.295>CLS <00:07:57.528>and <00:07:57.761>the <00:07:57.995>INP.

149
00:08:00.235 --> 00:08:03.495
<00:08:00.235>And, <00:08:00.410>uh, <00:08:00.585>well, <00:08:00.760>if <00:08:00.935>you <00:08:01.110>manage <00:08:01.285>to <00:08:01.460>nail <00:08:01.635>these,

150
00:08:04.325 --> 00:08:07.335
<00:08:04.325>most <00:08:04.500>things <00:08:04.675>are <00:08:04.849>very <00:08:05.025>likely <00:08:05.200>to <00:08:05.375>fall <00:08:05.550>into <00:08:05.724>place.

151
00:08:09.255 --> 00:08:13.275
<00:08:09.255>Now, <00:08:09.488>let's <00:08:09.721>go <00:08:09.955>back <00:08:10.188>to <00:08:10.421>my <00:08:10.655>project

152
00:08:13.975 --> 00:08:16.395
<00:08:13.975>and <00:08:14.325>the <00:08:14.675>s****y <00:08:15.025>Lighthouse <00:08:15.375>performance

153
00:08:16.395 --> 00:08:17.515
<00:08:16.395>score <00:08:16.647>that <00:08:16.899>I <00:08:17.151>produced <00:08:17.402>there.

154
00:08:18.375 --> 00:08:21.695
<00:08:18.375>Mm, <00:08:19.775>Maybe

155
00:08:21.875 --> 00:08:23.455
<00:08:21.875>for <00:08:22.108>the <00:08:22.341>more <00:08:22.575>advanced <00:08:22.808>people <00:08:23.041>over <00:08:23.275>here.

156
00:08:23.915 --> 00:08:26.495
<00:08:23.915>Um, <00:08:24.115>just <00:08:24.315>a <00:08:24.515>side <00:08:24.715>note, <00:08:24.915>I'm <00:08:25.115>very <00:08:25.315>aware

157
00:08:26.495 --> 00:08:28.855
<00:08:26.495>that <00:08:26.728>this <00:08:26.961>Lighthouse <00:08:27.195>Performance <00:08:27.428>score <00:08:27.661>is <00:08:27.895>not

158
00:08:29.495 --> 00:08:31.415
<00:08:29.495>actually <00:08:29.845>representing <00:08:30.195>core <00:08:30.545>web <00:08:30.895>vitals.

159
00:08:31.995 --> 00:08:34.455
<00:08:31.995>In <00:08:32.195>fact, <00:08:32.395>core <00:08:32.595>web <00:08:32.794>vitals <00:08:32.995>are <00:08:33.195>like <00:08:33.395>50%

160
00:08:34.455 --> 00:08:35.495
<00:08:34.455>of <00:08:34.689>what <00:08:34.923>goes <00:08:35.157>into <00:08:35.390>here.

161
00:08:35.845 --> 00:08:38.015
<00:08:35.845>There's <00:08:36.078>also <00:08:36.311>the <00:08:36.545>speed <00:08:36.778>index, <00:08:37.011>for <00:08:37.245>example,

162
00:08:38.075 --> 00:08:40.455
<00:08:38.075>and <00:08:38.275>the <00:08:38.475>total <00:08:38.675>blocking <00:08:38.875>time <00:08:39.075>that <00:08:39.275>is <00:08:39.475>relevant

163
00:08:40.455 --> 00:08:41.455
<00:08:40.455>for <00:08:40.755>the <00:08:41.055>performance <00:08:41.355>score.

164
00:08:42.395 --> 00:08:46.095
<00:08:42.395>But <00:08:42.569>to <00:08:42.745>make <00:08:42.919>this <00:08:43.095>example <00:08:43.270>work, <00:08:43.444>uh, <00:08:43.620>and <00:08:43.794>also

165
00:08:46.095 --> 00:08:48.015
<00:08:46.095>because <00:08:46.328>it <00:08:46.561>does <00:08:46.795>give <00:08:47.028>a <00:08:47.261>tendency <00:08:47.495>about

166
00:08:48.015 --> 00:08:51.175
<00:08:48.015>how <00:08:48.215>the <00:08:48.415>application <00:08:48.615>performs, <00:08:48.814>I <00:08:49.015>opted <00:08:49.215>to <00:08:49.415>go

167
00:08:51.175 --> 00:08:52.535
<00:08:51.175>with <00:08:51.583>this <00:08:51.991>score <00:08:52.399>here.

168
00:08:53.995 --> 00:08:58.925
<00:08:53.995>Um, <00:08:54.275>remember <00:08:54.555>my <00:08:54.835>performance <00:08:55.115>was <00:08:55.395>not

169
00:08:58.925 --> 00:09:00.005
<00:08:58.925>the <00:08:59.168>best <00:08:59.411>in <00:08:59.654>this <00:08:59.896>case.

170
00:09:00.665 --> 00:09:02.645
<00:09:00.665>And, <00:09:00.839>uh, <00:09:01.015>I <00:09:01.189>looked <00:09:01.365>at <00:09:01.540>this <00:09:01.714>for <00:09:01.890>a <00:09:02.064>while,

171
00:09:02.665 --> 00:09:04.085
<00:09:02.665>and <00:09:02.877>then <00:09:03.091>I <00:09:03.304>thought <00:09:03.517>to <00:09:03.730>myself, <00:09:03.943>well,

172
00:09:05.285 --> 00:09:07.125
<00:09:05.285>I <00:09:05.459>think <00:09:05.635>if <00:09:05.810>my <00:09:05.985>application <00:09:06.160>would <00:09:06.334>be <00:09:06.510>a <00:09:06.685>drawing,

173
00:09:08.585 --> 00:09:09.845
<00:09:08.585>it <00:09:08.811>would <00:09:09.038>look <00:09:09.265>somewhat <00:09:09.492>like <00:09:09.719>this.

174
00:09:10.665 --> 00:09:13.005
<00:09:10.665>So <00:09:11.015>it's <00:09:11.365>not <00:09:11.714>actually <00:09:12.064>bad.

175
00:09:13.125 --> 00:09:15.405
<00:09:13.125>I <00:09:13.241>mean, <00:09:13.358>you <00:09:13.475>get <00:09:13.591>an <00:09:13.708>idea <00:09:13.825>of <00:09:13.941>what <00:09:14.058>it <00:09:14.175>is <00:09:14.291>trying <00:09:14.408>to <00:09:14.525>say,

176
00:09:15.545 --> 00:09:17.325
<00:09:15.545>but <00:09:15.824>it's <00:09:16.104>also <00:09:16.385>not <00:09:16.665>very <00:09:16.944>sophisticated.

177
00:09:18.345 --> 00:09:21.165
<00:09:18.345>And, <00:09:18.545>uh, <00:09:18.745>I <00:09:18.945>was <00:09:19.145>especially <00:09:19.345>sad <00:09:19.545>about <00:09:19.745>this

178
00:09:21.165 --> 00:09:24.245
<00:09:21.165>because <00:09:21.365>I <00:09:21.564>used <00:09:21.765>Next <00:09:21.964>JS <00:09:22.165>as <00:09:22.365>a <00:09:22.564>framework,

179
00:09:24.905 --> 00:09:26.085
<00:09:24.905>uh, <00:09:25.117>to <00:09:25.329>make <00:09:25.542>this <00:09:25.754>thing <00:09:25.967>work.

180
00:09:27.265 --> 00:09:29.885
<00:09:27.265>And, <00:09:27.439>uh, <00:09:27.615>some <00:09:27.790>of <00:09:27.965>you <00:09:28.140>might <00:09:28.314>ask <00:09:28.490>yourselves <00:09:28.665>now,

181
00:09:30.315 --> 00:09:32.605
<00:09:30.315>what <00:09:30.470>is <00:09:30.626>next <00:09:30.781>Js <00:09:30.937>actually, <00:09:31.092>what <00:09:31.248>is <00:09:31.403>she <00:09:31.559>talking <00:09:31.715>about?

182
00:09:32.995 --> 00:09:35.365
<00:09:32.995>Because <00:09:33.195>maybe <00:09:33.395>not <00:09:33.595>everyone <00:09:33.795>is <00:09:33.995>a <00:09:34.195>frontend <00:09:34.395>engineer.

183
00:09:36.185 --> 00:09:39.885
<00:09:36.185>So <00:09:36.359>let <00:09:36.535>me <00:09:36.709>quickly <00:09:36.885>explain <00:09:37.060>this <00:09:37.234>to <00:09:37.410>you <00:09:37.584>so

184
00:09:39.885 --> 00:09:41.085
<00:09:39.885>that <00:09:40.039>we <00:09:40.193>are <00:09:40.347>all <00:09:40.502>on <00:09:40.656>the <00:09:40.810>same <00:09:40.965>level.

185
00:09:42.025 --> 00:09:45.485
<00:09:42.025>And <00:09:42.180>what <00:09:42.336>next <00:09:42.491>I <00:09:42.647>asked <00:09:42.802>is <00:09:42.958>basically <00:09:43.113>a <00:09:43.269>web <00:09:43.425>framework

186
00:09:45.595 --> 00:09:48.005
<00:09:45.595>that <00:09:45.795>was <00:09:45.995>introduced <00:09:46.195>by <00:09:46.395>the <00:09:46.595>guys <00:09:46.795>from <00:09:46.995>Versal.

187
00:09:48.745 --> 00:09:50.485
<00:09:48.745>And <00:09:48.945>it <00:09:49.145>has <00:09:49.345>been <00:09:49.545>around <00:09:49.745>for <00:09:49.945>a <00:09:50.145>while,

188
00:09:51.025 --> 00:09:54.085
<00:09:51.025>but <00:09:51.180>it <00:09:51.336>gained <00:09:51.491>significant <00:09:51.647>traction <00:09:51.802>last <00:09:51.958>year <00:09:52.113>when <00:09:52.269>they <00:09:52.425>came

189
00:09:54.085 --> 00:09:55.125
<00:09:54.085>up <00:09:54.319>with <00:09:54.553>the <00:09:54.787>app <00:09:55.021>router.

190
00:09:56.385 --> 00:09:58.325
<00:09:56.385>And <00:09:56.851>these <00:09:57.318>days, <00:09:57.785>well,

191
00:09:59.125 --> 00:10:00.665
<00:09:59.125>or <00:09:59.402>from <00:09:59.679>the <00:09:59.956>very <00:10:00.233>beginning, <00:10:00.511>actually,

192
00:10:00.775 --> 00:10:03.225
<00:10:00.775>next <00:10:01.055>J <00:10:01.334>next <00:10:01.615>JS <00:10:01.895>extends <00:10:02.175>React.

193
00:10:03.605 --> 00:10:05.305
<00:10:03.605>And <00:10:03.838>these <00:10:04.071>days <00:10:04.305>it's <00:10:04.538>even <00:10:04.771>recommended <00:10:05.005>not

194
00:10:05.305 --> 00:10:06.625
<00:10:05.305>to <00:10:05.602>use <00:10:05.899>React <00:10:06.196>standalone <00:10:06.492>anymore,

195
00:10:07.285 --> 00:10:09.945
<00:10:07.285>but <00:10:07.485>to <00:10:07.685>use <00:10:07.885>a <00:10:08.084>framework <00:10:08.285>like <00:10:08.485>next <00:10:08.685>shares

196
00:10:09.945 --> 00:10:12.865
<00:10:09.945>or <00:10:10.120>remix <00:10:10.295>on <00:10:10.470>top <00:10:10.645>of <00:10:10.820>it <00:10:10.995>to <00:10:11.170>actually, <00:10:11.345>uh,

197
00:10:13.295 --> 00:10:16.345
<00:10:13.295>take <00:10:13.450>out <00:10:13.606>all <00:10:13.761>the <00:10:13.917>ex <00:10:14.072>uh, <00:10:14.228>the <00:10:14.383>good <00:10:14.539>performance <00:10:14.694>metrics

198
00:10:16.645 --> 00:10:20.185
<00:10:16.645>or <00:10:16.785>the <00:10:16.925>yeah, <00:10:17.064>good <00:10:17.204>performance <00:10:17.345>features <00:10:17.485>that <00:10:17.625>it <00:10:17.765>gives <00:10:17.905>to <00:10:18.045>you.

199
00:10:21.365 --> 00:10:25.425
<00:10:21.365>And, <00:10:21.505>um, <00:10:21.645>what <00:10:21.785>is <00:10:21.925>special <00:10:22.065>about <00:10:22.205>next <00:10:22.345>shares <00:10:22.485>is <00:10:22.625>the <00:10:22.765>fact

200
00:10:25.425 --> 00:10:28.425
<00:10:25.425>that <00:10:25.658>it <00:10:25.891>incorporates <00:10:26.125>server <00:10:26.358>side <00:10:26.591>rendering <00:10:26.824>capabilities

201
00:10:28.685 --> 00:10:30.665
<00:10:28.685>and <00:10:28.885>static <00:10:29.084>site <00:10:29.285>generation <00:10:29.484>out <00:10:29.685>of <00:10:29.885>the <00:10:30.084>box.

202
00:10:31.405 --> 00:10:36.025
<00:10:31.405>And, <00:10:31.560>uh, <00:10:31.716>this <00:10:31.871>comes <00:10:32.027>with <00:10:32.182>a <00:10:32.338>couple <00:10:32.493>of, <00:10:32.649>um, <00:10:32.805>possibilities

203
00:10:36.885 --> 00:10:39.375
<00:10:36.885>to, <00:10:37.585>well, <00:10:38.285>yeah,

204
00:10:39.435 --> 00:10:41.935
<00:10:39.435>to <00:10:39.714>perform <00:10:39.994>better <00:10:40.275>than <00:10:40.555>the <00:10:40.834>classic

205
00:10:42.535 --> 00:10:43.775
<00:10:42.535>SPA <00:10:42.906>application <00:10:43.279>did <00:10:43.651>before.

206
00:10:44.635 --> 00:10:48.575
<00:10:44.635>Uh, <00:10:44.751>also, <00:10:44.868>and <00:10:44.985>this <00:10:45.101>is <00:10:45.218>what <00:10:45.335>I <00:10:45.451>am <00:10:45.568>focusing <00:10:45.685>on <00:10:45.801>in <00:10:45.918>this <00:10:46.035>talk,

207
00:10:49.285 --> 00:10:51.415
<00:10:49.285>next <00:10:49.518>J <00:10:49.751>comes <00:10:49.985>equipped <00:10:50.218>with <00:10:50.451>a <00:10:50.685>couple

208
00:10:51.515 --> 00:10:53.495
<00:10:51.515>of <00:10:51.981>optimized <00:10:52.448>performance <00:10:52.915>features.

209
00:10:54.395 --> 00:10:57.375
<00:10:54.395>But <00:10:54.550>of <00:10:54.706>course, <00:10:54.861>you <00:10:55.017>have <00:10:55.172>to <00:10:55.328>either <00:10:55.483>know <00:10:55.639>about <00:10:55.795>them

210
00:10:57.955 --> 00:11:00.095
<00:10:57.955>or <00:10:58.305>be <00:10:58.655>an <00:10:59.005>exceptional <00:10:59.355>developer

211
00:11:00.395 --> 00:11:02.055
<00:11:00.395>and <00:11:00.628>read <00:11:00.861>the <00:11:01.095>documentation <00:11:01.328>before <00:11:01.561>you <00:11:01.795>start.

212
00:11:02.635 --> 00:11:06.655
<00:11:02.635>Um, <00:11:02.775>I <00:11:02.915>did <00:11:03.055>not, <00:11:03.194>so <00:11:03.335>my <00:11:03.475>application <00:11:03.615>didn't <00:11:03.755>perform <00:11:03.895>its <00:11:04.035>best.

213
00:11:07.475 --> 00:11:11.775
<00:11:07.475>Uh, <00:11:07.615>but <00:11:07.755>I'm <00:11:07.895>here <00:11:08.035>today <00:11:08.175>to <00:11:08.315>share <00:11:08.455>all <00:11:08.595>my <00:11:08.735>experience <00:11:08.875>so

214
00:11:11.925 --> 00:11:14.375
<00:11:11.925>that <00:11:12.052>you <00:11:12.179>don't <00:11:12.306>have <00:11:12.434>to <00:11:12.561>make <00:11:12.688>the <00:11:12.815>same <00:11:12.943>mistakes <00:11:13.070>that <00:11:13.197>I <00:11:13.324>did.

215
00:11:15.715 --> 00:11:19.215
<00:11:15.715>So <00:11:15.831>what <00:11:15.948>we <00:11:16.065>are <00:11:16.181>gonna <00:11:16.298>do <00:11:16.415>now, <00:11:16.531>should <00:11:16.648>I <00:11:16.765>wanna <00:11:16.881>go <00:11:16.998>back, <00:11:17.115>cannot.

216
00:11:20.075 --> 00:11:24.815
<00:11:20.075>Ah, <00:11:20.191>um, <00:11:20.308>so <00:11:20.425>what <00:11:20.541>we <00:11:20.658>are <00:11:20.775>looking <00:11:20.891>at <00:11:21.008>now <00:11:21.125>is, <00:11:21.241>uh, <00:11:21.358>a <00:11:21.475>couple

217
00:11:24.815 --> 00:11:27.935
<00:11:24.815>of <00:11:25.015>features <00:11:25.215>that <00:11:25.415>Next <00:11:25.615>JS <00:11:25.815>comes <00:11:26.015>with, <00:11:26.215>um,

218
00:11:28.565 --> 00:11:32.175
<00:11:28.565>that <00:11:28.692>help <00:11:28.819>you <00:11:28.946>if <00:11:29.074>you <00:11:29.201>use <00:11:29.328>them <00:11:29.455>in <00:11:29.583>the <00:11:29.710>right <00:11:29.837>way <00:11:29.965>to

219
00:11:33.175 --> 00:11:34.655
<00:11:33.175>optimize <00:11:33.441>the <00:11:33.707>performance <00:11:33.974>of <00:11:34.240>your <00:11:34.507>application.

220
00:11:36.155 --> 00:11:40.175
<00:11:36.155>And <00:11:36.329>the <00:11:36.505>system <00:11:36.680>I <00:11:36.855>used <00:11:37.030>to <00:11:37.204>check <00:11:37.380>this <00:11:37.555>out

221
00:11:40.175 --> 00:11:43.775
<00:11:40.175>and <00:11:40.302>to <00:11:40.429>make <00:11:40.556>this <00:11:40.684>work <00:11:40.811>was <00:11:40.938>that <00:11:41.065>I <00:11:41.193>created <00:11:41.320>a <00:11:41.447>new <00:11:41.574>branch.

222
00:11:44.125 --> 00:11:48.015
<00:11:44.125>Well, <00:11:44.265>first <00:11:44.405>I <00:11:44.545>put <00:11:44.685>everything <00:11:44.825>that <00:11:44.965>I <00:11:45.105>had <00:11:45.245>on <00:11:45.385>Main, <00:11:45.525>uh,

223
00:11:48.075 --> 00:11:50.015
<00:11:48.075>put <00:11:48.230>everything <00:11:48.386>together, <00:11:48.541>and <00:11:48.697>then <00:11:48.852>I <00:11:49.008>created <00:11:49.163>a <00:11:49.319>new <00:11:49.475>branch

224
00:11:50.035 --> 00:11:51.535
<00:11:50.035>for <00:11:50.372>all <00:11:50.709>the <00:11:51.047>optimization <00:11:51.385>features

225
00:11:52.075 --> 00:11:54.085
<00:11:52.075>and <00:11:52.275>played <00:11:52.475>around <00:11:52.675>with <00:11:52.875>them <00:11:53.075>a <00:11:53.275>little <00:11:53.475>bit.

226
00:11:54.105 --> 00:11:56.245
<00:11:54.105>And <00:11:54.305>then <00:11:54.505>I <00:11:54.705>rechecked <00:11:54.905>the <00:11:55.105>performance <00:11:55.305>score <00:11:55.505>each

227
00:11:56.245 --> 00:11:57.925
<00:11:56.245>and <00:11:56.478>every <00:11:56.711>time <00:11:56.945>so <00:11:57.178>that <00:11:57.411>I <00:11:57.645>get

228
00:11:57.995 --> 00:12:00.285
<00:11:57.995>that <00:11:58.195>I <00:11:58.395>could <00:11:58.595>get <00:11:58.795>an <00:11:58.995>idea <00:11:59.195>about <00:11:59.395>whether

229
00:12:00.305 --> 00:12:01.365
<00:12:00.305>it <00:12:00.543>actually <00:12:00.781>worked <00:12:01.020>or <00:12:01.259>not.

230
00:12:02.545 --> 00:12:04.645
<00:12:02.545>And, <00:12:02.778>uh, <00:12:03.011>the <00:12:03.245>first <00:12:03.478>thing <00:12:03.711>I <00:12:03.944>tried

231
00:12:04.985 --> 00:12:08.845
<00:12:04.985>or <00:12:05.160>I <00:12:05.335>was <00:12:05.510>looking <00:12:05.685>at <00:12:05.860>is <00:12:06.035>the <00:12:06.210>image <00:12:06.385>optimization.

232
00:12:09.705 --> 00:12:14.425
<00:12:09.705>And, <00:12:09.985>uh, <00:12:10.265>before <00:12:10.545>actually <00:12:10.825>changing <00:12:11.105>anything,

233
00:12:15.005 --> 00:12:18.745
<00:12:15.005>uh, <00:12:15.160>I <00:12:15.316>would <00:12:15.471>implement <00:12:15.627>images <00:12:15.782>in <00:12:15.938>a <00:12:16.093>pretty <00:12:16.249>basic <00:12:16.405>way,

234
00:12:18.815 --> 00:12:20.745
<00:12:18.815>just <00:12:19.095>using <00:12:19.375>the <00:12:19.655>classic <00:12:19.935>HTML <00:12:20.215>tag.

235
00:12:20.965 --> 00:12:22.705
<00:12:20.965>You <00:12:21.140>can <00:12:21.315>do <00:12:21.490>that. <00:12:21.665>It's <00:12:21.840>pretty <00:12:22.015>simple. <00:12:22.190>It's <00:12:22.365>easy.

236
00:12:23.085 --> 00:12:24.425
<00:12:23.085>Uh, <00:12:23.286>it's <00:12:23.487>so <00:12:23.688>easy <00:12:23.889>that <00:12:24.089>it's <00:12:24.290>actually

237
00:12:24.425 --> 00:12:25.585
<00:12:24.425>weird <00:12:24.598>to <00:12:24.773>show <00:12:24.947>this <00:12:25.121>to <00:12:25.295>you <00:12:25.469>here.

238
00:12:26.325 --> 00:12:28.305
<00:12:26.325>Uh, <00:12:26.525>and <00:12:26.725>it's, <00:12:26.925>well, <00:12:27.125>it <00:12:27.325>does <00:12:27.525>the <00:12:27.725>job,

239
00:12:28.605 --> 00:12:31.145
<00:12:28.605>but <00:12:28.780>what <00:12:28.955>it <00:12:29.130>also <00:12:29.305>does <00:12:29.480>is <00:12:29.655>it <00:12:29.830>leaves <00:12:30.005>you

240
00:12:31.335 --> 00:12:35.745
<00:12:31.335>with <00:12:31.568>the <00:12:31.801>responsibility <00:12:32.035>to <00:12:32.268>manually <00:12:32.501>confirm <00:12:32.735>responsiveness

241
00:12:36.485 --> 00:12:37.985
<00:12:36.485>and <00:12:36.755>to <00:12:37.025>choose <00:12:37.295>the <00:12:37.565>correct <00:12:37.835>format

242
00:12:38.805 --> 00:12:41.905
<00:12:38.805>and <00:12:39.005>also <00:12:39.204>to <00:12:39.405>implement <00:12:39.604>lazy <00:12:39.805>loading <00:12:40.005>if <00:12:40.204>you

243
00:12:41.975 --> 00:12:43.185
<00:12:41.975>need <00:12:42.247>this <00:12:42.519>in <00:12:42.791>your <00:12:43.064>application.

244
00:12:45.325 --> 00:12:49.185
<00:12:45.325>And <00:12:45.500>I <00:12:45.675>figured, <00:12:45.850>wow, <00:12:46.025>there's <00:12:46.200>something <00:12:46.375>X-rays <00:12:46.550>comes <00:12:46.725>with

245
00:12:49.615 --> 00:12:52.105
<00:12:49.615>that <00:12:49.755>is <00:12:49.895>so <00:12:50.035>simple, <00:12:50.175>I <00:12:50.315>cannot <00:12:50.455>believe <00:12:50.595>how <00:12:50.735>simple <00:12:50.875>it <00:12:51.015>is.

246
00:12:52.725 --> 00:12:55.385
<00:12:52.725>Uh, <00:12:53.005>and <00:12:53.285>that's <00:12:53.565>the <00:12:53.845>image <00:12:54.125>component

247
00:12:55.455 --> 00:12:58.545
<00:12:55.455>that <00:12:55.655>you <00:12:55.855>can <00:12:56.055>just <00:12:56.255>import <00:12:56.455>from <00:12:56.655>Next <00:12:56.855>Image

248
00:12:59.205 --> 00:13:01.785
<00:12:59.205>and <00:12:59.438>use <00:12:59.671>it <00:12:59.905>almost <00:13:00.138>the <00:13:00.371>same <00:13:00.605>way

249
00:13:02.085 --> 00:13:04.705
<00:13:02.085>as <00:13:02.260>you <00:13:02.435>use <00:13:02.610>your <00:13:02.785>image <00:13:02.960>A <00:13:03.135>TML <00:13:03.310>Tech <00:13:03.485>before.

250
00:13:05.045 --> 00:13:08.545
<00:13:05.045>And <00:13:05.219>this <00:13:05.395>is <00:13:05.569>because <00:13:05.745>it's <00:13:05.920>basically <00:13:06.094>an <00:13:06.270>evolved <00:13:06.444>form

251
00:13:08.805 --> 00:13:10.305
<00:13:08.805>of <00:13:09.142>the <00:13:09.479>HTML <00:13:09.817>image <00:13:10.155>element,

252
00:13:10.765 --> 00:13:12.745
<00:13:10.765>but <00:13:10.998>it's <00:13:11.231>tailored <00:13:11.465>for <00:13:11.698>the <00:13:11.931>modern <00:13:12.165>web.

253
00:13:13.645 --> 00:13:17.505
<00:13:13.645>So <00:13:13.819>it <00:13:13.995>does <00:13:14.170>come <00:13:14.345>with <00:13:14.520>features <00:13:14.694>like <00:13:14.870>automatic <00:13:15.045>resizing

254
00:13:18.405 --> 00:13:22.025
<00:13:18.405>and, <00:13:18.560>uh, <00:13:18.716>also <00:13:18.871>automatically <00:13:19.027>serves <00:13:19.182>your <00:13:19.338>image <00:13:19.493>in <00:13:19.649>the <00:13:19.805>modern

255
00:13:22.025 --> 00:13:23.505
<00:13:22.025>format <00:13:22.468>like <00:13:22.913>Web <00:13:23.357>P.

256
00:13:24.885 --> 00:13:27.025
<00:13:24.885>So <00:13:25.118>this <00:13:25.351>helps <00:13:25.585>you <00:13:25.818>to <00:13:26.051>make <00:13:26.285>sure

257
00:13:27.295 --> 00:13:30.545
<00:13:27.295>that <00:13:27.435>you <00:13:27.574>have <00:13:27.714>a <00:13:27.854>stable <00:13:27.995>layout <00:13:28.135>even <00:13:28.275>from <00:13:28.415>the <00:13:28.555>very <00:13:28.694>beginning

258
00:13:30.545 --> 00:13:33.185
<00:13:30.545>of <00:13:30.745>your <00:13:30.944>application <00:13:31.145>loading, <00:13:31.344>uh, <00:13:31.545>which <00:13:31.745>helps <00:13:31.944>you

259
00:13:33.185 --> 00:13:35.265
<00:13:33.185>with <00:13:33.651>the <00:13:34.118>CLS, <00:13:34.584>uh,

260
00:13:35.295 --> 00:13:37.505
<00:13:35.295>core <00:13:35.469>web <00:13:35.645>vital <00:13:35.819>metric <00:13:35.995>that <00:13:36.170>we <00:13:36.344>just <00:13:36.520>learned <00:13:36.694>about.

261
00:13:41.725 --> 00:13:45.145
<00:13:41.725>Now, <00:13:41.925>what <00:13:42.125>I <00:13:42.325>did, <00:13:42.525>is <00:13:42.725>this <00:13:42.925>gonna <00:13:43.125>work?

262
00:13:47.035 --> 00:13:50.955
<00:13:47.035>Huh? <00:13:47.501>Now <00:13:47.968>this <00:13:48.435>monitor's

263
00:13:50.955 --> 00:13:52.035
<00:13:50.955>messing <00:13:51.149>with <00:13:51.343>me, <00:13:51.538>by <00:13:51.732>the <00:13:51.927>way.

264
00:13:52.775 --> 00:13:57.395
<00:13:52.775>Um, <00:13:52.930>so <00:13:53.086>I <00:13:53.241>put <00:13:53.397>all <00:13:53.552>the <00:13:53.708>changes <00:13:53.863>that <00:13:54.019>I <00:13:54.175>did,

265
00:13:57.815 --> 00:14:02.435
<00:13:57.815>uh, <00:13:57.990>into <00:13:58.165>my <00:13:58.340>little <00:13:58.515>analysis, <00:13:58.690>uh, <00:13:58.865>Chrome <00:13:59.040>browser <00:13:59.215>situation,

266
00:14:02.895 --> 00:14:05.155
<00:14:02.895>and <00:14:03.050>I <00:14:03.206>found, <00:14:03.361>hey, <00:14:03.517>I <00:14:03.672>mean, <00:14:03.828>to <00:14:03.983>be <00:14:04.139>honest, <00:14:04.295>my,

267
00:14:05.335 --> 00:14:07.355
<00:14:05.335>my <00:14:05.535>little <00:14:05.735>Vine <00:14:05.935>application <00:14:06.135>didn't <00:14:06.335>have <00:14:06.535>too <00:14:06.735>many

268
00:14:07.475 --> 00:14:08.955
<00:14:07.475>images <00:14:07.919>at <00:14:08.363>this <00:14:08.807>point.

269
00:14:09.455 --> 00:14:11.995
<00:14:09.455>Uh, <00:14:09.655>but <00:14:09.855>I <00:14:10.055>reached <00:14:10.255>a <00:14:10.455>higher <00:14:10.655>performance <00:14:10.855>score

270
00:14:11.995 --> 00:14:13.075
<00:14:11.995>just <00:14:12.319>by <00:14:12.643>changing <00:14:12.967>this.

271
00:14:13.215 --> 00:14:15.195
<00:14:13.215>And <00:14:13.390>I <00:14:13.565>mean, <00:14:13.740>you <00:14:13.915>saw <00:14:14.090>it, <00:14:14.265>it <00:14:14.440>was <00:14:14.615>the,

272
00:14:15.335 --> 00:14:16.555
<00:14:15.335>the <00:14:15.609>most <00:14:15.884>minor <00:14:16.158>thing <00:14:16.433>ever.

273
00:14:16.615 --> 00:14:18.595
<00:14:16.615>It <00:14:16.815>took <00:14:17.015>me <00:14:17.215>five <00:14:17.415>minutes <00:14:17.615>and <00:14:17.815>I <00:14:18.015>realized,

274
00:14:18.615 --> 00:14:19.755
<00:14:18.615>hey, <00:14:18.820>this <00:14:19.025>is <00:14:19.230>actually <00:14:19.435>way <00:14:19.641>better.

275
00:14:20.165 --> 00:14:21.315
<00:14:20.165>Thank <00:14:20.510>you. <00:14:20.855>Next <00:14:21.200>js.

276
00:14:22.575 --> 00:14:26.475
<00:14:22.575>So <00:14:22.808>I <00:14:23.041>thought <00:14:23.275>if <00:14:23.508>my <00:14:23.741>image, <00:14:23.975>well,

277
00:14:26.555 --> 00:14:30.195
<00:14:26.555>if <00:14:26.694>my <00:14:26.834>application <00:14:26.974>was <00:14:27.114>still <00:14:27.255>in <00:14:27.395>this <00:14:27.535>drawing, <00:14:27.675>uh, <00:14:27.814>image <00:14:27.954>kind

278
00:14:30.195 --> 00:14:34.115
<00:14:30.195>of <00:14:30.370>thing, <00:14:30.545>um, <00:14:30.720>I <00:14:30.895>involved, <00:14:31.070>it's <00:14:31.245>still <00:14:31.420>not <00:14:31.595>Picasso,

279
00:14:34.135 --> 00:14:35.555
<00:14:34.135>but <00:14:34.390>it, <00:14:34.646>it <00:14:34.901>looks <00:14:35.157>better <00:14:35.413>now.

280
00:14:36.695 --> 00:14:40.115
<00:14:36.695>So <00:14:36.975>I <00:14:37.255>continued <00:14:37.535>and <00:14:37.815>I <00:14:38.095>continued

281
00:14:40.115 --> 00:14:43.855
<00:14:40.115>by <00:14:40.581>looking <00:14:41.048>at <00:14:41.515>fonts.

282
00:14:44.755 --> 00:14:49.255
<00:14:44.755>Uh, <00:14:44.910>now <00:14:45.066>fonts <00:14:45.221>are <00:14:45.377>very <00:14:45.532>present <00:14:45.688>in <00:14:45.843>the <00:14:45.999>modern <00:14:46.155>web.

283
00:14:49.375 --> 00:14:52.845
<00:14:49.375>I <00:14:49.515>would <00:14:49.655>say, <00:14:49.795>uh, <00:14:49.935>most <00:14:50.075>of <00:14:50.215>the <00:14:50.355>websites <00:14:50.495>use <00:14:50.635>custom <00:14:50.775>font.

284
00:14:53.305 --> 00:14:54.245
<00:14:53.305>Uh, <00:14:53.587>they're <00:14:53.869>important <00:14:54.151>for

285
00:14:54.245 --> 00:14:55.445
<00:14:54.245>branding, <00:14:54.515>they're <00:14:54.785>important <00:14:55.055>for <00:14:55.325>design.

286
00:14:55.905 --> 00:14:57.765
<00:14:55.905>Uh, <00:14:56.079>they, <00:14:56.255>they <00:14:56.430>look <00:14:56.605>better <00:14:56.780>if <00:14:56.954>they're <00:14:57.130>in <00:14:57.305>place.

287
00:14:58.275 --> 00:15:01.685
<00:14:58.275>However, <00:14:58.555>performance <00:14:58.834>should <00:14:59.115>not <00:14:59.395>be <00:14:59.675>compromised.

288
00:15:02.585 --> 00:15:06.205
<00:15:02.585>And, <00:15:02.725>uh, <00:15:02.865>traditionally <00:15:03.005>what <00:15:03.145>you <00:15:03.285>would <00:15:03.425>do, <00:15:03.565>what <00:15:03.705>I <00:15:03.845>did <00:15:03.985>here,

289
00:15:07.635 --> 00:15:12.135
<00:15:07.635>uh, <00:15:07.868>is <00:15:08.101>that <00:15:08.335>I <00:15:08.568>implemented <00:15:08.801>the <00:15:09.035>font

290
00:15:12.365 --> 00:15:14.015
<00:15:12.365>with <00:15:12.645>a <00:15:12.925>very <00:15:13.205>simple <00:15:13.485>link <00:15:13.765>tag.

291
00:15:14.835 --> 00:15:17.575
<00:15:14.835>And <00:15:15.035>well, <00:15:15.235>that's <00:15:15.435>also <00:15:15.635>something <00:15:15.835>you <00:15:16.035>can <00:15:16.235>do.

292
00:15:17.795 --> 00:15:19.575
<00:15:17.795>But <00:15:18.074>it <00:15:18.354>comes <00:15:18.635>with <00:15:18.915>the <00:15:19.194>downside

293
00:15:19.675 --> 00:15:21.895
<00:15:19.675>of <00:15:19.954>producing <00:15:20.234>an <00:15:20.515>extra <00:15:20.795>network <00:15:21.074>request.

294
00:15:22.875 --> 00:15:26.975
<00:15:22.875>And <00:15:23.108>well, <00:15:23.341>This <00:15:23.575>blocks <00:15:23.808>the <00:15:24.041>rendering <00:15:24.275>process.

295
00:15:27.435 --> 00:15:30.055
<00:15:27.435>So <00:15:27.590>we <00:15:27.746>are <00:15:27.901>losing <00:15:28.057>time <00:15:28.212>here <00:15:28.368>that <00:15:28.523>we <00:15:28.679>could <00:15:28.834>use

296
00:15:30.355 --> 00:15:32.975
<00:15:30.355>to <00:15:30.510>load <00:15:30.666>something <00:15:30.821>else <00:15:30.977>that <00:15:31.132>we <00:15:31.288>would <00:15:31.443>need <00:15:31.599>on <00:15:31.755>application.

297
00:15:33.915 --> 00:15:36.695
<00:15:33.915>And <00:15:34.070>even <00:15:34.226>worst <00:15:34.381>case, <00:15:34.537>if <00:15:34.692>the <00:15:34.848>internet <00:15:35.003>is <00:15:35.159>so <00:15:35.314>slow,

298
00:15:37.085 --> 00:15:39.735
<00:15:37.085>this <00:15:37.285>could <00:15:37.485>even <00:15:37.685>result <00:15:37.885>in <00:15:38.085>the <00:15:38.285>potential <00:15:38.485>flicker

299
00:15:39.755 --> 00:15:41.055
<00:15:39.755>of <00:15:40.145>the <00:15:40.535>unile <00:15:40.925>text

300
00:15:41.275 --> 00:15:44.215
<00:15:41.275>before <00:15:41.475>the <00:15:41.675>actual <00:15:41.875>fancy <00:15:42.074>SS <00:15:42.275>has <00:15:42.475>been <00:15:42.675>loaded.

301
00:15:44.875 --> 00:15:48.255
<00:15:44.875>So <00:15:45.075>we <00:15:45.275>don't <00:15:45.475>want <00:15:45.675>this. <00:15:45.875>And <00:15:46.075>looking <00:15:46.275>at

302
00:15:48.845 --> 00:15:52.695
<00:15:48.845>what <00:15:48.972>next <00:15:49.099>JS <00:15:49.226>has <00:15:49.354>to <00:15:49.481>offer <00:15:49.608>here, <00:15:49.735>uh, <00:15:49.863>I <00:15:49.990>was <00:15:50.117>pretty <00:15:50.245>happy

303
00:15:52.695 --> 00:15:57.575
<00:15:52.695>to <00:15:52.835>see <00:15:52.975>that <00:15:53.115>it's <00:15:53.255>actually <00:15:53.395>super <00:15:53.535>easy, <00:15:53.675>um, <00:15:53.815>to <00:15:53.955>implement <00:15:54.095>funds

304
00:15:57.575 --> 00:16:00.855
<00:15:57.575>with <00:15:57.730>next <00:15:57.886>JS <00:15:58.041>because <00:15:58.197>it <00:15:58.352>has <00:15:58.508>the <00:15:58.663>capability <00:15:58.819>to <00:15:58.975>automatically,

305
00:16:01.515 --> 00:16:04.055
<00:16:01.515>um, <00:16:02.215>include <00:16:02.915>the

306
00:16:04.155 --> 00:16:06.575
<00:16:04.155>or <00:16:04.355>inline <00:16:04.555>the <00:16:04.755>fund <00:16:04.954>CSS <00:16:05.155>at <00:16:05.355>build <00:16:05.555>time.

307
00:16:07.595 --> 00:16:11.735
<00:16:07.595>And <00:16:07.735>what <00:16:07.875>this <00:16:08.015>does <00:16:08.155>is <00:16:08.295>it <00:16:08.435>eliminates <00:16:08.575>the <00:16:08.715>extra <00:16:08.855>round <00:16:08.995>trip

308
00:16:11.835 --> 00:16:14.295
<00:16:11.835>to <00:16:11.990>go <00:16:12.146>to <00:16:12.301>the <00:16:12.457>server <00:16:12.612>and <00:16:12.768>fetch <00:16:12.923>the <00:16:13.079>font <00:16:13.235>declarations

309
00:16:15.115 --> 00:16:19.615
<00:16:15.115>and, <00:16:15.315>uh, <00:16:15.515>gives <00:16:15.715>you <00:16:15.915>space, <00:16:16.115>uh, <00:16:16.315>to <00:16:16.515>load

310
00:16:20.395 --> 00:16:21.855
<00:16:20.395>the <00:16:20.540>things <00:16:20.687>that <00:16:20.833>you <00:16:20.979>need <00:16:21.125>to <00:16:21.271>load <00:16:21.417>in <00:16:21.563>the <00:16:21.709>beginning.

311
00:16:22.635 --> 00:16:26.775
<00:16:22.635>So <00:16:22.868>I <00:16:23.101>was <00:16:23.335>also <00:16:23.568>extra <00:16:23.801>lucky, <00:16:24.035>uh,

312
00:16:26.775 --> 00:16:28.975
<00:16:26.775>because <00:16:26.949>I <00:16:27.125>was <00:16:27.300>using <00:16:27.475>a <00:16:27.650>Google <00:16:27.824>fund <00:16:28.000>here, <00:16:28.175>uh,

313
00:16:28.975 --> 00:16:31.095
<00:16:28.975>pretty <00:16:29.441>common <00:16:29.908>I <00:16:30.375>guess.

314
00:16:31.755 --> 00:16:36.135
<00:16:31.755>And <00:16:31.930>I <00:16:32.105>found <00:16:32.280>out <00:16:32.455>that <00:16:32.630>for <00:16:32.805>X <00:16:32.980>js, <00:16:33.155>uh,

315
00:16:36.195 --> 00:16:38.335
<00:16:36.195>you <00:16:36.545>can <00:16:36.895>actually <00:16:37.245>include, <00:16:37.595>well,

316
00:16:38.335 --> 00:16:40.535
<00:16:38.335>it <00:16:38.615>automatically <00:16:38.895>self <00:16:39.175>hosts <00:16:39.455>Google <00:16:39.735>Fund

317
00:16:41.035 --> 00:16:43.135
<00:16:41.035>and <00:16:41.235>it <00:16:41.435>would <00:16:41.635>be <00:16:41.834>included <00:16:42.035>in <00:16:42.235>the <00:16:42.435>deployment

318
00:16:43.135 --> 00:16:45.095
<00:16:43.135>and <00:16:43.368>served <00:16:43.601>from <00:16:43.835>the <00:16:44.068>same <00:16:44.301>domain <00:16:44.535>so

319
00:16:45.095 --> 00:16:47.455
<00:16:45.095>that <00:16:45.270>this <00:16:45.445>extra <00:16:45.620>round <00:16:45.795>trip <00:16:45.970>doesn't <00:16:46.145>need <00:16:46.320>to <00:16:46.495>happen.

320
00:16:48.195 --> 00:16:51.615
<00:16:48.195>And, <00:16:48.322>uh, <00:16:48.449>no <00:16:48.576>browser <00:16:48.704>requests <00:16:48.831>will <00:16:48.958>need <00:16:49.085>to <00:16:49.213>be <00:16:49.340>sent <00:16:49.467>to <00:16:49.595>Google.

321
00:16:55.515 --> 00:16:57.365
<00:16:55.515>Looking <00:16:55.795>at <00:16:56.074>the <00:16:56.355>result <00:16:56.635>of <00:16:56.915>this,

322
00:17:00.505 --> 00:17:03.125
<00:17:00.505>it <00:17:00.645>might <00:17:00.785>be <00:17:00.925>my <00:17:01.064>thumb <00:17:01.205>not <00:17:01.345>pressing <00:17:01.485>hard <00:17:01.625>enough, <00:17:01.765>I <00:17:01.905>guess.

323
00:17:09.565 --> 00:17:12.025
<00:17:09.565>So <00:17:09.720>I'm <00:17:09.876>going <00:17:10.031>to <00:17:10.187>the <00:17:10.342>next <00:17:10.498>slide <00:17:10.653>in <00:17:10.809>a <00:17:10.965>minute.

324
00:17:15.725 --> 00:17:16.865
<00:17:15.724>That's <00:17:16.751>hilarious.

325
00:17:17.605 --> 00:17:19.025
<00:17:17.605>It <00:17:17.924>says <00:17:18.244>PowerPoint <00:17:18.563>is <00:17:18.883>not

326
00:17:19.385 --> 00:17:22.915
<00:17:19.385>reacting <00:17:20.085>sad <00:17:20.785>PowerPoint.

327
00:17:23.495 --> 00:17:26.315
<00:17:23.494>Uh, <00:17:23.694>well <00:17:23.895>maybe <00:17:24.094>then <00:17:24.294>for <00:17:24.494>now, <00:17:24.694>just <00:17:24.895>imagine,

328
00:17:30.225 --> 00:17:32.275
<00:17:30.225>imagine <00:17:30.504>that <00:17:30.784>the <00:17:31.064>fund <00:17:31.344>has <00:17:31.625>been,

329
00:17:35.525 --> 00:17:36.625
<00:17:35.525>Has <00:17:36.020>been <00:17:36.515>optimized

330
00:17:36.685 --> 00:17:38.585
<00:17:36.685>and <00:17:36.885>you <00:17:37.085>have <00:17:37.284>a <00:17:37.485>better <00:17:37.685>performance <00:17:37.885>score <00:17:38.085>now.

331
00:17:39.645 --> 00:17:41.345
<00:17:39.645>Ah, <00:17:40.111>makes <00:17:40.578>me <00:17:41.045>sad.

332
00:17:41.845 --> 00:17:44.825
<00:17:41.845>So, <00:17:41.985>um, <00:17:42.125>I <00:17:42.265>think <00:17:42.405>we're <00:17:42.545>gonna <00:17:42.685>be <00:17:42.825>back <00:17:42.965>in <00:17:43.105>a <00:17:43.245>minute.

333
00:17:45.165 --> 00:17:48.265
<00:17:45.165>Oh, <00:17:45.340>I <00:17:45.514>think <00:17:45.690>we <00:17:45.865>are <00:17:46.040>back. <00:17:46.215>Yes, <00:17:46.389>we're <00:17:46.565>amazing.

334
00:17:48.805 --> 00:17:52.885
<00:17:48.805>So <00:17:48.980>better, <00:17:49.155>uh, <00:17:49.330>performance <00:17:49.505>scores <00:17:49.680>you <00:17:49.855>could <00:17:50.030>see. <00:17:50.205>Yay.

335
00:17:53.025 --> 00:17:56.205
<00:17:53.025>We <00:17:53.180>climbed <00:17:53.336>the <00:17:53.491>ladder <00:17:53.647>up <00:17:53.802>to <00:17:53.958>75. <00:17:54.113>That's <00:17:54.269>really <00:17:54.425>cool.

336
00:17:56.985 --> 00:18:00.765
<00:17:56.985>So <00:17:57.218>I <00:17:57.451>think <00:17:57.685>my <00:17:57.918>drawing <00:17:58.151>is <00:17:58.385>somewhat

337
00:18:01.765 --> 00:18:03.365
<00:18:01.765>a <00:18:01.998>bit <00:18:02.231>of <00:18:02.465>a <00:18:02.698>3D <00:18:02.931>thingy <00:18:03.165>now.

338
00:18:03.535 --> 00:18:05.325
<00:18:03.535>Still <00:18:03.768>not <00:18:04.001>the <00:18:04.235>best <00:18:04.468>you've <00:18:04.701>ever <00:18:04.935>seen,

339
00:18:05.505 --> 00:18:08.285
<00:18:05.505>but <00:18:05.738>hey, <00:18:05.971>we <00:18:06.205>did <00:18:06.438>make <00:18:06.671>some <00:18:06.905>improvement.

340
00:18:10.385 --> 00:18:14.885
<00:18:10.385>So <00:18:10.512>now <00:18:10.639>let's <00:18:10.766>hop <00:18:10.894>onto <00:18:11.021>something <00:18:11.148>that <00:18:11.275>is <00:18:11.403>a <00:18:11.530>bit <00:18:11.657>more, <00:18:11.785>uh,

341
00:18:16.435 --> 00:18:18.445
<00:18:16.435>sophisticated, <00:18:16.901>maybe <00:18:17.368>not <00:18:17.835>sure.

342
00:18:18.985 --> 00:18:22.965
<00:18:18.985>Um, <00:18:19.112>what <00:18:19.239>I <00:18:19.366>did <00:18:19.494>in <00:18:19.621>my <00:18:19.748>wine <00:18:19.875>application <00:18:20.003>is <00:18:20.130>that <00:18:20.257>I <00:18:20.385>wanted

343
00:18:22.965 --> 00:18:27.445
<00:18:22.965>to <00:18:23.165>have <00:18:23.365>a <00:18:23.564>search <00:18:23.764>functionality <00:18:23.965>search <00:18:24.165>feature <00:18:24.365>so

344
00:18:27.445 --> 00:18:30.005
<00:18:27.445>that <00:18:27.585>if <00:18:27.725>you <00:18:27.865>have <00:18:28.004>a <00:18:28.145>favorite <00:18:28.284>wine <00:18:28.425>already, <00:18:28.564>you're <00:18:28.705>not <00:18:28.845>the

345
00:18:30.005 --> 00:18:31.405
<00:18:30.005>as <00:18:30.425>indecisive <00:18:30.845>as <00:18:31.264>me.

346
00:18:31.865 --> 00:18:34.085
<00:18:31.865>You <00:18:32.020>can <00:18:32.176>just <00:18:32.331>type, <00:18:32.487>uh, <00:18:32.642>the <00:18:32.798>name <00:18:32.953>of <00:18:33.109>the <00:18:33.265>wine

347
00:18:34.105 --> 00:18:35.085
<00:18:34.105>or <00:18:34.325>where <00:18:34.546>it <00:18:34.766>comes <00:18:34.987>from,

348
00:18:35.465 --> 00:18:36.685
<00:18:35.465>and <00:18:35.648>then <00:18:35.831>you <00:18:36.014>would <00:18:36.197>receive <00:18:36.379>an <00:18:36.562>answer.

349
00:18:37.545 --> 00:18:41.685
<00:18:37.545>And <00:18:37.700>for <00:18:37.856>this, <00:18:38.011>I <00:18:38.167>used, <00:18:38.322>uh, <00:18:38.478>library <00:18:38.633>that <00:18:38.789>is <00:18:38.945>called,

350
00:18:42.825 --> 00:18:44.805
<00:18:42.825>uh, <00:18:43.058>fuse, <00:18:43.291>that's <00:18:43.525>the <00:18:43.758>name <00:18:43.991>of <00:18:44.225>it.

351
00:18:45.505 --> 00:18:47.085
<00:18:45.505>And, <00:18:46.205>uh, <00:18:46.905>well,

352
00:18:47.325 --> 00:18:49.565
<00:18:47.325>I <00:18:47.465>implemented <00:18:47.605>it <00:18:47.745>the <00:18:47.885>way <00:18:48.025>you <00:18:48.165>can <00:18:48.305>see <00:18:48.445>in <00:18:48.585>my <00:18:48.725>little

353
00:18:49.755 --> 00:18:51.045
<00:18:49.755>soil <00:18:50.142>code <00:18:50.529>thingy <00:18:50.916>here.

354
00:18:51.785 --> 00:18:56.085
<00:18:51.785>Uh, <00:18:51.912>I <00:18:52.039>just <00:18:52.166>used <00:18:52.294>the <00:18:52.421>on <00:18:52.548>change <00:18:52.675>event <00:18:52.803>to <00:18:52.930>make <00:18:53.057>it, <00:18:53.185>to,

355
00:18:56.085 --> 00:18:57.365
<00:18:56.085>to <00:18:56.277>implement <00:18:56.469>it, <00:18:56.661>to <00:18:56.853>make <00:18:57.045>it <00:18:57.237>happen.

356
00:18:58.265 --> 00:19:02.005
<00:18:58.265>Uh, <00:18:58.545>however, <00:18:58.825>this <00:18:59.105>would <00:18:59.385>come <00:18:59.665>with,

357
00:19:03.065 --> 00:19:06.765
<00:19:03.065>uh, <00:19:03.205>higher <00:19:03.345>amount <00:19:03.485>of <00:19:03.625>JavaScript, <00:19:03.765>uh, <00:19:03.905>that <00:19:04.045>needs <00:19:04.185>to <00:19:04.325>be <00:19:04.465>loaded

358
00:19:06.765 --> 00:19:09.285
<00:19:06.765>during <00:19:07.045>the <00:19:07.325>initial <00:19:07.605>page <00:19:07.885>load, <00:19:08.165>obviously.

359
00:19:10.025 --> 00:19:13.485
<00:19:10.025>And, <00:19:10.180>uh, <00:19:10.336>yeah, <00:19:10.491>before <00:19:10.647>optimizing <00:19:10.802>this <00:19:10.958>with <00:19:11.113>next <00:19:11.269>js, <00:19:11.425>uh,

360
00:19:13.685 --> 00:19:15.365
<00:19:13.685>I <00:19:13.965>forced <00:19:14.245>my <00:19:14.524>browser <00:19:14.804>to <00:19:15.085>download

361
00:19:15.465 --> 00:19:19.725
<00:19:15.465>and, <00:19:15.639>uh, <00:19:15.814>price <00:19:15.990>more <00:19:16.165>JavaScript <00:19:16.340>than <00:19:16.514>I <00:19:16.689>actually <00:19:16.865>need

362
00:19:19.725 --> 00:19:21.205
<00:19:19.725>because <00:19:20.168>it <00:19:20.612>might <00:19:21.057>be

363
00:19:21.205 --> 00:19:23.965
<00:19:21.205>that <00:19:21.360>my <00:19:21.516>user <00:19:21.671>would <00:19:21.827>not <00:19:21.982>even <00:19:22.138>use <00:19:22.293>the <00:19:22.449>search <00:19:22.605>functionality.

364
00:19:24.425 --> 00:19:25.765
<00:19:24.425>And <00:19:24.726>then <00:19:25.028>it's <00:19:25.329>very <00:19:25.631>unnecessary

365
00:19:26.195 --> 00:19:27.725
<00:19:26.195>that <00:19:26.391>I <00:19:26.588>loaded <00:19:26.785>this <00:19:26.981>in <00:19:27.178>the <00:19:27.375>very <00:19:27.572>beginning.

366
00:19:29.645 --> 00:19:34.225
<00:19:29.645>So <00:19:29.845>what <00:19:30.045>we <00:19:30.245>can <00:19:30.445>do <00:19:30.645>here <00:19:30.845>is, <00:19:31.045>um,

367
00:19:35.245 --> 00:19:37.145
<00:19:35.245>use <00:19:35.524>the <00:19:35.804>ECMO <00:19:36.084>script <00:19:36.364>dynamic <00:19:36.645>import,

368
00:19:37.565 --> 00:19:39.585
<00:19:37.565>and <00:19:37.765>next <00:19:37.965>gen <00:19:38.165>supports <00:19:38.365>this, <00:19:38.565>which <00:19:38.765>is <00:19:38.965>great,

369
00:19:40.165 --> 00:19:42.665
<00:19:40.165>and <00:19:40.365>it <00:19:40.565>even <00:19:40.764>works <00:19:40.965>with <00:19:41.165>server <00:19:41.365>site <00:19:41.565>rendering.

370
00:19:43.325 --> 00:19:45.185
<00:19:43.325>So <00:19:43.675>instead <00:19:44.025>of, <00:19:44.375>uh, <00:19:44.725>importing

371
00:19:45.185 --> 00:19:48.785
<00:19:45.185>and <00:19:45.325>declaring <00:19:45.465>it <00:19:45.605>ahead <00:19:45.745>of <00:19:45.885>time, <00:19:46.024>we <00:19:46.165>can <00:19:46.304>now <00:19:46.445>import, <00:19:46.585>uh,

372
00:19:48.885 --> 00:19:53.425
<00:19:48.885>the <00:19:49.025>module <00:19:49.165>dynamically <00:19:49.305>just <00:19:49.445>as <00:19:49.585>soon <00:19:49.725>as <00:19:49.865>the <00:19:50.004>user <00:19:50.145>requests <00:19:50.285>it.

373
00:19:56.165 --> 00:19:59.025
<00:19:56.165>And <00:19:56.340>this <00:19:56.514>would <00:19:56.690>lead <00:19:56.865>to <00:19:57.040>a <00:19:57.215>improved <00:19:57.389>user <00:19:57.565>experience.

374
00:20:07.225 --> 00:20:10.395
<00:20:07.225>Yeah, <00:20:07.691>thanks. <00:20:08.158>Um, <00:20:08.625>okay.

375
00:20:10.575 --> 00:20:15.115
<00:20:10.575>So <00:20:10.715>we, <00:20:10.855>uh, <00:20:10.995>stay <00:20:11.135>in <00:20:11.275>the <00:20:11.415>import <00:20:11.555>world <00:20:11.695>for <00:20:11.835>a <00:20:11.975>bit

376
00:20:15.495 --> 00:20:18.435
<00:20:15.495>and <00:20:15.695>the <00:20:15.895>import <00:20:16.094>optimization <00:20:16.294>world, <00:20:16.495>let's <00:20:16.695>say, <00:20:16.895>uh,

377
00:20:18.435 --> 00:20:22.955
<00:20:18.435>because <00:20:18.590>what <00:20:18.746>I <00:20:18.901>also <00:20:19.057>found <00:20:19.212>my <00:20:19.368>wine <00:20:19.523>application <00:20:19.679>would <00:20:19.835>need

378
00:20:23.415 --> 00:20:26.675
<00:20:23.415>is, <00:20:23.590>uh, <00:20:23.764>a <00:20:23.940>little <00:20:24.115>popover, <00:20:24.290>uh, <00:20:24.465>that <00:20:24.639>would <00:20:24.815>come

379
00:20:26.675 --> 00:20:27.795
<00:20:26.675>and <00:20:26.927>give <00:20:27.179>you <00:20:27.431>the <00:20:27.683>possibility

380
00:20:28.055 --> 00:20:31.435
<00:20:28.055>to <00:20:28.171>reserve <00:20:28.288>your <00:20:28.405>table <00:20:28.521>in <00:20:28.638>the <00:20:28.755>bar <00:20:28.871>the <00:20:28.988>next <00:20:29.105>time <00:20:29.221>you <00:20:29.338>show <00:20:29.455>up.

381
00:20:32.375 --> 00:20:34.275
<00:20:32.375>And, <00:20:32.841>uh, <00:20:33.308>for <00:20:33.775>this,

382
00:20:34.515 --> 00:20:37.675
<00:20:34.515>I <00:20:34.715>just <00:20:34.915>implemented <00:20:35.115>a <00:20:35.315>new <00:20:35.515>Rec <00:20:35.715>React <00:20:35.915>component

383
00:20:38.575 --> 00:20:40.595
<00:20:38.575>and, <00:20:38.808>uh, <00:20:39.041>this <00:20:39.275>one <00:20:39.508>was <00:20:39.741>also <00:20:39.975>not

384
00:20:41.195 --> 00:20:43.515
<00:20:41.195>actually <00:20:41.395>needed <00:20:41.595>on <00:20:41.794>the <00:20:41.995>initial <00:20:42.195>page <00:20:42.395>load, <00:20:42.595>obviously,

385
00:20:43.515 --> 00:20:45.115
<00:20:43.515>because <00:20:43.690>it <00:20:43.865>could <00:20:44.040>be <00:20:44.215>that <00:20:44.390>it's <00:20:44.565>not <00:20:44.740>even <00:20:44.915>opened.

386
00:20:46.055 --> 00:20:50.925
<00:20:46.055>Um, <00:20:46.755>so <00:20:47.455>Yeah,

387
00:20:51.545 --> 00:20:54.765
<00:20:51.545>uh, <00:20:51.672>this <00:20:51.799>would <00:20:51.926>also <00:20:52.054>kind <00:20:52.181>of <00:20:52.308>end <00:20:52.435>up <00:20:52.563>in <00:20:52.690>the <00:20:52.817>same <00:20:52.945>mess

388
00:20:54.765 --> 00:20:57.805
<00:20:54.765>that <00:20:54.920>I <00:20:55.076>had <00:20:55.231>before <00:20:55.387>that <00:20:55.542>I <00:20:55.698>increased <00:20:55.853>my <00:20:56.009>initial <00:20:56.165>bundle

389
00:20:57.875 --> 00:20:59.085
<00:20:57.875>size <00:20:58.238>for <00:20:58.601>no <00:20:58.964>reason.

390
00:21:00.145 --> 00:21:04.365
<00:21:00.145>And <00:21:00.285>to <00:21:00.425>change <00:21:00.565>this <00:21:00.705>here, <00:21:00.845>there <00:21:00.985>were <00:21:01.125>two <00:21:01.264>options <00:21:01.405>for <00:21:01.545>me.

391
00:21:04.745 --> 00:21:08.005
<00:21:04.745>Uh, <00:21:04.900>so <00:21:05.056>one <00:21:05.211>would <00:21:05.367>be <00:21:05.522>to <00:21:05.678>use <00:21:05.833>the <00:21:05.989>dynamic <00:21:06.145>import

392
00:21:08.035 --> 00:21:09.725
<00:21:08.035>that <00:21:08.315>next <00:21:08.595>JS <00:21:08.875>comes <00:21:09.155>equipped <00:21:09.435>with,

393
00:21:10.505 --> 00:21:11.565
<00:21:10.505>and <00:21:10.695>the <00:21:10.886>other <00:21:11.077>one <00:21:11.268>would <00:21:11.459>be

394
00:21:11.565 --> 00:21:14.445
<00:21:11.565>to <00:21:11.798>just <00:21:12.031>use <00:21:12.265>React <00:21:12.498>lazy <00:21:12.731>with <00:21:12.965>suspense.

395
00:21:15.345 --> 00:21:18.845
<00:21:15.345>But <00:21:15.472>I <00:21:15.599>opted, <00:21:15.726>as <00:21:15.854>I'm, <00:21:15.981>uh, <00:21:16.108>looking <00:21:16.235>at <00:21:16.363>next <00:21:16.490>J <00:21:16.617>stuff <00:21:16.745>here,

396
00:21:18.925 --> 00:21:22.005
<00:21:18.925>I <00:21:19.080>opted <00:21:19.236>for <00:21:19.391>the <00:21:19.547>next <00:21:19.702>Js <00:21:19.858>uh, <00:21:20.013>version <00:21:20.169>of <00:21:20.325>it.

397
00:21:23.705 --> 00:21:27.445
<00:21:23.705>And <00:21:23.905>this <00:21:24.105>gave <00:21:24.304>me <00:21:24.504>a <00:21:24.705>good <00:21:24.905>opportunity <00:21:25.105>for,

398
00:21:28.225 --> 00:21:32.365
<00:21:28.225>to <00:21:28.399>actually <00:21:28.574>implement <00:21:28.750>my, <00:21:28.925>well, <00:21:29.100>to <00:21:29.274>make <00:21:29.449>this <00:21:29.625>kind

399
00:21:32.365 --> 00:21:34.885
<00:21:32.365>of <00:21:32.645>my <00:21:32.925>custom <00:21:33.205>loading <00:21:33.485>strategy <00:21:33.765>by

400
00:21:35.525 --> 00:21:37.325
<00:21:35.525>implementing <00:21:35.805>it <00:21:36.085>in <00:21:36.365>a <00:21:36.645>different <00:21:36.925>way

401
00:21:37.905 --> 00:21:39.005
<00:21:37.905>and <00:21:38.400>making <00:21:38.895>sure

402
00:21:39.005 --> 00:21:41.725
<00:21:39.005>that <00:21:39.205>I <00:21:39.405>would <00:21:39.605>have <00:21:39.805>faster <00:21:40.005>initial <00:21:40.205>loading <00:21:40.405>times.

403
00:21:42.545 --> 00:21:45.205
<00:21:42.545>And <00:21:42.685>this <00:21:42.825>might <00:21:42.965>not <00:21:43.105>be <00:21:43.245>the <00:21:43.385>most <00:21:43.525>important <00:21:43.665>thing <00:21:43.805>to <00:21:43.945>do

404
00:21:45.865 --> 00:21:48.445
<00:21:45.865>if <00:21:46.020>you <00:21:46.176>build <00:21:46.331>a <00:21:46.487>little <00:21:46.642>wine <00:21:46.798>application <00:21:46.953>with <00:21:47.109>one <00:21:47.265>popover.

405
00:21:49.545 --> 00:21:52.525
<00:21:49.545>Uh, <00:21:49.700>but <00:21:49.856>it <00:21:50.011>pays <00:21:50.167>off <00:21:50.322>when <00:21:50.478>it <00:21:50.633>comes <00:21:50.789>to <00:21:50.945>scalability

406
00:21:52.755 --> 00:21:54.125
<00:21:52.755>because <00:21:53.063>your <00:21:53.371>app <00:21:53.679>might <00:21:53.988>grow

407
00:21:54.225 --> 00:21:55.845
<00:21:54.225>and <00:21:54.504>you <00:21:54.784>might <00:21:55.064>have <00:21:55.344>more <00:21:55.625>components

408
00:21:55.915 --> 00:21:57.365
<00:21:55.915>that <00:21:56.350>don't <00:21:56.785>necessarily <00:21:57.220>need

409
00:21:57.365 --> 00:21:58.405
<00:21:57.365>to <00:21:57.521>be <00:21:57.677>loaded <00:21:57.833>in <00:21:57.989>the <00:21:58.145>very <00:21:58.301>beginning.

410
00:22:03.145 --> 00:22:07.965
<00:22:03.145>So <00:22:03.378>after, <00:22:03.611>uh, <00:22:03.845>optimizing <00:22:04.078>dynamic <00:22:04.311>imports, <00:22:04.545>uh,

411
00:22:08.145 --> 00:22:12.605
<00:22:08.145>in <00:22:08.272>those <00:22:08.399>two <00:22:08.526>ways <00:22:08.654>that <00:22:08.781>I <00:22:08.908>just <00:22:09.035>showed <00:22:09.163>you, <00:22:09.290>I <00:22:09.417>received <00:22:09.545>this,

412
00:22:13.065 --> 00:22:16.165
<00:22:13.065>uh, <00:22:13.345>again, <00:22:13.625>uh, <00:22:13.905>improved <00:22:14.185>performance <00:22:14.465>score,

413
00:22:16.295 --> 00:22:17.685
<00:22:16.295>which <00:22:16.503>I <00:22:16.712>was <00:22:16.920>very <00:22:17.129>happy <00:22:17.337>to <00:22:17.546>see.

414
00:22:18.955 --> 00:22:22.135
<00:22:18.955>And, <00:22:19.235>uh, <00:22:19.514>with <00:22:19.794>that <00:22:20.074>I <00:22:20.355>kind

415
00:22:22.135 --> 00:22:25.215
<00:22:22.135>of <00:22:22.310>brought <00:22:22.485>the <00:22:22.660>colors <00:22:22.835>back <00:22:23.010>into <00:22:23.185>my <00:22:23.360>little <00:22:23.535>drawing,

416
00:22:26.395 --> 00:22:28.895
<00:22:26.395>and <00:22:26.570>I <00:22:26.745>thought <00:22:26.920>to <00:22:27.095>myself, <00:22:27.270>well, <00:22:27.445>I <00:22:27.620>think, <00:22:27.795>uh,

417
00:22:28.895 --> 00:22:31.855
<00:22:28.895>things <00:22:29.095>are <00:22:29.295>already <00:22:29.495>going <00:22:29.695>quite <00:22:29.895>well, <00:22:30.095>uh, <00:22:30.295>anyway,

418
00:22:31.855 --> 00:22:34.095
<00:22:31.855>maybe <00:22:32.010>there's, <00:22:32.166>there's <00:22:32.321>another <00:22:32.477>thing <00:22:32.632>that <00:22:32.788>I <00:22:32.943>can <00:22:33.099>look <00:22:33.255>at

419
00:22:34.405 --> 00:22:38.975
<00:22:34.405>that <00:22:34.512>comes <00:22:34.620>into <00:22:34.728>my <00:22:34.835>view <00:22:34.943>if <00:22:35.051>I <00:22:35.158>check <00:22:35.266>what <00:22:35.374>next <00:22:35.481>j <00:22:35.589>SFS <00:22:35.697>to <00:22:35.805>offer.

420
00:22:39.875 --> 00:22:40.975
<00:22:39.875>So <00:22:40.205>I <00:22:40.534>went <00:22:40.865>on

421
00:22:41.195 --> 00:22:45.305
<00:22:41.195>and <00:22:41.428>I <00:22:41.661>found <00:22:41.895>one <00:22:42.128>last <00:22:42.361>optimization <00:22:42.595>opportunity

422
00:22:46.125 --> 00:22:48.745
<00:22:46.125>and <00:22:46.475>noticed <00:22:46.825>the <00:22:47.175>script <00:22:47.525>optimization.

423
00:22:49.645 --> 00:22:53.665
<00:22:49.645>Now <00:22:49.925>many <00:22:50.205>applications <00:22:50.485>use <00:22:50.764>some <00:22:51.045>sort

424
00:22:53.665 --> 00:22:54.745
<00:22:53.665>of <00:22:53.989>third <00:22:54.312>party <00:22:54.637>script.

425
00:22:55.605 --> 00:22:59.465
<00:22:55.605>Mm, <00:22:55.955>obviously <00:22:56.305>mine <00:22:56.655>would <00:22:57.005>not

426
00:22:59.535 --> 00:23:00.625
<00:22:59.535>need <00:22:59.862>to <00:23:00.189>have <00:23:00.516>this.

427
00:23:01.005 --> 00:23:05.585
<00:23:01.005>So <00:23:01.160>if <00:23:01.316>I, <00:23:01.471>I <00:23:01.627>didn't <00:23:01.782>wanna <00:23:01.938>a <00:23:02.093>Google <00:23:02.249>Analytics <00:23:02.405>style,

428
00:23:06.085 --> 00:23:08.225
<00:23:06.085>uh, <00:23:06.365>analyze <00:23:06.645>my <00:23:06.925>wine <00:23:07.205>consumption <00:23:07.485>here,

429
00:23:08.285 --> 00:23:09.345
<00:23:08.285>it <00:23:08.523>doesn't <00:23:08.762>make <00:23:09.000>any <00:23:09.239>sense.

430
00:23:09.965 --> 00:23:12.585
<00:23:09.965>But <00:23:10.139>still, <00:23:10.314>uh, <00:23:10.490>I <00:23:10.665>wanted <00:23:10.840>to <00:23:11.014>make <00:23:11.189>a <00:23:11.365>point

431
00:23:12.585 --> 00:23:14.545
<00:23:12.585>and <00:23:12.712>I <00:23:12.839>wanted <00:23:12.966>to <00:23:13.094>just <00:23:13.221>play <00:23:13.348>around <00:23:13.475>with <00:23:13.603>this <00:23:13.730>for <00:23:13.857>a <00:23:13.985>bit.

432
00:23:15.085 --> 00:23:19.105
<00:23:15.085>Uh, <00:23:15.240>so <00:23:15.396>I <00:23:15.551>still <00:23:15.707>implemented, <00:23:15.862>uh, <00:23:16.018>some <00:23:16.173>scripts <00:23:16.329>here, <00:23:16.485>here.

433
00:23:19.965 --> 00:23:21.905
<00:23:19.965>And <00:23:20.198>what <00:23:20.431>you <00:23:20.665>would <00:23:20.898>normally <00:23:21.131>do, <00:23:21.365>uh,

434
00:23:22.045 --> 00:23:24.985
<00:23:22.045>is <00:23:22.278>you <00:23:22.511>would <00:23:22.745>manually <00:23:22.978>append <00:23:23.211>external <00:23:23.445>scripts

435
00:23:24.985 --> 00:23:28.185
<00:23:24.985>to <00:23:25.101>the <00:23:25.218>hat <00:23:25.334>tech, <00:23:25.451>and <00:23:25.568>then <00:23:25.685>you <00:23:25.801>would <00:23:25.918>just <00:23:26.034>live <00:23:26.151>with <00:23:26.268>the <00:23:26.385>fact

436
00:23:28.575 --> 00:23:30.505
<00:23:28.575>that, <00:23:28.925>uh, <00:23:29.275>it <00:23:29.625>can <00:23:29.975>potentially

437
00:23:30.505 --> 00:23:31.985
<00:23:30.505>block <00:23:30.838>resources <00:23:31.171>while <00:23:31.504>it's <00:23:31.837>loading.

438
00:23:32.965 --> 00:23:35.945
<00:23:32.965>And, <00:23:33.245>uh, <00:23:33.524>without <00:23:33.804>optimizing <00:23:34.084>these <00:23:34.365>things,

439
00:23:35.975 --> 00:23:37.945
<00:23:35.975>this <00:23:36.254>would <00:23:36.534>take <00:23:36.814>away <00:23:37.094>the <00:23:37.375>control

440
00:23:37.945 --> 00:23:41.065
<00:23:37.945>that <00:23:38.100>you <00:23:38.256>have <00:23:38.411>over <00:23:38.567>the <00:23:38.722>timing <00:23:38.878>of <00:23:39.033>the <00:23:39.189>script <00:23:39.345>execution,

441
00:23:41.475 --> 00:23:43.065
<00:23:41.475>which <00:23:41.675>is <00:23:41.875>not <00:23:42.074>a <00:23:42.274>good <00:23:42.475>thing <00:23:42.675>to <00:23:42.875>happen.

442
00:23:44.165 --> 00:23:48.605
<00:23:44.165>So <00:23:44.272>I <00:23:44.380>was <00:23:44.488>happy <00:23:44.595>when <00:23:44.703>I <00:23:44.811>found <00:23:44.918>out <00:23:45.026>that <00:23:45.134>Next <00:23:45.241>Js <00:23:45.349>uh, <00:23:45.457>helps <00:23:45.565>you

443
00:23:49.025 --> 00:23:53.965
<00:23:49.025>by <00:23:49.375>Providing <00:23:49.725>a <00:23:50.075>script, <00:23:50.425>uh,

444
00:23:53.995 --> 00:23:56.045
<00:23:53.995>that <00:23:54.274>you <00:23:54.554>can, <00:23:54.834>or <00:23:55.114>script <00:23:55.395>component

445
00:23:56.045 --> 00:23:59.005
<00:23:56.045>that <00:23:56.278>you <00:23:56.511>can <00:23:56.745>just <00:23:56.978>import <00:23:57.211>everywhere, <00:23:57.445>uh,

446
00:23:59.025 --> 00:24:01.405
<00:23:59.025>and <00:23:59.225>the <00:23:59.425>component, <00:23:59.625>wherever <00:23:59.825>you <00:24:00.025>wanna <00:24:00.225>use <00:24:00.425>it.

447
00:24:01.945 --> 00:24:05.685
<00:24:01.945>And <00:24:02.120>it <00:24:02.294>also <00:24:02.470>comes <00:24:02.645>with <00:24:02.820>the <00:24:02.995>possibility <00:24:03.169>to, <00:24:03.345>um,

448
00:24:06.625 --> 00:24:09.085
<00:24:06.625>be <00:24:06.858>more <00:24:07.091>precise <00:24:07.325>on <00:24:07.558>the <00:24:07.791>loading <00:24:08.025>strategy

449
00:24:09.155 --> 00:24:10.245
<00:24:09.155>that <00:24:09.400>you <00:24:09.645>wanted <00:24:09.890>to <00:24:10.136>follow.

450
00:24:10.585 --> 00:24:12.005
<00:24:10.585>So <00:24:10.798>the <00:24:11.011>one <00:24:11.224>I <00:24:11.437>used <00:24:11.650>here <00:24:11.863>is

451
00:24:12.175 --> 00:24:14.045
<00:24:12.175>after <00:24:12.524>interactive, <00:24:12.875>which <00:24:13.225>is <00:24:13.575>basically

452
00:24:14.045 --> 00:24:16.405
<00:24:14.045>after <00:24:14.278>the <00:24:14.511>page <00:24:14.745>has <00:24:14.978>already <00:24:15.211>become <00:24:15.445>interactive.

453
00:24:19.875 --> 00:24:22.005
<00:24:19.875>Yeah, <00:24:20.075>so <00:24:20.275>this <00:24:20.475>is <00:24:20.675>what <00:24:20.875>I <00:24:21.075>just <00:24:21.275>said,

454
00:24:22.105 --> 00:24:24.045
<00:24:22.105>the <00:24:22.455>simplified <00:24:22.805>the <00:24:23.155>script <00:24:23.505>management,

455
00:24:24.045 --> 00:24:26.485
<00:24:24.045>and <00:24:24.200>you <00:24:24.356>gain <00:24:24.511>the <00:24:24.667>control <00:24:24.822>back <00:24:24.978>that <00:24:25.133>you <00:24:25.289>actually <00:24:25.445>need,

456
00:24:26.785 --> 00:24:28.965
<00:24:26.785>and <00:24:26.985>you <00:24:27.185>have <00:24:27.385>more <00:24:27.585>flexibility <00:24:27.785>in <00:24:27.985>loading <00:24:28.185>scripts.

457
00:24:31.305 --> 00:24:33.845
<00:24:31.305>Now, <00:24:31.585>uh, <00:24:31.865>again, <00:24:32.145>I <00:24:32.425>found, <00:24:32.705>uh,

458
00:24:33.935 --> 00:24:37.085
<00:24:33.935>these <00:24:34.110>minor <00:24:34.284>things <00:24:34.460>can <00:24:34.635>potentially <00:24:34.810>really <00:24:34.985>make <00:24:35.159>a <00:24:35.335>difference

459
00:24:37.425 --> 00:24:39.645
<00:24:37.425>to <00:24:37.580>the <00:24:37.736>performance <00:24:37.891>of <00:24:38.047>your <00:24:38.202>app, <00:24:38.358>which <00:24:38.513>is <00:24:38.669>really <00:24:38.825>cool.

460
00:24:40.585 --> 00:24:44.525
<00:24:40.585>And, <00:24:40.725>uh, <00:24:40.865>after <00:24:41.005>all <00:24:41.145>the <00:24:41.285>things <00:24:41.425>I <00:24:41.565>played <00:24:41.705>around <00:24:41.845>with, <00:24:41.985>uh,

461
00:24:44.885 --> 00:24:46.125
<00:24:44.885>I <00:24:45.164>squashed <00:24:45.443>all <00:24:45.722>the <00:24:46.001>commits

462
00:24:46.125 --> 00:24:47.725
<00:24:46.125>and <00:24:46.325>I <00:24:46.525>cherry <00:24:46.725>picked <00:24:46.925>them <00:24:47.125>onto <00:24:47.325>one <00:24:47.525>branch.

463
00:24:47.985 --> 00:24:50.285
<00:24:47.985>And <00:24:48.159>I <00:24:48.334>wanted <00:24:48.510>to <00:24:48.685>know <00:24:48.860>did <00:24:49.034>I <00:24:49.209>actually <00:24:49.385>succeed

464
00:24:50.285 --> 00:24:54.245
<00:24:50.285>and <00:24:50.460>did <00:24:50.635>I <00:24:50.810>actually <00:24:50.985>manage <00:24:51.160>to <00:24:51.335>significantly <00:24:51.510>perform, <00:24:51.685>uh,

465
00:24:54.315 --> 00:24:56.005
<00:24:54.315>improve, <00:24:54.781>uh, <00:24:55.248>the <00:24:55.715>performance

466
00:24:56.005 --> 00:24:57.565
<00:24:56.005>of <00:24:56.285>the <00:24:56.565>application <00:24:56.845>that <00:24:57.125>I <00:24:57.405>built?

467
00:24:59.145 --> 00:25:01.685
<00:24:59.145>And <00:24:59.495>I <00:24:59.845>found <00:25:00.195>yes, <00:25:00.545>uh,

468
00:25:02.045 --> 00:25:05.445
<00:25:02.045>I <00:25:02.185>received <00:25:02.325>the <00:25:02.465>Conti <00:25:02.605>at <00:25:02.745>the <00:25:02.885>very <00:25:03.025>thank <00:25:03.165>you <00:25:03.305>so <00:25:03.445>much.

469
00:25:07.465 --> 00:25:09.765
<00:25:07.465>Uh, <00:25:07.665>yeah, <00:25:07.865>it's, <00:25:08.064>it's <00:25:08.264>actually, <00:25:08.465>it's <00:25:08.665>very <00:25:08.865>rewarding

470
00:25:09.765 --> 00:25:11.325
<00:25:09.765>to <00:25:10.045>see <00:25:10.325>the <00:25:10.605>Conti <00:25:10.885>happening <00:25:11.165>at

471
00:25:11.325 --> 00:25:12.405
<00:25:11.325>the <00:25:11.487>very <00:25:11.649>end <00:25:11.811>of <00:25:11.973>such <00:25:12.135>a <00:25:12.297>process.

472
00:25:13.265 --> 00:25:17.165
<00:25:13.265>And, <00:25:13.392>uh, <00:25:13.519>yeah, <00:25:13.646>I <00:25:13.774>think <00:25:13.901>at <00:25:14.028>this <00:25:14.155>point <00:25:14.283>I <00:25:14.410>went <00:25:14.537>full <00:25:14.665>Picasso.

473
00:25:17.165 --> 00:25:19.085
<00:25:17.165>It <00:25:17.365>was <00:25:17.565>a <00:25:17.764>great, <00:25:17.965>great <00:25:18.165>image <00:25:18.365>to <00:25:18.565>see.

474
00:25:20.105 --> 00:25:23.285
<00:25:20.105>Um, <00:25:20.305>to <00:25:20.505>sum <00:25:20.705>this <00:25:20.905>up <00:25:21.105>real <00:25:21.305>quick, <00:25:21.505>uh,

475
00:25:23.355 --> 00:25:25.605
<00:25:23.355>next <00:25:23.555>Js <00:25:23.755>uh, <00:25:23.955>what <00:25:24.155>did <00:25:24.355>we <00:25:24.555>just <00:25:24.755>learn?

476
00:25:25.665 --> 00:25:27.885
<00:25:25.665>We <00:25:25.898>learned <00:25:26.131>that <00:25:26.365>next <00:25:26.598>Js <00:25:26.831>uh, <00:25:27.065>comes

477
00:25:27.915 --> 00:25:30.885
<00:25:27.915>with <00:25:28.115>some <00:25:28.315>optimization <00:25:28.514>features <00:25:28.715>that <00:25:28.915>are <00:25:29.115>very <00:25:29.315>simple

478
00:25:31.305 --> 00:25:32.645
<00:25:31.305>to <00:25:31.546>implement <00:25:31.787>that <00:25:32.028>are <00:25:32.269>very <00:25:32.511>easy,

479
00:25:33.305 --> 00:25:35.525
<00:25:33.305>and <00:25:33.505>it's <00:25:33.705>not <00:25:33.905>a <00:25:34.105>lot <00:25:34.305>of <00:25:34.505>manual <00:25:34.705>effort.

480
00:25:36.345 --> 00:25:40.285
<00:25:36.345>Um, <00:25:36.485>though <00:25:36.625>it <00:25:36.765>can <00:25:36.905>help <00:25:37.045>you <00:25:37.185>to <00:25:37.325>perform, <00:25:37.465>uh, <00:25:37.605>uh, <00:25:37.745>yeah,

481
00:25:40.285 --> 00:25:43.725
<00:25:40.285>performance <00:25:40.565>optimization <00:25:40.845>and <00:25:41.125>here <00:25:41.405>listed <00:25:41.685>them.

482
00:25:43.785 --> 00:25:45.285
<00:25:43.785>You <00:25:44.055>already <00:25:44.325>saw <00:25:44.595>them <00:25:44.865>before. <00:25:45.135>Image

483
00:25:45.285 --> 00:25:46.765
<00:25:45.285>optimization, <00:25:45.951>fund <00:25:46.617>optimization.

484
00:25:47.225 --> 00:25:49.325
<00:25:47.225>You <00:25:47.425>can <00:25:47.625>optimize <00:25:47.824>the <00:25:48.024>way <00:25:48.225>you <00:25:48.425>import <00:25:48.625>things

485
00:25:49.785 --> 00:25:52.245
<00:25:49.785>and, <00:25:50.018>uh, <00:25:50.251>also <00:25:50.485>optimize <00:25:50.718>the <00:25:50.951>way <00:25:51.185>you

486
00:25:52.265 --> 00:25:54.125
<00:25:52.265>import <00:25:52.731>third <00:25:53.198>party <00:25:53.665>scripts.

487
00:25:54.785 --> 00:25:58.405
<00:25:54.785>And, <00:25:54.925>uh, <00:25:55.065>these <00:25:55.205>techniques, <00:25:55.345>I <00:25:55.485>mean, <00:25:55.625>it's <00:25:55.765>all <00:25:55.905>fun <00:25:56.045>and <00:25:56.185>games.

488
00:25:58.665 --> 00:25:59.765
<00:25:58.665>If <00:25:58.912>you <00:25:59.160>are <00:25:59.407>like <00:25:59.655>me

489
00:25:59.765 --> 00:26:02.685
<00:25:59.765>and <00:25:59.920>you <00:26:00.076>have <00:26:00.231>a <00:26:00.387>little <00:26:00.542>site <00:26:00.698>project <00:26:00.853>where <00:26:01.009>you, <00:26:01.165>uh,

490
00:26:02.715 --> 00:26:03.925
<00:26:02.715>just <00:26:02.987>build <00:26:03.259>something <00:26:03.531>for <00:26:03.803>fun

491
00:26:03.945 --> 00:26:06.645
<00:26:03.945>and <00:26:04.145>you <00:26:04.345>play <00:26:04.544>around <00:26:04.745>with <00:26:04.945>optimization <00:26:05.145>features, <00:26:05.345>uh,

492
00:26:06.705 --> 00:26:09.525
<00:26:06.705>but <00:26:06.845>at <00:26:06.985>some <00:26:07.125>point <00:26:07.264>you <00:26:07.405>might <00:26:07.544>come <00:26:07.685>into <00:26:07.824>a <00:26:07.965>situation <00:26:08.105>where

493
00:26:10.105 --> 00:26:11.965
<00:26:10.105>the <00:26:10.305>business <00:26:10.505>of <00:26:10.705>your <00:26:10.905>client <00:26:11.105>actually <00:26:11.305>depends <00:26:11.505>on

494
00:26:11.985 --> 00:26:14.285
<00:26:11.985>how <00:26:12.218>well <00:26:12.451>the <00:26:12.685>application <00:26:12.918>you <00:26:13.151>build <00:26:13.385>performs.

495
00:26:14.945 --> 00:26:17.405
<00:26:14.945>So <00:26:15.294>because <00:26:15.645>of <00:26:15.995>this, <00:26:16.345>and

496
00:26:17.405 --> 00:26:20.005
<00:26:17.405>because <00:26:17.560>of <00:26:17.716>the <00:26:17.871>fact <00:26:18.027>that <00:26:18.182>we're <00:26:18.338>all <00:26:18.493>great <00:26:18.649>developers, <00:26:18.805>uh,

497
00:26:20.065 --> 00:26:21.605
<00:26:20.065>we <00:26:20.342>wanna <00:26:20.619>achieve <00:26:20.896>the <00:26:21.173>best <00:26:21.451>results

498
00:26:22.825 --> 00:26:26.365
<00:26:22.825>and, <00:26:22.980>uh, <00:26:23.136>this <00:26:23.291>helps, <00:26:23.447>uh, <00:26:23.602>to <00:26:23.758>know <00:26:23.913>about <00:26:24.069>these <00:26:24.225>things.

499
00:26:26.465 --> 00:26:30.755
<00:26:26.465>So <00:26:26.620>Yeah, <00:26:26.776>that's <00:26:26.931>the <00:26:27.087>point <00:26:27.242>I <00:26:27.398>wanted <00:26:27.553>to <00:26:27.709>make <00:26:27.865>already.

500
00:26:31.215 --> 00:26:33.475
<00:26:31.215>Uh, <00:26:31.415>so <00:26:31.615>yeah, <00:26:31.814>last <00:26:32.014>words <00:26:32.215>from <00:26:32.415>my <00:26:32.615>side.

501
00:26:33.495 --> 00:26:34.835
<00:26:33.495>Uh, <00:26:33.696>thank <00:26:33.897>you <00:26:34.098>very <00:26:34.299>much <00:26:34.500>for <00:26:34.701>listening

502
00:26:35.415 --> 00:26:38.035
<00:26:35.415>and, <00:26:35.648>uh, <00:26:35.881>cheers <00:26:36.115>to <00:26:36.348>good <00:26:36.581>web <00:26:36.815>performance

503
00:26:38.135 --> 00:26:39.715
<00:26:38.135>and <00:26:38.368>enjoy <00:26:38.601>the <00:26:38.835>rest <00:26:39.068>of <00:26:39.301>the <00:26:39.535>conference.