DEV Community

Cover image for Svelte referential identity
LG
LG

Posted on

4 3

Svelte referential identity

Okay I am switching from React to Svelte , because I love to feel DOM in my own hands , just like a mechanic fella who enjoys feeling engines into one's hands . I decided to follow Svelte wizard-like tutorial series on the man page , I've enjoyed till I've crossed what I've not figured out long time since started learning React tho . I guess I could justify there was no decent explanation why . Some people may agree with this , other may think I deserted React base . Without further ado , let's jump into code !


Consider the following code example as presented within this link :

{#each things as thing}
    <Thing name={thing.name}/>
{/each}
Enter fullscreen mode Exit fullscreen mode

That's what happens visually when no referential ID (thing.id) for code block provided :

Before

Explanation : the "stack's" index as presented in illustration above slides towards 0th index out of frame – This is not what we presumably expected tho , so let's fix this with the following tweak by adding a referential ID of (thing.id) as so :

{#each things as thing (thing.id)}
    <Thing name={thing.name}/>
{/each}
Enter fullscreen mode Exit fullscreen mode

Visual representation after tweak applied :

After

Now we removed first item as expected i.e. removing first item we removing first DOM node .


That's all folks in my very first of Svelte-series . If any typos found or suggestions could be made , please leave a comment below !

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read more →

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more