Skip to content
Angular Three

Introduction

Angular Three (NGT) is an Angular renderer for using THREE.js in a declarative way in Angular applications.

Key Features

Declarative Scene Graph

Angular Three allows the users to declaratively build a scene graph using the familiar Angular template syntax. This approach enables Angular developers to leverage familiar skills and tools of Angular template to build 3D scenes.

Performance

Angular Three is a custom renderer that renders THREE.js entities directly to the Canvas. This means that there is no overhead of instantiating custom Components or Directives to turn them into THREE.js objects.

Compatibility

“Anything that can be done in THREE.js, can be done in Angular Three.” This is the motto that Angular Three stands for.

Signals

Angular Three fully embraces Angular Signals to drive the state of the scene graph. Most, if not all, of Angular Three’s APIs are based on Signal<T> and return Signal<T>.

Acknowledgements

Angular Three would not have been possible without the following open source projects:

THREE.js

The foundation of Angular Three is THREE.js. It is a powerful and flexible 3D library that provides a wide range of tools for creating 3D scenes.

React Three Fiber (R3F)

Fundamentally, NGT and R3F are both custom renderers for THREE.js. Technically, there are differences between Angular Renderer (NGT) and React Reconciler (R3F). However, the core concepts are the same and R3F has been a major inspiration for NGT.

Other ecosystems

Other ecosystems like TresJS and Threlte have also been a major inspiration for NGT since their communities are substantially bigger than NGT’s. Thanks to that, I’ve been able to learn a lot from their use-cases and model after their documentation in other to showcase what’s important to THREE.js development.

Versioning

NGT follows the Semantic Versioning convention. The versioning scheme is MAJOR.MINOR.PATCH.

  • The MAJOR version is incremented when there are breaking changes in the API.
  • The MINOR version is incremented when new features are added.
  • The PATCH version is incremented when bug fixes are made.

Ecosystem

NGT is compised of several packages