Back to Calendar

Day 3 {@attach}

Let it snow! Attachments are the gift that keeps on giving — a simpler, more powerful way to hook into DOM elements introduced in Svelte 5.29.

An attachment is just a function that receives a DOM node and optionally returns a cleanup function. Wrap it in a factory to pass options, like configuring how many snowflakes fall from the sky!

Unlike actions, attachments are inherently reactive — when your state changes, they automatically re-run like magic. And best of all, they're spreadable: wrapper components can accept attachments and pass them along to their elements, no extra plumbing required.

Think of attachments as Santa's little helpers for your DOM — they arrive when needed, do their work, and clean up after themselves!

Read the docs · Try the tutorial

Credits

Illustrations by Icons 8:

  • Santa Hat
  • Santa sleigh
  • Cookie
  • Heart
  • Santa face
  • Present
  • ID
  • Snowflake
  • Snow Globe
  • Question Mark
  • Fairy Lights
  • Piggy Bank
  • Globe
  • Present #2

Illustrations by Elisabet Guba:

  • Clock

Icons by Obra Icons

Challenges by Svelte Ambassadors:

  • Stanislav Khromov
  • Willow (GHOST)
  • Paolo Ricciuti

Santa Tracker Data by NORAD via Danielle Vass