
Filament (3D renderer from Google) for the Web - corysama
https://prideout.net/slides/filawasm/
======
corysama
If you missed the earlier post about Filament and it's gorgeous documentation,
here are a few links for you :)

[https://news.ycombinator.com/item?id=17684286](https://news.ycombinator.com/item?id=17684286)

[https://github.com/google/filament](https://github.com/google/filament)

[https://google.github.io/filament/Filament.md.html](https://google.github.io/filament/Filament.md.html)

[https://google.github.io/filament/Materials.md.html](https://google.github.io/filament/Materials.md.html)

------
TekMol
First I read this:

    
    
        Small: written in C++ with very few dependencies
    

And thought "Cool, let's play with it".

And then on the GitHub page they write:

    
    
        Building Filament
    
        Prerequisites
    
        To build Filament, you must first install the following tools:
    
        CMake 3.4 (or more recent)
        clang 5.0 (or more recent)
        ninja 1.8 (or more recent)
        To build the Java based components of the project you can optionally install (recommended):
        
        OpenJDK 1.8 (or more recent)
        Additional dependencies may be required for your operating system. Please refer to the appropriate section below.
        
        To build Filament for Android you must also install the following:
        
        Android Studio 3.1
        Android SDK
        Android NDK
        Environment variables
        Make sure the environment variable ANDROID_HOME points to the location of your Android SDK.
        
        By default our build system will attempt to compile the Java bindings. To do so, the environment variable JAVA_HOME should point to the location of your JDK.
        
        When building for WebGL, you'll also need to set EMSDK. See WebAssembly.
        
        IDE
        We recommend using CLion to develop for Filament. Simply open the root directory's CMakeList.txt in CLion to obtain a usable project.
        
        Easy build
        Once the required OS specific dependencies listed below are installed, you can use the script located in build.sh to build Filament easily on macOS and Linux.
        
        This script can be invoked from anywhere and will produce build artifacts in the out/ directory inside the Filament source tree.
        
        To trigger an incremental debug build:
        
        $ ./build.sh debug
        To trigger an incremental release build:
        
        $ ./build.sh release
        To trigger both incremental debug and release builds:
        
        $ ./build.sh debug release
        To install the libraries and executables in out/debug/ and out/release/, add the -i flag. You can force a clean build by adding the -c flag. The script offers more features described by executing build.sh -h.
        
        Disabling Java builds
        By default our build system will attempt to compile the Java bindings. If you wish to skip this compilation step simply pass the -j flag to build.sh:
        
        $ ./build.sh -j release
        If you use CMake directly instead of the build script, pass -DENABLE_JAVA=OFF to CMake instead.
        
        Linux
        Make sure you've installed the following dependencies:
        
        libglu1-mesa-dev
        libc++-dev (libcxx-devel on Fedora)
        libc++abi-dev
        ninja-build
        libxi-dev
        After dependencies have been installed, we highly recommend using the easy build script.
        
        If you'd like to run cmake directly rather than using the build script, it can be invoked as follows, with some caveats that are explained further down.
        
        $ mkdir out/cmake-release
        $ cd out/cmake-release
        $ cmake -G Ninja -DCMAKE_BUILD_TYPE=Release -DCMAKE_INSTALL_PREFIX=../release/filament ../..
        If you experience link errors you must ensure that you are using libc++abi by passing this extra parameter to cmake:
        
        -DFILAMENT_REQUIRES_CXXABI=true
        Your Linux distribution might default to gcc instead of clang, if that's the case invoke cmake with the following command:
        
        $ mkdir out/cmake-release
        $ cd out/cmake-release
        # Or use a specific version of clang, for instance /usr/bin/clang-5.0
        $ CC=/usr/bin/clang CXX=/usr/bin/clang++ \
            cmake -G Ninja -DCMAKE_BUILD_TYPE=Release -DCMAKE_INSTALL_PREFIX=../release/filament ../..
        You can also export the CC and CXX environment variables to always point to clang. Another solution is to use update-alternatives to both change the default compiler, and point to a specific version of clang:
        
        $ update-alternatives --install /usr/bin/cc cc /usr/bin/clang 100
        $ update-alternatives --install /usr/bin/c++ c++ /usr/bin/clang++ 100
        $ update-alternatives --install /usr/bin/clang clang /usr/bin/clang-5.0 100
        $ update-alternatives --install /usr/bin/clang++ clang++ /usr/bin/clang++-5.0 100
        Finally, invoke ninja:
        
        $ ninja
        This will build Filament, its tests and samples, and various host tools.
        
        WebAssembly
        
        The core Filament library can be cross-compiled to WebAssembly from either macOS or Linux. To get started, follow the instructions for building Filament on your platform (macOS or linux), which will ensure you have the proper dependencies installed.
        
        Next, you need to install the Emscripten SDK. The following instructions show how to install the same version that our continuous builds use.
        
        cd <your chosen parent folder for the emscripten SDK>
        curl -L https://github.com/juj/emsdk/archive/0d8576c.zip > emsdk.zip
        unzip emsdk.zip
        mv emsdk-* emsdk
        cd emsdk
        ./emsdk update
        ./emsdk install sdk-1.38.11-64bit
        ./emsdk activate sdk-1.38.11-64bit
        After this you can invoke easy build script as follows:
        
        export EMSDK=<your chosen home for the emscripten SDK>
        ./build.sh -p webgl release
        The EMSDK variable is required so that the build script can find the Emscripten SDK. The build creates a samples folder that can be used as the root of a simple static web server. Note that you cannot open the HTML directly from the filesystem due to CORS. One way to deal with this is to use Python to create a quick localhost server:
        
        cd out/cmake-webgl-release/web/samples
        python3 -m http.server     # Python 3
        python -m SimpleHTTPServer # Python 2.7
        Each sample app has its own handwritten html file. Additionally the server folder contains assets such as meshes, textures, and materials.
    
    

(I only copied the parts that seem necessary to get the web version working.)

Now I am confused. I thought it would be a few cpp files that I can compile to
webassembly and thats it. Is the above really considered a small lib with very
few dependencies?

~~~
flohofwoe
For a multi-platform C++ project, these are quite reasonable prerequisites, as
bad as it looks at first glance.

Also AFAIK, to dabble with the web version, just download filament-*web.tgz
file here:
[https://github.com/google/filament/releases](https://github.com/google/filament/releases),
this contains a .wasm and .js file you can copy into your project (and soon
this will most likely be on npm).

Expecting a JS user to compile an emscripten project would be a bit much to
ask ;)

~~~
zeroname
> For a multi-platform C++ project, these are quite reasonable prerequisites,
> as bad as it looks at first glance.

For anything C++ coming out of Google, it's _shockingly_ reasonable.

