"What's new in Svelte" October newsletter

[DreaminDani]

New blog post!

• new features (assumes "unreleased" changes will come in a new "minor" version, 3.26.0)
• bug fixes
• coming up (NEEDS DISCUSSION, can also remove this)
• showcase

Feel free to comment with any feedback!

[DreaminDani]

Needs Discussion

[kevmodrome]

On the community side there's both Svelte Society Day France as well as Svelte Summit. But I think you were asking more for development stuff?

[kevmodrome]

Something about $$slots should be in here! It's a pretty dope feature! 👍

[dummdidumm]

Something about the new createEventDispatcher typing for Typescript users and how to use it and its advantages would be cool. I can add a suggestion paragraph tomorrow if you want.

[pngwn]

There were a few fixes for await blocks too, they could be gathered together with a short description perhaps?

[kevmodrome]

Something about helping out with Svelte Society would be nice in here so we can move everything from svelte-community over! 👍

[benmccann]

typo: applicaiton

[benmccann]

Sapper - Sapper's CSS handling has been rewritten over the course of recent releases in order to fix existing CSS handling bugs, refactor the CSS handling to occur entirely within a Rollup plugin, and remove the need to register CSS in the routing system. We hope this will allow graduating the CSS handling out of Sapper and into an external Rollup plugin. It may also make it more feasible to move Sapper's routing into a separate project longer-term.

[benmccann]

not sure if this one is quite in a shareable state yet 😉 I'm guessing Rich might prefer not to promote it yet given that it's just playing around with ideas and not anything usable

[Rich-Harris]

yeah, it leaked on reddit but i reckon we should keep our powder dry for the minute!

[kevmodrome]

Would be great to get this sorted and posted before it gets stale 🙏

[DreaminDani]

@kevmodrome I'd like to post this on Oct 1, if possible. Most of the links to the "New Features" won't work until 3.26.0 (or equivalent) is out: https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md#unreleased

[DreaminDani]

Sapper - Sapper's CSS handling has been rewritten over the course of recent releases in order to fix existing CSS handling bugs, refactor the CSS handling to occur entirely within a Rollup plugin, and remove the need to register CSS in the routing system. We hope this will allow graduating the CSS handling out of Sapper and into an external Rollup plugin. It may also make it more feasible to move Sapper's routing into a separate project longer-term.

@benmccann would you prefer these changes be mentioned in the "Coming up" or "New features" section? I haven't had an eye on Sapper recently, so I'm not sure what the progress is on the features you mentioned :)

[dummdidumm]

(cannot make this a suggestion because of the code block unfortunately):

4. When using TypeScript, you can now type the createEventDispatcher method:

<script lang="ts">
    import { createEventDispatcher } from 'svelte';

    const dispatch = createEventDispatcher<{
        /**
         * you can also add docs
         */
        checked: boolean; // Will translate to `CustomEvent<boolean>`
        hello: string;
    }>();

    // ...
</script>

This will make sure that you can invoke dispatch only with the specified event names and its types. The Svelte for VS Code extension was also updated to deal with this new feature. It will provide autocompletion and hover information for these events and provide strong typing. Note though that this will NOT make the events strict in the sense that you would get type errors when trying to listen to other events when using the component.

[dummdidumm]

Maybe we could add some short introductionary sentences here, like "it was quiet for some time but we promise to be more active with news from now on".

[kevmodrome]

@kevmodrome I'd like to post this on Oct 1, if possible. Most of the links to the "New Features" won't work until 3.26.0 (or equivalent) is out: https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md#unreleased

That makes sense! I mistakenly thought it was meant to go out earlier. My bad! 🙏

[benmccann]

How about including just part of that and put it in the "new features":

Sapper's CSS handling has been rewritten over the course of recent releases in order to fix existing CSS handling bugs, refactor the CSS handling to occur entirely within a Rollup plugin, and remove the need internally to register CSS in the routing system.

[benmccann]

Sapper 0.28.9 just came out. The highlights from it include much better support for CSP nonces, asset preload support for exported pages, and error details are now available in the $page store on error pages

[dummdidumm]

The new {#key} feature should also get a section.

[evdama]

for the showcase section there are two really nifty ones I think could be shared

• https://github.com/langbamit/svelte-scrollto
• https://github.com/ukchukx/svelte-inline-input

Another thing what's imo lacking so far is nobody has done a proper idle-detection component yet afaict?!
Something along those lines... https://web.dev/idle-detection/

[kevmodrome]

It's almost October 1st. It would be great if this could be fast-tracked somehow, whenever @d3sandoval has updated with the latest comments 🥳

[DreaminDani]

Hey y'all! I updated the blog post. I did not incorporate the suggestions that covered changes released in previous months... otherwise this blog post would be SUPER long!

I'll be drafting a slightly-modified version of this post for my "unofficial" newsletter that links back to this post. Do you think we'd be able to get this merged before Oct. 1 at 6am Pacific? If so, I can link directly to this post in my mailing list :)

[dummdidumm]

I'd say for your own newsletter that's fine that you did not include it. But I think it would be cool to have the other notable features of the previous months in here, because there was no blog post from the official site inbetween.

[DreaminDani]

I'd say for your own newsletter that's fine that you did not include it. But I think it would be cool to have the other notable features of the previous months in here, because there was no blog post from the official site inbetween.

@dummdidumm Feel free to add any notable features that you think we shouldn't merge without :) For reference, here's the features I've called out over the past couple of months:

July 1

• Media elements now have a two-way binding for the muted attribute. Example
• The A11y linter will now warn you if you use an onChange without (or instead of) an onBlur (no-onchange was released in 3.23.0)

August 1

• First class Typescript support is now included in svlete-preprocess, VS Code (Atom and Vim coming soon)
• Self-closing <script/> and <style/> tags (useful for including SCSS files) are now handled by the preprocessor (v3.24.0, Example)
• Nullish coalescing (??) and optional chaining (?.) operators are now supported (v3.24.0)
• import.meta is now supported (more info, v3.24.0)

[dummdidumm]

I made some tiny changes here and there and added the createEventDispatcher typing description. From my side this is good to go. Thanks for the great write-up 👍

[DreaminDani]

LGTM! Thanks for the approval @benmccann and @dummdidumm . Feel free to merge when ready!

[DreaminDani]

OK Added some grammar and typo fixes. The post is scheduled on my end and points to the blog index page when referring to this post. Let me know if y'all need anything else from me before merging :D

Thanks again for the review and collaboration. Happy with what we put together! Looking forward to next month.