Day 5, part two — the MediaQuery stuff is powered by createSubscriber, which is an advanced feature mainly for library authors. It makes it easy for you to build your own reactive classes that set up event listeners when something is read inside an effect. - docs svelte.dev/docs/svelte/... - ThreadSky

svelte.dev • 83 days ago

Day 5, part two — the MediaQuery stuff is powered by createSubscriber, which is an advanced feature mainly for library authors. It makes it easy for you to build your own reactive classes that set up event listeners when something is read inside an effect.

- docs https://svelte.dev/docs/svelte/svelte-reactivity#createSubscriber

Comments

rchaoz.bsky.social•81 days ago

I really like the new createSubscriber API! Although I'm curious, what really is the difference between using this new API and simply having a state field that is set whenever an onchange event of the media query is received?

svelte.dev•82 days ago

Day 6 — we now have modern state-based Spring and Tween classes for adding motion to your UI, replacing the `spring`/`tweened` stores of old. Smooth!

🎁 tutorial https://svelte.dev/tutorial/svelte/tweens
🎁 docs https://svelte.dev/docs/svelte/svelte-motion
🎁 demo https://svelte.dev/playground/8a021b2ec2064230bde4a10b08464876?version=5.8.0

lambdahass.bsky.social•82 days ago

Sliiiiiiiiiiick.

americanyak.bsky.social•82 days ago

svelte.dev•81 days ago

Day 7 — the first of a few planned improvements to the site. A lot of you (rightly!) disliked the tutorial dropdown navigation, so we fixed it. You can even navigate the tutorial with JS disabled, if you're so inclined

🎁 https://svelte.dev/tutorial

eracodes.net•80 days ago

🙌

andokai.dev•81 days ago

Slight issue in Safari

lolouthefox.bsky.social•80 days ago

Why is safari always the one that doesn't render like the others 🥲

rchaoz.bsky.social•81 days ago

Not sure if intended, but you didn't update the blog page with day 7 - https://svelte.dev/blog/advent-of-svelte

stevealee.bsky.social•80 days ago

7 and 8 there now

samalrasmussen.bsky.social•81 days ago

Oh I'm relieved. I was worried you guys thought that native selector with a huge list was a good solution.

svelte.dev•80 days ago

Day 8 — we're calling this 'function bindings'. You know how you can do `bind:value={value}`? You can now do this...

bind:value={getValue, setValue}

...which lets you transform and validate data

🎁 docs https://svelte.dev/docs/svelte/bind#Function-bindings
🎁 demo https://svelte.dev/playground/1ddd82f573b94201b3c8fcab33bf0a46?version=5.9.0

ray-thurn-void.bsky.social•80 days ago

This and error boundaries are huge improvements to svelte, thanks!

paulosantosvieira.bsky.social•79 days ago

1/2 Huge new feature! But this definitely need more examples and clarification. For instance, it's not clear where the transformation/validation should be (it seems it can be in either "set" or "get", no?). It reminds of getters and setters in POJO, but the semantics seem to be different.

paulosantosvieira.bsky.social•79 days ago

2/2 I set up a simpler example in the playground with a text input, if anyone wants to play with it. And I'm still a bit confused... https://svelte.dev/playground/d6cbf0e915874c6c99c01b79c55dfc5e?version=5.9.0

paolo.ricciuti.me•79 days ago

Put very simply: svelte will call your get function when needs to read the value for that binding and will call your set function when needs to set the value of that binding. Does this help clarify it?

stevealee.bsky.social•79 days ago

This is great but was not clear which "side" the get and set are with respect to; the attribute/property or the variable. Only the readonly example with no getter made it known.

stevealee.bsky.social•79 days ago

Should have said the example helps nail it!

chepulis.bsky.social•80 days ago

The example is white-on-white when in dark mode (Safari).

hanson190505.bsky.social•62 days ago

这非常酷

ryanatkn.com•80 days ago

lovely feature, and a great example of the design restraint that serves Svelte so well, in addressing this issue with extra power and elegant syntax - https://github.com/sveltejs/svelte/issues/3937

get/set continues to chalk up wins

samalrasmussen.bsky.social•80 days ago

I have wanted this for years! 🎉

svelte.dev•79 days ago

Day 9 — warnings and errors emitted by the compiler, or while your app is running, are now accompanied by links to the docs. Over time, we'll flesh out these docs with more details about what caused the error in question

🎁 demo https://svelte.dev/playground/8095884c1f5040ea846669b904083e25?version=5.10.0

svelte.dev•78 days ago

Day 10 — a lot of you wanted a place to put asynchronous setup work that happens before your SvelteKit app starts up. You can now export an `init` function from `hooks.server.js` and `hooks.client.js` that will be awaited before any other stuff happens

🎁 docs https://svelte.dev/docs/kit/hooks#Shared-hooks-init

aubergene.com•78 days ago

ooh love this, thought I couldn't find it before, checks src, merged 2 hours ago!

jyc.dev•78 days ago

Hoooo, I know where I would use this ☺️

svelte.dev•77 days ago

Day 11 — a whole new module, for getting reactive views of window properties like innerWidth, innerHeight, scrollX, scrollY and so on. Like the bindings on but with less boilerplate

🎁 docs https://svelte.dev/docs/svelte/svelte-reactivity-window
🎁 demo https://svelte.dev/playground/8ac86e10fdce485a99c29c95e0092df4?version=5.11.0

tilo.one•78 days ago

Now we need a `+loading.svelte` file to show a loading spinner 😬.

The same would be nice for `+page.js` and `+layout.ts` load functions.

Posting Rules

Be respectful to others
No spam or self-promotion
Stay on topic
Follow Bluesky's terms of service

Comments

Posting Rules

Reply