Clever Geek Handbook

Compiling FFmpeg into WebAssembly (= ffmpeg.js): Part 1 - Cooking













List of translated parts of the series:







  1. Cooking (you are here)
  2. Compiling with Emscripten
  3. Convert avi to mp4






From this part you will learn:







  1. Why is all this necessary?
  2. How to compile FFmpeg in Docker




Why is all this necessary?



The main tasks of a series of publications are as follows:







  1. Create a tutorial on using Emscripten to compile C / C ++ libraries in JavaScript (more detailed and useful than previously written)
  2. Personal memo


Why ffmpeg?



FFmpeg is a free open source project, consisting of an extensive set of libraries and programs for processing video, audio and other multimedia files / broadcasts. (from Wikipedia)







A JavaScript library that would provide such capabilities simply does not exist. If you google “ffmpeg.js” you will find several solutions similar to what we are going to do:









These libraries, of course, can be used, but they have their drawbacks:







  1. Used versions of both FFmpeg and Emscripten are deprecated
  2. Projects are not supported for a long time


Initially, I planned to start supporting one of the two libraries, but since too many changes have accumulated over the years, I decided to do it all from scratch, simultaneously creating a tutorial on using Emscripten to compile a large C / C ++ library.







How to compile FFmpeg in Docker



First, we clone the FFmpeg sources, and since the master branch is used for development, we will select the branch with a specific version.







At the time of writing the tutorial, the latest version of FFmpeg is 4.1.4, so we will use it. 







$ git clone --depth 1 --branch n4.1.4 https://github.com/FFmpeg/FFmpeg


--depth 1 is optional, but this will speed up cloning since we don’t need to download all commits.







After successful cloning, compile the sources with gcc to make sure everything works.







Of course, you can skip this step, but my experience says that it’s always good to touch the build system first. (FFmpeg uses standard make, which is easier to port than Bazel)







Instructions for compiling and installing FFmpeg can be found in the INSTALL.md file located in the root directory:







# Install FFmpeg:







1. Type `. / Configure` to create the configuration. A list of options for configuration can be obtained by executing `configure - help`.







`configure` can be run from a directory other than the FFmpeg source. To do this, pass the absolute path to configure, e.g. `/ ffmpegdir / ffmpeg / configure`.







2. Now type `make` to build FFmpeg. You will need GNU Make 3.81 or higher.







3. Type `make install` to install the binaries and libraries.







THE NOTE

- - -







- Non-system dependencies (e.g. libx264, libvpx) are disabled by default.







Since we will not install FFmpeg, only the first two steps are needed.







When compiling with gcc, we will use Docker to create an environment that will isolate the entire process and achieve its uniformity on different machines.







Let's create a bash script build-with-docker.sh in the root directory with the following contents: 







 #!/bin/bash docker pull gcc:4 docker run -it \ -v $PWD:/usr/src \ gcc:9.1 \ sh -c 'cd /usr/src && ./configure --disable-x86asm && make -j4'


--disable-x86asm needs to be added as ffmpeg asks for it







Run the script: 







 $ chmod +x build-with-docker.sh $ ./build-with-docker.sh


Depending on the speed of your Internet connection and your hardware, the compilation will take about 10-30 minutes.







Note that you will see a lot of warnings, since gcc 9.1 is stricter than previous versions. This is normal.







If everything completed successfully, you can try running ffmpeg : 







 $ ./ffmpeg


Or 







 $ docker run -it -v $PWD:/usr/src gcc:9.1 /usr/src/ffmpeg


You will see something like:







ffmpeg version n4.1.4 Copyright 2000–2019 the FFmpeg developers

built with gcc 9.1.0 (GCC)

configuration: - disable-x86asm

libavutil 56.22.100 / 56.22.100

libavcodec 58.35.100 / 58.35.100

libavformat 58.20.100 / 58.20.100

libavdevice 58. 5.100 / 58. 5.100

libavfilter 7. 40.101 / 7. 40.101

libswscale 5. 3.100 / 5. 3.100

libswresample 3. 3.100 / 3. 3.100

Hyper fast Audio and Video encoder

usage: ffmpeg [options] [[infile options] -i infile] ... {[outfile options] outfile} ...







Use -h to get full help or, even better, run 'man ffmpeg'







In the next part, we will start compiling FFmpeg with Emscripten.







More articles:


All Articles