Angular Ivy and beyond

Suguru Inatomi



about me

  • laco / Suguru Inatomi
  • Work@Kaizen Platform
    • Frontend Dev.
  • ng-japan Organizer
  • Angular Contributor

Angular Ivy

What's Ivy?

  • "ngiv"

    • Isomorphic View engine (maybe)

  • The 3th generation view engine

    • v2: Renderer

    • v4-v6: Renderer2 

Angular Ivy

Runtime (AoT compile)

Runtime (JIT compile)

Build (AoT compile)

Runtime (AoT)

Runtime (JIT)

Build (AoT)

  • Tree-Shakable Renderer

    • Remove unused features

  • Hard-tuned runtime

    • V8 friendly JavaScript code


  • Faster compilation

    • Improve incremental compilation

    • Project scalability



  • Easy to understand generated code

  • Easy to debug


Human-readable codegen

Beyond Ivy

Angular Elements

Angular Elements

Angular for www

Angular Elements

Angular component as a Custom Elements

With Ivy

Small Core Runtime

Angular i18n

Angular i18n

  • Ivy-style i18n engine

    • Easy to read

Decorator-less Component

Disclaimer: This is a dream, not real yet.

Component Decorator

Ivy Template Instructions

=> ngTemplate


Imagine React-ish component definition

=> jsxToIvy

=> render()

=> Final Form

How do you feel?


  • Next-generation Angular View engine

  • Focus on ...

    • Small runtime (Tree-Shake-ability)

    • Fast compilation (Locality)

    • Simple API (Debug-ability)

  • Big possibility

    • Meta-programming dream!!

Angular Ivy


Suguru Inatomi


Angular Ivyとその先

By Suguru Inatomi