# ERA Engine - Open Source Three.js Engine/Wrapper

**URL:** <https://discourse.threejs.org/t/era-engine-open-source-three-js-engine-wrapper/11871>\
**Category:** Resources\
**Created:** [January 6, 2020, 1:28am UTC](https://discourse.threejs.org/t/era-engine-open-source-three-js-engine-wrapper/11871 "2020-01-06T01:28:55Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![rogerscg](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/rogerscg/32/8591_2.png) [@rogerscg](https://discourse.threejs.org/u/rogerscg)\
**Post date:** [January 6, 2020, 1:28am UTC](https://discourse.threejs.org/t/era-engine-open-source-three-js-engine-wrapper/11871/1 "2020-01-06T01:28:55Z")

</div>

Over the past three years, I’ve worked on a couple of projects using Three.js and other libraries, one of them launching as a [game on Steam](https://store.steampowered.com/app/707680/Slapshot/). During that time, I inadvertently created my own Three.js wrapper/engine called the ERA Engine. I refuse to start a Three.js project without it, so I figured it might be useful for others.

The “engine” comprises of an entity-component system as well as helper libraries for loading audio, 3D models, making network calls, controls/bindings, settings, etc.

I’ve spent the past month generalizing the code and writing documentation so others could use it and contribute to it if they find it useful. It’s available here:

##[ERA Engine on GitHub](https://github.com/rogerscg/era-engine)  
##[Site with a couple of examples](https://rogerscg.github.io/era-engine/)  
##[GitHub Wiki with a Guide/Docs](https://github.com/rogerscg/era-engine/wiki/ERA-Engine-Guide)

The repo is a bit crude (no tests, no minification, no compiler/style guide), but I figured I would spare myself the trouble unless people found it useful.

If you want to fork the repo and make an example, feel free to send a PR to me.

Let me know if you have any questions, would love to answer any that you have!

---

<div class="post-metadata">

**Author:** ![felixmariotto](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/felixmariotto/32/5928_2.png) [@felixmariotto](https://discourse.threejs.org/u/felixmariotto)\
**Post date:** [January 6, 2020, 6:09am UTC](https://discourse.threejs.org/t/era-engine-open-source-three-js-engine-wrapper/11871/2 "2020-01-06T06:09:04Z")

</div>

This is interesting ! Thanks for sharing.  
I don’t understand why you did a demo with such a huge model as your spaceship though. Or maybe you could use this to showcase a ready-made loading screen ? With my bad internet, it took me over 10sec to get the page loaded 😅 (and it runs at 30FPS)

---

<div class="post-metadata">

**Author:** ![looeee](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/looeee/32/59_2.png) [@looeee](https://discourse.threejs.org/u/looeee)\
**Post date:** [January 6, 2020, 7:35am UTC](https://discourse.threejs.org/t/era-engine-open-source-three-js-engine-wrapper/11871/3 "2020-01-06T07:35:15Z")

</div>

Looks interesting, thanks for sharing.

What’s your reason for making entities inherit from `Object3D`?  
In my (very limited) understanding of ECS entities are usually just an empty object `{}` that you assign components to. In that case, it would seem `Object3D` should be a component.

---

<div class="post-metadata">

**Author:** ![rogerscg](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/rogerscg/32/8591_2.png) [@rogerscg](https://discourse.threejs.org/u/rogerscg)\
**Post date:** [January 6, 2020, 3:04pm UTC](https://discourse.threejs.org/t/era-engine-open-source-three-js-engine-wrapper/11871/4 "2020-01-06T15:04:26Z")

</div>

Thanks for checking it out!

You’re right, this is a distorted version of an ECS, but for the projects I worked on, I found it unnecessary to ever have an entity that did not have an Object3D componenet. I found extending it to ease usage of instances, but that might be a design flaw if others don’t find it useful.

---

<div class="post-metadata">

**Author:** ![rogerscg](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/rogerscg/32/8591_2.png) [@rogerscg](https://discourse.threejs.org/u/rogerscg)\
**Post date:** [January 6, 2020, 3:05pm UTC](https://discourse.threejs.org/t/era-engine-open-source-three-js-engine-wrapper/11871/5 "2020-01-06T15:05:07Z")

</div>

I found the X-Wing lego model and decided to test it out. I really should replace it, it was silly of me to use such a large model. My apologies, but thanks for checking it out nonetheless.