WhoBuilt

AOT vs JIT

Jun 16, 2021· 6 min· 917 views·Watch on YouTube

An unnamed Callstack speaker discusses how ahead-of-time and just-in-time compilation differ in the context of Hermes and React Native.

AOT describes when compilation happens

AOT does not necessarily mean compiling a program to native machine code. The speaker defines AOT and JIT by when compilation and related optimizations happen, regardless of the source or output language. Examples include Angular compiling templates and TypeScript to JavaScript, and Clojure compiling to JVM bytecode.

AOT and JIT can coexist

Java compiles code to bytecode ahead of time, while a JVM may interpret that bytecode or JIT compile it to machine code. Hermes follows a similar model, so adding a JIT is technically possible. The team experimented with one but removed it because its value did not justify the overhead.

Hermes moves work to build time

With Hermes, JavaScript source is precompiled to bytecode during the React Native app build, with optimizations such as inlining, code elimination, and loop unrolling. At runtime, the app executes that bytecode, so the engine does not need to parse and compile the JavaScript then. The speaker says enabling Hermes is generally a simple switch, and React Native 0.64 made support easier across platforms.

Compilation timing is the key distinction

AOT and JIT name when work happens; they do not specify whether the output is native code or what the work does. The speaker points out that libraries with runtimes can do work just in time, while libraries that transpile everything to CSS can do it ahead of time.

Takeaways

  • Treat AOT and JIT as timing labels, not as guarantees about native machine code.
  • AOT and JIT can be combined: a runtime can interpret or JIT compile code that was first compiled to bytecode.
  • Moving parsing and compilation to the build can reduce work the engine must do at app launch.
  • Evaluate a JIT by whether its runtime benefits outweigh its added overhead.

Mentioned in this talk

Search inside this talk

What was claimed 6

  • feature
    Angular: Uses AOT to convert HTML templates and TypeScript to JavaScript
    “Angular uses the word AOT for converting its HTML templates and TypeScript to JavaScript”
    YouTube
    Unverified1 source· Talk
  • feature
    JVM: May interpret bytecode or JIT-compile it to machine code
    “It can just interpret it”
    YouTube
    Unverified1 source· Talk
  • feature
    Hermes Agent: An experimental JIT was removed because its value did not justify its overhead
    “couldn’t justify the value compared with the overhead, so we recently deleted it”
    YouTube
    Unverified1 source· Talk
  • feature
    Hermes Agent: Precompiles JavaScript source to optimized Hermes bytecode at app build time for execution at runtime
    “All your JavaScript source code will be precompiled to Hermes bytecode”
    YouTube
    Unverified1 source· Talk
  • feature
    React Native Framework: Version 0.64 made Hermes support much easier
    “Version 0.64 made Hermes support much easier”
    YouTube
    Unverified1 source· Talk
  • feature
    React Native Framework: Enabling Hermes is usually a matter of flipping a switch
    “you just need to flip a switch to enable Hermes”
    YouTube
    Unverified1 source· Talk

Related talks