1
00:00:00,120 --> 00:00:00,870
Welcome back.

2
00:00:01,020 --> 00:00:02,430
Did you enjoy the mini course?

3
00:00:02,690 --> 00:00:07,590
Well, I hope you did, because we're going to start using WebAssembly in our project before we start

4
00:00:07,590 --> 00:00:08,370
writing code.

5
00:00:08,520 --> 00:00:10,920
Let's talk about what we're going to do in this section.

6
00:00:11,160 --> 00:00:18,210
Thus far, we've created two pages, one page for uploading clips and another page for managing clips.

7
00:00:18,450 --> 00:00:20,670
The upload page is incomplete.

8
00:00:21,210 --> 00:00:25,290
We skipped the step of generating screenshots from the user's video.

9
00:00:25,530 --> 00:00:29,730
We couldn't perform this step until we had a good understanding of web assembly.

10
00:00:30,030 --> 00:00:34,500
Hopefully, you have a good grasp of how web assembly works under the hood.

11
00:00:34,860 --> 00:00:39,420
It gives us the power to perform CPU intensive tasks in the browser.

12
00:00:39,960 --> 00:00:44,370
Generating a screenshot from a video can be considered an intensive task.

13
00:00:44,640 --> 00:00:50,190
While it is possible to create screenshots with JavaScript, WebAssembly will be faster.

14
00:00:50,460 --> 00:00:53,850
As a result, we can provide a better user experience.

15
00:00:54,060 --> 00:01:01,740
The question is how in the resource section of this lecture, I provide a link to a tool called F MPEG

16
00:01:02,320 --> 00:01:07,680
f MPEG is a cross-platform tool for processing video and audio files.

17
00:01:07,950 --> 00:01:14,010
We can convert file types, change bit rates, resize a video and do other actions.

18
00:01:14,250 --> 00:01:16,410
It's completely free and open source.

19
00:01:16,680 --> 00:01:19,650
We can interact with this tool through a seelye.

20
00:01:19,950 --> 00:01:25,710
It's similar to working with the angular Seelye we can run commands to process a video.

21
00:01:26,160 --> 00:01:29,670
This tool needs to be converted into a WebAssembly file.

22
00:01:29,910 --> 00:01:34,350
We have the option of doing it ourselves, but luckily we won't have to.

23
00:01:34,710 --> 00:01:39,240
Another developer has already created a WebAssembly version of this tool.

24
00:01:39,570 --> 00:01:46,800
In the resource section of this lecture, I provide a link to a repository called F MPEG WebAssembly.

25
00:01:47,400 --> 00:01:52,110
According to the description, we can run FFmpeg on the browser or node.

26
00:01:52,470 --> 00:01:54,360
Sounds perfect for our case.

27
00:01:54,600 --> 00:01:59,790
We're going to use this library to generate screenshots from a video ahead of time.

28
00:01:59,910 --> 00:02:03,210
I want to mention one key note about this software.

29
00:02:03,450 --> 00:02:06,000
The library is purely experimental.

30
00:02:06,210 --> 00:02:10,530
It's not completely stable for a task like generating screenshots.

31
00:02:10,620 --> 00:02:11,430
It's perfect.

32
00:02:11,670 --> 00:02:17,610
However, if you're looking to create a complete video editing solution, you may want to reconsider.

33
00:02:18,210 --> 00:02:23,060
On the other hand, it may be perfect learning opportunity in those cases.

34
00:02:23,130 --> 00:02:26,130
There isn't a huge section in this section.

35
00:02:26,160 --> 00:02:32,070
There's a list of blog posts for learning how to convert FFmpeg into a WebAssembly file.

36
00:02:32,340 --> 00:02:35,940
We won't be reviewing this process for our project.

37
00:02:36,090 --> 00:02:40,600
The current state of the library is more than suitable in the next lecture.

38
00:02:40,620 --> 00:02:43,530
We are going to begin installing this package.