1 MILLION animated sprites at 60 FPS

Hello everyone, today I want to show you what I've been working on the past few days, to celebrate my 100 stars(thank you) on the SpriteSheetRenderer repo on GitHub.

With this system, you can render a huge amount of animated sprites at very high FPS(1 million animated sprites at 60fps)

C# 4 required



Get it on GitHub

I created 3 demos where you will find a simple tutorial on how to bulk/single instantiate and also a fractal visualization.

In this update, I rewrote the API to make it super easy to instantiate sprites

Code (CSharp):

1. public Sprite[] sprites;
2.   public void Convert(Entity entity, EntityManager eManager, GameObjectConversionSystem conversionSystem) {
3.     // 1) Create Archetype
4.     EntityArchetype archetype = eManager.CreateArchetype(
5.              typeof(Position2D),
6.              typeof(Rotation2D),
7.              typeof(Scale),
8.              //required params
9.              typeof(SpriteIndex),
10.              typeof(SpriteSheetAnimation),
11.              typeof(SpriteSheetMaterial),
12.              typeof(SpriteSheetColor),
13.              typeof(SpriteMatrix),
14.              typeof(BufferHook)
15.           );
16.  
17.     // 2) Record and bake this spritesheet(only once)
18.     SpriteSheetManager.RecordSpriteSheet(sprites, "emoji");
19.  
20.     int maxSprites = SpriteSheetCache.GetLength("emoji");
21.     var color = UnityEngine.Random.ColorHSV(.35f, .85f);
22.  
23.     // 3) Populate components
24.     List<IComponentData> components = new List<IComponentData> {
25.         new Position2D { Value = float2.zero },
26.         new Scale { Value = 15 },
27.         new SpriteIndex { Value = UnityEngine.Random.Range(0, maxSprites) },
28.         new SpriteSheetAnimation { maxSprites = maxSprites, play = true, repetition = SpriteSheetAnimation.RepetitionType.Loop, samples = 10 },
29.         new SpriteSheetColor { color = new float4(color.r, color.g, color.b, color.a) }
30.       };
31.     // 4) Instantiate the entity
32.     Entity e = SpriteSheetManager.Instantiate(archetype, components, "emoji");
33.   }

Update an entity:

Code (CSharp):

1. SpriteSheetManager.UpdateEntity(e, new Position2D { Value = float2.zero });

Destroy an entity:

Code (CSharp):

1. SpriteSheetManager.DestroyEntity(e, "emoji");

To get some insight on how I made this system, you can check this post

Let me know what do you think about this and feel free to use it inside your game/prototype

 

Nice! I played with your older version a little so I'll have to play with this one now.

Not sure if it's just me, but all the DEMO's were broken when I tried them. I had to change the sprite mode on the Material to multiple and then slice the sprites. Then each of the DEMO's were missing a script with the sprites. Had to add the "MakeSpriteEntites" script to the "BulkSpawnSprites" DEMO, set the size to 16 and then add all the sprites (same for all).

The fractal one gave me a spinner in Unity for over 5 seconds just to go to around 16,000 entities... strange.

I got 600,000 at about 65 FPS... 800,000 brought me down in the 50's.

I'm on an AMD FirePro D300 2 GB (Mac Pro).

 

Not bad for a mid-tier graphics card from six years ago

 

Yeah, it's held up pretty well. I like working on the Mac.

I'm more impressed that somehow @FabrizioSpadaro got 1 Million entities on a Mid-2015 MacBook Pro (stated on github). If that's default pro video card, that's only a Radeon R9 M370X, which is slightly less powered than my FirePro's (dual D300's).

 

Hi, yeah that spinner is because of the quadtree algorithm and also I use the single instantiate API which is not ideal for bulk spawning.

Mmm that' s wired.. did you have burst compilation on?

 

Yeah, burst compilation is on. I'll maybe look into it later.

 

After following the previously mentioned steps to replace the missing scripts, slice the material and add the sprites, I'm getting this runtime error: "Invalid stride 1 for Compute Buffer - must be greater than 0, less or equal to 2048 and a multiple of 4".

What version of Unity and what version of packages does this require? I had to make several changes to the code, such as changing the four entityQuery.SetFilter(…) lines to entityQuery.SteSharedComponentFilter(…) in SpriteSheetRenderer.cs as the former does not exist in the latest version of Unity 2020.1.0a19.2395, Entities version 0.5.0-preview.17, which I imagine may have contributed to the aforementioned error.

Would appreciate any insight, I'd love to see just how far you've pushed DOTS on my 1080ti.

 

Well yes, I' haven't upgraded to 2020 yet, my test was done in 2019.3, once unity will officially release 2020 I will upgrade to it!

 

Also, if you all have any questions, feel free to ask them in my discord channel, I will reply to you as soon as possible: https://discord.gg/FeStMM8

 

Hi, great project!
Is it usable on mobile devices?
Obviously not at this scale but still.

Thanks

 

Hello, yeah sure dots works on mobile too, and the shader I made is compatible with all mobile devices.

Edit: Some OpenGL 3.0 devices don't support StructuredBuffer in Shaders: https://forum.unity.com/threads/how...d-in-shaders-for-android.532240/#post-3505658

 

Repost here

I have Issue with Delete Entities from Scene,
When delete entity the system still Render a sprite from Buffer.

SpriteSheetManager.DestroyEntity(entity, "emoji");

Also Project Attached.

PS: And I wonder why we need in SpriteSheetRenderer.cs

processable = GetEntityQuery(ComponentType.ReadOnly<SpriteMatrix>(), ComponentType.ReadOnly<SpriteSheetMaterial>());

Here is Simple Demo Project:
200k dynamic animated sprites at 80fps

 

Hi, that query along with other queries were leftovers from previous code that I wrote and forgot to remove(I cleaned it, in this new version), I also took time to fix the sprite destruction and build a demo for it.
I also wrote a super simple system to clean old buffers that I will optimize as soon as I can.

 

Awesome. I'm looking for a better way to render sprites with ecs. I'll take a look at it tonight. How does the camera work? Is it orthographic?

 

Need to remember that this system using StructuredBuffer in a Shader and some Mobile devices not support it.

 

Hello, yes, the camera is set to orthographic!

 

Hello guys, I've updated the repo to unity 2019.3.1 and to the latest version of entities, I also reorganized the project so there are no more missing scripts or assets dependencies when you load some scene.

https://github.com/fabriziospadaro/SpriteSheetRenderer

 

Script dependencies are fixed once for all, there were some missing metafiles for some wired reasons.

There is a known issue with the strides, and I'm working on it,
thanks everyone for reporting it to me!

 

Hello guys, it's been a while since my last update, I was stunned by the love that this repo is receiving and I will try my best to keep updating it and fixing all the bugs you'll send me on Github.

Today I have a great update, I made an animator system to better manage and play with the animation.

The concept is that you have a ScriptableObject used as containers to store information about animations, and you can then put multiple animations inside a Custom Animator.

You can use a custom animator to easier create an animated sprite, without having to manually create all the needed components.

I made a demo where you can select different animations and see the result in real time.



I also updated the project to unity 2019.3.5f and fixed a stride error many of you were having, let me know what do you think!

 

To be honest, I didn't take a close look at the project yet (the video looks quite impressive, though ^^). You currently have the Unity project your using for development in you repository.
To simplify the use of it, besides providing it in the asset store, you could restructure this project to be a Untiy package. What would need to change:

• the main repository would contain the package structure, see the Unity manual about custom packages
  • assembly definitions are required, but it's basically just creating a file in Unity and adding the dependencies
    
  • the dependencies to the DOTS packages would need to be defined in the package.json
• Unity Project:
  • either manage it in a separate repository
    • the package would be included via git submodule
  • or just have it locally

As mentioned, the main advantage is the ease of using it - the package only contains what belongs to the package, and it's easy to include.

Besides that, good luck with the further developments.

 

Yeah good points, might do this soon, thanks for the tips!

 

Great project, thank you!
How to make sprites interact with each other? I mean, is there any way to set collieders on it?

 

Thank you, right now there are no official 2D colliders, but you can cheat using a 3D collider with the dots physic system, I think they will support 2d soon

 

Is there any way to create your entities inside job with burst compile?
There is my try to do this:

Code (CSharp):

1. Entities
2. .ForEach((Entity entity, in ProjectilePrefabComponent projPrefab, in ProjectileSpeedComponent projSpeed) =>
3. {
4.     var projectile = ecb.Instantiate(projPrefab.projectilePrefab);
5.     ...
6.     //sprite
7.     ecb.AddComponent(projectile, new Scale { Value = 1f });
8.     UnityEngine.Material material = SpriteSheetCache.GetMaterial("emoji");
9.     int bufferID = DynamicBufferManager.AddDynamicBuffers(DynamicBufferManager.GetEntityBuffer(material), material);
10.     var spriteSheetMaterial = new SpriteSheetMaterial { material = material };
11.     BufferHook bh = new BufferHook { bufferID = bufferID, bufferEnityID = DynamicBufferManager.GetEntityBufferID(spriteSheetMaterial) };
12.     ecb.AddComponent(projectile, bh);
13.     ecb.AddSharedComponent(projectile, spriteSheetMaterial);
14. }).Schedule();

All another components i set earlier. Only Scale, SpriteSheetMaterial and BufferHook must be set here (i dont know why, but when i trying to set this 3 comps in IConvertGameObjectToEntity - it not appears on entity, maby because i instantiate entity from prefab).
When i run this code - it works, but i get error:
Burst error BC1001: Unable to access the managed method `object.Equals(object)` from type `SpriteSheetMaterial`

upd
Answer is here https://forum.unity.com/threads/bur...10-we-need-your-feedback.789473/#post-5286432
SetSharedComponent doesn't work with burst.

 

@FabrizioSpadaro is there any way to set up events or some sort of replacement of that?

EDIT. And changing Scale component into NonUniformScale broke rendering. I need a way to flip my sprites in one axis. Is there a way to achieve that?

 

Yeah.. and that is my horrible cheating system:

Code (CSharp):

1.  
2. Entities
3.   .ForEach((Entity entity, int entityInQueryIndex, ref Position2D pos, in LocalToWorld ltw) =>
4.   {
5.       pos.Value = new Unity.Mathematics.float2(ltw.Position.x, ltw.Position.y);
6.   }).ScheduleParallel();
7.  

Is there any better solution to follow sprite animation for physics body?

 

Right now only uniform scale is supported, but I am looking into supporting them soon

 

Can you give me more details?

 

I create entity with Physics body and Physics shape like that

Then i add to that entity components for SpriteSheetAnimation: Position2D, Rotation2D, etc.. Now my goal is that spritesheet follows for my physics body. I create system, that translate position from LocalToWorld (that used by unity physics system) to Position2D (that used by SpriteSheetRenderer). Is there any better way, that spritesheet follows for physics body?

 

What about events?

 

what kind of events are you talking about?

 

Yeah, all you need to do, is to create a system that takes the position and rotation from the rigid body, convert it to a
Position2D and Rotation2D, and then update those values with the entity Position2D and Rotation2D component of the Entity.
This week I will look into it and give you an even better reply.

 

If someone needed, there is my system to follow sprite to physics body:

Code (CSharp):

1. public class SyncPhysicsWithSpriteSystem : SystemBase
2. {
3.     protected override void OnUpdate()
4.     {
5.         Entities
6.             .WithChangeFilter<LocalToWorld>()
7.             .ForEach((Entity entity, int entityInQueryIndex, ref Position2D pos2d, ref Rotation2D rot2d, in LocalToWorld ltw) =>
8.             {
9.                 rot2d.angle = GetEulerZ(ltw.Rotation.value);
10.                 pos2d.Value = new Unity.Mathematics.float2(ltw.Position.x, ltw.Position.y);
11.             }).ScheduleParallel();
12.     }
13.  
14.     public static float GetEulerZ(float4 q)
15.     {
16.         double siny_cosp = +2.0 * (q.w * q.z + q.x * q.y);
17.         double cosy_cosp = +1.0 - 2.0 * (q.y * q.y + q.z * q.z);
18.         double res = math.atan2(siny_cosp, cosy_cosp);
19.  
20.         return (float)res * -1f;
21.     }
22. }

Also need small change in SpriteSheet.shader. This code:

Code (CSharp):

1. float4x4 rotationZMatrix(float rZ){
2.                 float angleZ = radians(rZ);

change to:

Code (CSharp):

1. float4x4 rotationZMatrix(float angleZ){
2.                 //float angleZ = radians(rZ);

I was trying to throw quaternion into shader directly to avoid double conversion of rotation, but it's too complicated for me..

 

Any kind really. Best possible option would be to have similar events to current unity ones. I.e. after x-th frame of animation

 

@FabrizioSpadaro, do you make comparsion between your renderer and official unity 2d renderer for DOTS? https://docs.unity3d.com/Packages/com.unity.2d.entities@0.22/manual/index.html

 

@FabrizioSpadaro is there any way to change animation on entity inside of Burst compiled jobs? There 2 issues:
1) need command buffer
2) burst jobs does'nt work with strings
3) Burst error BC1016: The managed function `SpriteSheetCache.GetAnimator(Unity.Entities.Entity e)` is not supported

So, i think it makes no sense to try make it work with burst jobs, right?

upd
I overcame the problem that way:
I add enum field in SpriteSheetAnimationData:

Code (CSharp):

1. public EntityAnimation.AnimationType animationType;

source code of my EntityAnimation class:

Code (CSharp):

1. public class EntityAnimation
2. {
3.     public struct AnimationComponent : IComponentData
4.     {
5.         public AnimationType currentAnimation;
6.     }
7.  
8.     public enum AnimationType
9.     {
10.         walk,
11.         idle
12.     }
13. }

Then i make some modifications in SpriteSheetAnimator to support enum:

Code (CSharp):

1. public abstract class SpriteSheetAnimator: ScriptableObject {
2.   public SpriteSheetAnimationData[] animations;
3.   public int defaultAnimationIndex;
4.   [HideInInspector]
5.   public int currentAnimationIndex = 0;
6.   public float speed = 1;
7.   [HideInInspector]
8.   public Entity managedEntity;
9.   public void Play(EntityAnimation.AnimationType animationType) {
10.     int i = 0;
11.     foreach(SpriteSheetAnimationData animation in animations) {
12.       if(animation.animationType == animationType) {
13.         SpriteSheetManager.SetAnimation(managedEntity, animation, animations[currentAnimationIndex].name);
14.         currentAnimationIndex = i;
15.       }
16.       i++;
17.     }
18.   }
19.   public static void Play(Entity e, EntityAnimation.AnimationType animationType){
20.     SpriteSheetAnimator animator = SpriteSheetCache.GetAnimator(e);
21.     int i = 0;
22.     foreach(SpriteSheetAnimationData animation in animator.animations) {
23.       if(animation.animationType == animationType) {
24.         SpriteSheetManager.SetAnimation(e, animation, animator.animations[animator.currentAnimationIndex].name);
25.         animator.currentAnimationIndex = i;
26.       }
27.       i++;
28.     }
29.   }
30. }

Then i add component EntityAnimation.AnimationComponent with animationType that i need inside Burst job.
And there is the system that change animation in main thread:

Code (CSharp):

1. public class ChangeAnimationSystem : SystemBase
2. {
3.     protected override void OnUpdate()
4.     {
5.         Entities
6.             .WithChangeFilter<EntityAnimation.AnimationComponent>()
7.             .ForEach((Entity entity, in EntityAnimation.AnimationComponent currentAnimation) =>
8.             {
9.                 SpriteSheetAnimator.Play(entity, currentAnimation.currentAnimation);
10.             })
11.             .WithStructuralChanges()
12.             .Run();
13.     }
14. }

But now i have some animation flickering problems.. probably with buffers and SpriteSheetManager.DestroyEntity. Tomorrow i will try fix it.

 

Hello everyone, today I pushed a new version and we have some new cool features.

UpdateEntity and DestroyEntity can now accept an EntityCommandBuffer enabling a faster execution when called insider a system.

Code (CSharp):

1. UpdateEntity(EntityCommandBuffer commandBuffer,Entity entity, IComponentData componentData)

Code (CSharp):

1. DestroyEntity(EntityCommandBuffer commandBuffer, Entity e, BufferHook hook)

SetAnimation can also run inside a system now

Code (CSharp):

1. SetAnimation(EntityCommandBuffer commandBuffer, Entity e, SpriteSheetAnimationData animation, BufferHook hook)

Another small performance improvement is that now the UV compute buffer only gets updated once per animation change.

I also found a way to update values inside the compute buffers only when they change, and this will massively boost performance and reduce the overhead of data transmission that we now have while updating the buffers every frame.

The problem with this, is that we need cached informations when we change an animation, and we can't retrieve those cached values inside a burst job.
There are some ways to achieve this, and it can be done! but it really depend on your use case, also I don't see the point in making the animation update inside a burst job, because you don't often see a scenario where you bulk update animations every frame.

 

I check your latest commit on github and there is nothing about new UpdateEntity methods, just old method:

 

Ops, internet crashed during the push, I' am sorry

 

Great project !

I made it work with my own sprites, packed out from an Atlas in the Editor.

But now I'm trying to adapt the SingleSpawnSprite example in order to load sprites dynamically from png files, and I fail. Maybe someone could help me ?

I'm loading my sprites that way:

Code (CSharp):

1. byte[] fileData = File.ReadAllBytes(filePath);
2. Texture2D texture = new Texture2D(2, 2);
3. texture.LoadImage(fileData);return Sprite.Create(texture, new Rect(0, 0, texture.width, texture.height), new Vector2(0.5f, 0.5f));

With that I'm creating an array of Sprite, each sprite from a different file, and I use this array of Sprite in my converter :

Code (CSharp):

1. public void Convert(Entity entity, EntityManager entityManager, GameObjectConversionSystem conversionSystem)
2. {
3.         m_entityManager = entityManager;
4.  
5.         // 1) Create Archetype
6.         m_treeArchetype = m_entityManager.CreateArchetype(
7.             typeof(Position2D),
8.             typeof(Rotation2D),
9.             typeof(Scale),
10.  
11.             //required params
12.             typeof(SpriteIndex),
13.             typeof(SpriteSheetAnimation),
14.             typeof(SpriteSheetMaterial),
15.             typeof(SpriteSheetColor),
16.             typeof(SpriteMatrix),
17.             typeof(BufferHook)
18.         );
19.  
20.         // 2) Record and bake this spritesheet(only once)
21.         SpriteSheetManager.RecordSpriteSheet(myArrayOfSprites, spriteSheetName);
22.  
23.         // 3) Populate components
24.         List<IComponentData> components = new List<IComponentData> {
25.             new Position2D { Value = float2.zero },
26.             new Scale { Value = 10 },
27.             new SpriteIndex { Value = UnityEngine.Random.Range(0, maxSprites) },
28.             new SpriteSheetAnimation { maxSprites = maxSprites, play = true, repetition = SpriteSheetAnimation.RepetitionType.Loop, samples = 500 },
29.             new SpriteSheetColor { color = new float4(1f, 1f, 1f, 1f) }
30.         };
31.  
32.         // 4) Instantiate the entity
33.         SpriteSheetManager.Instantiate(m_treeArchetype, components, spriteSheetName);
34. }

Problem : the entity is created, and all seems good in the Entity Analysis tool, sprite Index is looping etc., but visually, the animation is stuck on the first Sprite.

Any idea ?

 

Ok I found a solution : instead od loading each sprite separately, I load the sprite sheet and i store it in a texture, then I create the sprites using this texture.

 

Hi (once again)

I'm trying tu use your code to generate sprites dynamcally at runtime. So, basically, my code is based on your example SingleSpawnSprite. But with this method, the performances are very bad : 50.000 animated sprites -> 30 fps. Do you think it's normal, or is there something that I'm doing wrong ?

 

All the sprites are blinking for me, does anyone have any idea why?

 

Hi, is this still in development?

 

Looks like the last Github update was on June 18, 2020.

 

Sorry for bringing this up when its no longer developed, but have you figured out how to add flipping via using non-uniform scale?
I've modified the shader to use a float2 scale, and it works when x and y are both positive or negative, but breaks(nothing is rendered) when sign of x != sign of y (which is needed to flip on single axis)

@FabrizioSpadaro,
Is there maybe some limitation of how the rendering is done that makes this technically impossible?

EDIT:
The reason was that shader was set to Cull Back, changing it to Cull Off did the trick
if anyone needs it, you can find the modified shader & transform in my fork: TarasMartynyuk/SpriteSheetRenderer: A powerful Unity ECS system to render massive numbers of animated sprites. (github.com)

 

Hello Everyone, it's me FabrizioSpadaro, Sadly I lost access to my 2FA and I can't log in on that account unless unity devs come to my rescue.

I will start working on this project again after the summer vacation, I do not have set goals, but I have a few polishing/optimizations in mind.

The main reason that I made this repo public was to achieve something together with the community since as of late unity devs seems to have more "important" thing to focus on, so do not hesitate to create a pull request or suggest changes.

@TheSmokingGnu I honestly can't recall But I will give you more details once I reopen the project.