Emscripten Revisited

為了工作上的需要，試著把FFMpeg放入Browser中，雖然成功了，但是效果沒想像的好，尤其是在Mobile Browsers上。
不過這也是WebAssembly打算改善的問題，目前只有Edge跟Firefox支援Asm.js程度比較高。
在FFmpeg這項目吃盡苦頭，寫個筆記紀錄怎麼認真玩Emscripten。
我是參考audioconverter.js不過用他的Script無法使用。只好自行摸索出適合的方式。

我的目標市 FFmpeg + fdk_aac ，接下來的教學就是如何做出一個包涵這兩樣的 Javascript

Build FDK AAC

這個跟一般的玩Emscripten玩法沒差太多

$ git clone https://github.com/mstorsjo/fdk-aacsed -i 's/gcc/emcc/g' config.mak
$ cd fdk-aac
$ ./autogen.sh
$ emconfigure ./configure --prefix=/home/hm/local
$ emmake make
$ make install
```sed -i 's/gcc/emcc/g' config.makdd

### Build FFMpeg
這才是花了很多時間在Try and Error上，照AudioConvert.JS那樣寫對我來說就是沒用
因為原先emconfigure的方式無法抓到 libfdk_aac，只好手動用原先的方式來作

$ cd ffmpeg
$ PKG_CONFIG_PATH=/home/hm/local/lib/pkgconfig/ ./configure –disable-asm –disable-outdevs –disable-indevs –disable-filters –disable-bsfs –disable-decoders –enable-decoder=mp3,h264 –disable-demuxers –enable-demuxer=mpegts –disable-muxers –enable-muxer=mpegts –disable-protocols –enable-protocol=file –enable-libfdk-aac –disable-encoders –enable-encoder=libfdk_aac –enable-filter=aresample –disable-parsers –disable-doc –disable-stripping –disable-protocol=rtp,tcp,udp,http –disable-pthreads –disable-debug –disable-network –enable-parser=h264 –disable-filter=crop –extra-cflags=-I/home/hm/local/include

1	產生完config.mak之後在手動改掉

$ sed -i ‘s/gcc/emcc/g’ config.mak
$ sed -i ‘s/g++/emcc/g’ config.mak
$ sed -i ‘s/VALGRIND_H 1/VALGRIND_H 0/g’ config.h
$ make

如果沒意外的話彙編出**不能動**的ffmpeg，不過在意料之中，編譯過程中也會告訴你沒有找到`fdk-aac`，這都無所謂，畢竟這只是中間產物，要進行最後的動作才行。

$ mv ffmpeg ffmpeg.bc
$ emcc -O2 ffmpeg.bc /home/hm/local/lib/libfdk-aac.a -o ffmpeg.js

1	接著我們用nodejs試著執行看看

$ node ffmpeg.js
ffmpeg version 3.1.1 Copyright (c) 2000-2016 the FFmpeg developers

成功了，不過還是不能在網頁上用
### Runs inside browsers
參考AudioConvert.js的方式，將`ffmpeg-pre.js`和`ffmpeg-post.js`複製出來
進行編譯

$ emcc -g4 -Os –memory-init-file 0 ffmpeg.bc /home/hm/local/lib/libfdk-aac.a -o ffmpeg.js –pre-js ffmpeg_pre.js –post-js ffmpeg_post.js

```
然後將ffmpeg.js複製到audioconvert.js中的測試網頁中，就能看到他能夠動作了

Conclusion

emcc的表現真的有夠怪異，如果在網頁版的編譯加上-g3以上等級的debuger info，編出來的東西跟本部能用。
編譯的過程更是痛苦連連，效果也不如想像中的好
希望WebAssembly可以彌補這一塊