Performance issue

[thibault60000]

Hi, thanks for this lib. I have a performance issue with this code

<button on:click={resetGrid}> Reset</button>
        <Grid collision="compress" {itemSize} cols={10} gap={20} bind:controller={gridController}>
            {#each widgetsGrid as value, i (i)}
                <div transition:fade={{ duration: 300 }}>
                    <GridItem
                        class="grid-item"
                        activeClass="grid-item-active"
                        previewClass="bg-green-500 rounded"
                        id={value.name}
                        bind:x={value.x}
                        bind:y={value.y}
                        bind:w={value.w}
                        bind:h={value.h}
                    >
                        <a href={getRoutePath(value.name)}>
                            <span>
                                <i
                                    class="fa-light text-xl font-semibold {value.icon}"
                                    aria-hidden="true"
                                />
                            </span>
                            <span>{$t(camelCase(value.name))}</span>
                        </a>
                    </GridItem>
                </div>
            {/each}
        </Grid>

I need to long press an element an release to drag'n'drop and it's not smooth .. I don't understand why

I used an Array with

{
    name: 'test',
    icon: 'fa-steering-wheel',
    w: 2,
    h: 1
}

And I create the final object for my grid with :

let widgetsGrid: Widget[] = widgets.map((widget: Widget, i: number) => ({
        ...widget,
        x: (i % 5) * widget.w,
        y: Math.floor(i / 5)
    }));

To create a grid with element of width 2

[cuire]

What browser are you using? Can you create a repl? I cant reproduce it with that tiny amount of information. https://svelte.dev/repl/c74d26814016449f989dd704f3dd74d8?version=4.2.8

[cuire]

Stale