Group of paths with Shadows overlap each other. >> change version 6, another problem arose!

[aurpo1]

Hi!
I'm developing a drawing app. In my app, can draw a line with a shadow.
And for performance, I came up with some method that:
When a certain number of paths (e.g. 5) are drawn on the canvas, the previously drawn paths are grouped.
Like this, "( )" means group.
[a, b, c, d, e, f]
[(a), b, c, d, e, f, g]
[(a, b), c, d, e, f, g, h]
[(a, b, c), d, e, f, g, h, I] ...

But, simple paths is not problem. Group of paths with shadow overlap each other.


Why does this happen? If you have any suspicious factors, please let me know.

++
After looking into it, I found out that the group rewrote it in version 6.
I changed the version and tried again, bu another problem arose.

If you look at the paths drawn first(Being added to the group), you will see that the shadows appear to disappear.
Why does this happen? If you have any suspicious factors, please let me know.

++
My project is :

• canvas.isDrawingMode: true,
• path with shadow
• canvas.on('object:added', e => updateCanvas(e))
• const objs = canvas.getObjects();
• In updateCanvas, when there are more than 6 objects in canvas, the oldest object is added to the group object(objs[0]) that was initially placed.