CINXE.COM
Main — Emscripten 4.0.0-git (dev) documentation
<!DOCTYPE html> <html class="writer-html5" lang="en"> <head> <meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Main — Emscripten 4.0.0-git (dev) documentation</title> <link rel="stylesheet" type="text/css" href="_static/pygments.css?v=fa44fd50" /> <link rel="stylesheet" type="text/css" href="_static/css/theme.css?v=6895f958" /> <link rel="shortcut icon" href="_static/emscripten.ico"/> <script src="_static/jquery.js?v=5d32c60e"></script> <script src="_static/_sphinx_javascript_frameworks_compat.js?v=2cd50e6c"></script> <script data-url_root="./" id="documentation_options" src="_static/documentation_options.js?v=faf469f6"></script> <script src="_static/doctools.js?v=888ff710"></script> <script src="_static/sphinx_highlight.js?v=4825356b"></script> <script src="_static/js/theme.js"></script> <link rel="index" title="Index" href="genindex.html" /> <link rel="search" title="Search" href="search.html" /> <link rel="next" title="Introducing Emscripten" href="docs/introducing_emscripten/index.html" /> </head> <body class="wy-body-for-nav"> <div class="grid-to-center-rtd-theme"> <div class="wy-grid-for-nav"> <nav data-toggle="wy-nav-shift" class="wy-nav-side"> <div class="wy-side-scroll"> <div class="wy-side-nav-search" > <a href="#"> <!-- <img src=".//_static/" alt="Logo"> --> <img src="_static/Emscripten_logo_full.png" class="logo" alt="Logo"/> </a> <div role="search"> <form id="rtd-search-form" class="wy-form" action="search.html" method="get"> <input type="text" name="q" placeholder="Search docs" aria-label="Search docs" /> <input type="hidden" name="check_keywords" value="yes" /> <input type="hidden" name="area" value="default" /> </form> </div> </div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu"> <ul> <li class="toctree-l1"><a class="reference internal" href="docs/introducing_emscripten/index.html">Introducing Emscripten</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/getting_started/index.html">Getting Started</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/compiling/index.html">Compiling and Running Projects</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/porting/index.html">Porting</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/api_reference/index.html">API Reference</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/tools_reference/index.html">Tools Reference</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/optimizing/Optimizing-Code.html">Optimizing Code</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/optimizing/Optimizing-WebGL.html">Optimizing WebGL</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/debugging/Sanitizers.html">Debugging with Sanitizers</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/building_from_source/index.html">Building Emscripten from Source</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/contributing/index.html">Contributing to Emscripten</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/optimizing/Profiling-Toolchain.html">Profiling the Toolchain</a></li> <li class="toctree-l1"><a class="reference internal" href="docs/site/about.html">About this site</a></li> <li class="toctree-l1"><a class="reference internal" href="genindex.html">Index</a></li> </ul> </div> </div> </nav> <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" > <i data-toggle="wy-nav-top" class="fa fa-bars"></i> <!-- <a href="#">Emscripten</a> --> <a href="#"> <img src="_static/Emscripten_logo_full.png" alt="Logo" /> </a> </nav> <div class="wy-nav-content"> <div class="rst-content"> <!--begin hamishw addition --> <!--Nav bar defined as a document followed by short version of nav text and long version If no such page exists then nav item is not created. CSS defines which of the long or short version is displayed. --> <a href="https://github.com/emscripten-core/emscripten"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://github.blog/wp-content/uploads/2008/12/forkme_right_darkblue_121621.png" alt="Fork me on GitHub" data-canonical-src="https://github.blog/wp-content/uploads/2008/12/forkme_right_darkblue_121621.png"></a> <div class="main-nav-bar" style=""> <!-- the layout of the menu options - centered with left and right alignment of the first and last loop items respectively. This is VERY UGLY as I'm adding to the CSS in the code to force the alignment. Would be better just to have the elements here and have the CSS in the CSS file. This could be done with a CSS selector, but not worked out how yet. --> <ul id="menu-options"> <li style="text-align:left;"><a class="navlink-short" title="Docs" href="docs/index.html">Docs</a><a class="navlink-long" title="Documentation" href="docs/index.html">Documentation</a></li> <li><a class="navlink-short" title="SDK" href="docs/getting_started/downloads.html">SDK</a><a class="navlink-long" title="Downloads" href="docs/getting_started/downloads.html">Downloads</a></li> <li><a class="navlink-short" title="Help" href="docs/introducing_emscripten/community.html">Help</a><a class="navlink-long" title="Community" href="docs/introducing_emscripten/community.html">Community</a></li> <li style="text-align:right;"><a class="navlink-short" title="GitHub" href="docs/index.html">GitHub</a><a class="navlink-long" title="" href="docs/index.html"></a></li> </ul> <!-- <div style="clear:both;"></div> --> <div role="navigation" aria-label="breadcrumbs navigation"> <div class="breadcrumb-box"> <a class="breadcrumb-box-item" href="#">Home</a> <div class="breadcrumb-box-item">» Main</div> </div> </div> </div> <!--end hamishw addition --> <!--HamishW move <div role="navigation" aria-label="breadcrumbs navigation"> <div class="breadcrumb-box"> <a class="breadcrumb-box-item" href="#">Home</a> <div class="breadcrumb-box-item">» Main</div> </div> </div> --> <div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article"> <div itemprop="articleBody"> <img alt="./_static/Emscripten_logo_full.png" src="_static/Emscripten_logo_full.png"> <h3>Emscripten is a complete compiler toolchain to WebAssembly, using LLVM, with a special focus on speed, size, and the Web platform.</h3> <div class="container" style="width:100%;margin-bottom:10px;"> <div class="one-third-container" style="width:32%; display:inline-block;"> <div class="signpost" style="display:inline-block; vertical-align:text-top; margin-left:5px;margin-right:5px;"> <div class="signpost-heading" style="font-size:2em; font-style:bold; margin-bottom:10px;">Porting</div> <div class="signpost-body" style=""><p>Compile your existing projects written in C or C++ — or any language that uses <a href="http://llvm.org/">LLVM</a> — to browsers, <a href="https://nodejs.org/">Node.js</a>, or <a href="https://v8.dev/blog/emscripten-standalone-wasm#running-in-wasm-runtimes">wasm runtimes</a>.</p></div> </div> </div> <div class="one-third-container" style="width:32%; display:inline-block; font-style:bold;"> <div class="signpost" style="display:inline-block; vertical-align:text-top; margin-left:5px;margin-right:5px;"> <div class="signpost-heading" style="font-size:2em; font-style:bold; margin-bottom:10px;">APIs</div> <div class="signpost-body" style=""><p>Emscripten converts OpenGL into WebGL, and has support for familiar APIs like SDL, pthreads, and POSIX, as well as Web APIs and JavaScript.</p></div> </div> </div> <div class="one-third-container" style="width:32%; display:inline-block; font-style:bold;"> <div class="signpost" style="display:inline-block; vertical-align:text-top; margin-left:5px; margin-right:5px;"> <div class="signpost-heading" style="font-size:2em; font-style:bold; margin-bottom:10px;">Fast</div> <div class="signpost-body" style=""><p>Thanks to the combination of LLVM, Emscripten, <a href="https://github.com/WebAssembly/binaryen">Binaryen</a>, and <a href="http://webassembly.org/">WebAssembly</a>, the output is compact and runs at near-native speed.</p></div> </div> </div> </div> <div style="margin-left: auto; margin-right: auto; text-align: center; margin-bottom: 10px; padding: 20px 20px 1px; background-color: rgb(217, 240, 180);background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.15));box-shadow:3px 3px 5px gray;"> <p style="font-size:1.5em;">Interested to learn more? Read our <a href="./docs/introducing_emscripten/about_emscripten.html">About Page</a>!</p> </div> <br> <div style="margin-left: auto; margin-right: auto; text-align: center; margin-bottom: 10px; padding: 20px 20px 1px; background-color: rgb(217, 240, 127);background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.15));box-shadow:3px 3px 5px gray;"> <p style="font-size:1.5em;">Ready to get started? <a href="./docs/getting_started/downloads.html">Download and install the SDK</a> and then proceed to the <a href="./docs/getting_started/Tutorial.html">Tutorial</a>!</p> </div> <br> <hr class="docutils" /> <div class="toctree-wrapper compound"> </div> </div> </div> <footer> <div class="rst-footer-buttons" role="navigation" aria-label="footer navigation"> <a href="docs/introducing_emscripten/index.html" class="btn btn-neutral float-right" title="Introducing Emscripten"/>Next <span class="fa fa-arrow-circle-right"></span></a> </div> <!--begin hamishw addition --> <!-- --> <!--Footer important links If no such page exists then nav item is not created. CSS defines which of the long or short version is displayed. --> <div class="footer-nav-bar" style=""> <div class="footer-options"> <a class="footer-navlink-short" title="Report Bug" href="docs/getting_started/bug_reports.html">Report Bug</a><a class="footer-navlink-long" title="Report Bug" href="docs/getting_started/bug_reports.html">Report Bug</a> <a class="footer-navlink-short" title="Licensing" href="docs/introducing_emscripten/emscripten_license.html">Licensing</a><a class="footer-navlink-long" title="Licensing" href="docs/introducing_emscripten/emscripten_license.html">Licensing</a> <a class="footer-navlink-short" title="Contributing" href="docs/contributing/contributing.html">Contributing</a><a class="footer-navlink-long" title="Contributing" href="docs/contributing/contributing.html">Contributing</a> <a class="footer-navlink-short external" href="https://groups.google.com/forum/#!forum/emscripten-discuss">Mailing list</a><a class="footer-navlink-long external" href="https://groups.google.com/forum/#!forum/emscripten-discuss">Mailing list</a> <a class="footer-navlink-short external" href="https://github.com/emscripten-core/emscripten/wiki">Wiki</a><a class="footer-navlink-long external" href="https://github.com/emscripten-core/emscripten/wiki">Wiki</a> <a class="footer-navlink-short" title="Release notes" href="docs/introducing_emscripten/release_notes.html">Release notes</a><a class="footer-navlink-long" title="Release notes" href="docs/introducing_emscripten/release_notes.html">Release notes</a> <a class="footer-navlink-short" title="Blogs" href="docs/introducing_emscripten/community.html">Blogs</a><a class="footer-navlink-long" title="Blogs" href="docs/introducing_emscripten/community.html">Blogs</a> <a class="footer-navlink-short" title="Help" href="docs/introducing_emscripten/community.html">Help</a><a class="footer-navlink-long" title="Contact" href="docs/introducing_emscripten/community.html">Contact</a> </div> </div> <!-- <div role="navigation" aria-label="breadcrumbs navigation"> <div class="breadcrumb-box"> <a class="breadcrumb-box-item" href="#">Home</a> <div class="breadcrumb-box-item">» Main</div> </div> </div> --> <!-- <a href="https://github.com/snide/sphinx_rtd_theme">Sphinx theme</a> provided by <a href="https://readthedocs.org">Read the Docs</a> --. <!--end hamishw addition --> <!-- end section moved here by hamishw --> <div role="contentinfo" class="copyright-box"> <!-- section moved here by hamishw - needs tidying, which is why it is still in breadcrumbs mode --> <ul class="wy-breadcrumbs"> <li class="wy-breadcrumbs-aside"> </li> <li class="wy-breadcrumbs-aside"> <a href="docs/site/about.html">About site</a> </li> <li class="wy-breadcrumbs-aside"> <a href="https://github.com/emscripten-core/emscripten/issues/new?title=Bug%20in%20page:Main%20&body=REPLACE%20THIS%20TEXT%20WITH%20BUG%20DESCRIPTION%20%0A%0AURL:%20./index&labels=bug">Page bug</a> </li> </ul> <p> <!-- © Copyright 2015, . --> © Copyright 2015, <a href="docs/contributing/AUTHORS.html">Emscripten Contributors</a>. <!-- update theme to remove the translation stuff here - it was breaking due to link to AUTHORS file. This is a cludge to allow specific link to my authors file --> </p> </div> </footer> </div> </div> </section> </div> <script> jQuery(function () { SphinxRtdTheme.Navigation.enable(true); }); </script> </div> </body> </html>