# The new Cloner System for Babylon.js

**URL:** <https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988>\
**Category:** Demos and projects\
**Created:** [July 10, 2024, 9:48pm UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988 "2024-07-10T21:48:13Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [July 10, 2024, 9:48pm UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/1 "2024-07-10T21:48:13Z")

</div>

Hello friends,

Once upon a time where was the Cloner System among Babylon.js extensions - [Babylon.js docs](https://doc.babylonjs.com/communityExtensions/clonerSystem)

Since it was quite old (7 years for now) there was a lot of issues relating to how to make it work with ES6 and so on, like [ObjectCloner Issue:](https://forum.babylonjs.com/t/objectcloner-issue/46378)

Moreover, 2 weeks ago this extension was removed from Babylon.js Extensions repo - [Delete ClonerSystem directory · BabylonJS/Extensions@730081f · GitHub](https://github.com/BabylonJS/Extensions/commit/730081faff9391e997fc0dfcdeb01b4928f1ba56)

Meanwhile it has a lot of useful functions.

Here is the new clean version of Cloner System with proper typing, ES6 support and much more. [clonerSystem/src/clonerSystem at main · eldinor/clonerSystem · GitHub](https://github.com/eldinor/clonerSystem/tree/main/src/clonerSystem)

Animated demo is here – [https://clonersystem.babylonpress.org/](https://clonersystem.babylonpress.org/)

API - [https://clonersystem.babylonpress.org/docs/](https://clonersystem.babylonpress.org/docs/)

Github repo with animated demo example - [GitHub - eldinor/clonerSystem: Cloner System for Babylon.js](https://github.com/eldinor/clonerSystem)

The original Cloner System had quite extensive documentation (which suits the new version as well) and a lot of PG examples, like Cloner with extended UI [https://playground.babylonjs.com/#1WRUHY#2](https://playground.babylonjs.com/#1WRUHY#2).

![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/0/c/0c7a6594a8b9122abfb907a5c801f2c29fce2010.jpeg)

In the new versions BABYLONX namespace was removed (as well as all other unnecessary stuff) but all API is actually the same. Also, there were some new methods added for thin instancing:

**toThin()** – Converts the Cloner to thin instances, then deletes this Cloner and returns an array of Cloner meshes. The source meshes are cloned, their clones set enabled.

**toThinOriginals()** - Converts all Cloner meshes to thin instances from the original meshes, then deletes this Cloner and returns an array of Cloner meshes. Be aware that instances of all those original meshes become disabled as well, so if they are used in other Cloners one may want to use toThin() method instead. If you don’t need animations and so on you may convert Cloner to thin instances. It greatly reduces the number of objects iterating in the render loop.

**toMatrix()** - Returns an array of matrices (scaling, rotation, position) of the Cloner meshes.

I believe the best solution would be to create NPM package. Still there are some questions: should it be in Babylon.js Extensions directory and would it be possible to use the [old documentation](https://doc.babylonjs.com/communityExtensions/clonerSystem) with minimal changes?

Meahwhile, have fun with [Cloner System](https://github.com/eldinor/clonerSystem)!

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 11, 2024, 2:23am UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/2 "2024-07-11T02:23:31Z")

</div>

> [@labris](#):
>
> Animated demo is here – [https://clonersystem.babylonpress.org/](https://clonersystem.babylonpress.org/)

Looks like Candy Crush 😃

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 19, 2024, 1:52pm UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/3 "2024-07-19T13:52:02Z")

</div>

Move/copy this to the Feature requests. This deserves far more attention.

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [July 19, 2024, 2:37pm UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/4 "2024-07-19T14:37:39Z")

</div>

Not sure if it suits Feature section 🙂  
There are 2 steps to move it further:

1. Create npm package
2. Change (slightly) the doc pages.

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [April 20, 2025, 12:13am UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/5 "2025-04-20T00:13:07Z")

</div>

Step 1 is done 🙂

> **[bp-cloner](https://www.npmjs.com/package/bp-cloner)**
>
> More info and explanations here - https://doc.babylonjs.com/communityExtensions/clonerSystem. Latest version: 0.0.2, last published: 7 minutes ago. Start using bp-cloner in your project by running \`npm i bp-cloner\`. There are no other projects in the...

```auto
npm i bp-cloner

```

Github - [GitHub - eldinor/bp-cloner: Cloner System for Babylon.js](https://github.com/eldinor/bp-cloner)

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [April 23, 2025, 7:56pm UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/6 "2025-04-23T19:56:49Z")

</div>

> [@labris](#):
>
> Change (slightly) the doc pages.

Step 2 is done 🙂 - [Babylon.js docs](https://doc.babylonjs.com/communityExtensions/clonerSystem/)

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [November 17, 2025, 4:10am UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/7 "2025-11-17T04:10:36Z")

</div>

Updated demo - [https://clonersystem.babylonpress.org/](https://clonersystem.babylonpress.org/)

Source - [GitHub - eldinor/bp-cloner: Cloner System for Babylon.js](https://github.com/eldinor/bp-cloner)

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [March 15, 2026, 1:31am UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/8 "2026-03-15T01:31:21Z")

</div>

Changelog 0.0.3

- Added dedicated demo build and preview commands using `vite.demo.config.ts`

- Fixed `RadialCloner` constructor `offset` handling to consistently use degree-based public API values

- Fixed nested `LinearCloner` rotation cloning so rotations are not double-converted

- Fixed `MatrixCloner` root lifecycle when changing `mcount`

- Fixed matrix and thin-instance export logic to include wrapper-node transforms such as `ObjectCloner` scaling

[https://www.npmjs.com/package/bp-cloner](https://www.npmjs.com/package/bp-cloner)

---

<div class="post-metadata">

**Author:** ![inteja](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/inteja/32/22553_2.png) [@inteja](https://forum.babylonjs.com/u/inteja)\
**Post date:** [March 15, 2026, 1:51am UTC](https://forum.babylonjs.com/t/the-new-cloner-system-for-babylon-js/51988/9 "2026-03-15T01:51:12Z")

</div>

Great work! Most useful. Thanks @labris!
