Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[docs] "What's new in Svelte" May newsletter #7483

Merged
merged 9 commits into from
May 3, 2022
89 changes: 89 additions & 0 deletions site/content/blog/2022-05-01-whats-new-in-svelte-may-2022.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
---
title: "What's new in Svelte: May 2022"
description: "Dynamically switch between HTML element types with `<svelte:element>`"
author: Daniel Sandoval
authorURL: https://desandoval.net
---

With yesterday's Svelte Summit behind us, we've got a lot of news to share! check out all of the recordings on the [Svelte Society YouTube Channel](https://www.youtube.com/sveltesociety) and the rest of this month's updates below...
benmccann marked this conversation as resolved.
Show resolved Hide resolved

## What's new in Svelte
- The `<svelte:element>` element lets you render an element of a dynamically specified type. This is useful for example when rich text content from a CMS. If the tag is changed, the children will be preserved unless there's a transition attached to the element. Check out the [docs](https://svelte.dev/docs#template-syntax-svelte-element) or the [tutorial](https://svelte.dev/tutorial/svelte-element) for more info (**3.47.0**)!
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is useful for example when rich text content from a CMS.

Not sure if it's my English, but this sounds weird, like if some word is missing in this sentence.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yeah it should say "for" instead of "with"

DreaminDani marked this conversation as resolved.
Show resolved Hide resolved

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
- The `<svelte:element>` element lets you render an element of a dynamically specified type. This is useful for example when rich text content from a CMS. If the tag is changed, the children will be preserved unless there's a transition attached to the element. Check out the [docs](https://svelte.dev/docs#template-syntax-svelte-element) or the [tutorial](https://svelte.dev/tutorial/svelte-element) for more info (**3.47.0**)!
- `<svelte:element>` element, now lets you render an element of a dynamically specified type. This is useful for example; when rich text content is being brought in from an external CMS. If the tag is changed, the children will be preserved unless there's a transition attached to the element. Check out the [docs](https://svelte.dev/docs#template-syntax-svelte-element) or the [tutorial](https://svelte.dev/tutorial/svelte-element) for more info (**3.47.0**)!



## Language Tools updates
- `svelte:element` and `sveltekit:reload` are now supported
- Invalid Svelte import paths will now be automatically detected - see PR for getting back the old behavior ([#1448](https://github.com/sveltejs/language-tools/pull/1448))
- `source.sortImports` lets you sort imports without deleting unused imports ([#1338](https://github.com/sveltejs/language-tools/issues/1338))
- Hovering over HTML attributes will now show HTML hover info instead of the TS hover info - resulting in much more useful information ([#1447](https://github.com/sveltejs/language-tools/pull/1447))

DreaminDani marked this conversation as resolved.
Show resolved Hide resolved

## What's new in SvelteKit
- Files and directories can now be named `__tests__` and `__test__` in the routes directory ([#4438](https://github.com/sveltejs/kit/pull/4438))
DreaminDani marked this conversation as resolved.
Show resolved Hide resolved
- The `platform` parameter is now available for requests triggered by `fetch` in `load` during SSR ([#4599](https://github.com/sveltejs/kit/pull/4599))
benmccann marked this conversation as resolved.
Show resolved Hide resolved


**Breaking Changes**
- Validators are now called "matchers" ([Docs](https://kit.svelte.dev/docs/routing#advanced-routing-matching), [#4358](https://github.com/sveltejs/kit/pull/4358))
- `__layout.reset` has been replaced by named layouts ([Docs](https://kit.svelte.dev/docs/layouts#named-layouts), [#4388](https://github.com/sveltejs/kit/pull/4388))
DreaminDani marked this conversation as resolved.
Show resolved Hide resolved
- Prerendering is now skipped for `rel="external"` links ([#4545](https://github.com/sveltejs/kit/pull/4545))
- `maxage` is now `cache` in `LoadOutput` ([#4690](https://github.com/sveltejs/kit/pull/4690))


---

## Community Showcase

**Apps & Sites built with Svelte**
- [polySpectra AR](https://ar.polyspectra.com/) lets you prototype faster 3D Printing with seamless AR file handoffs ([video demo](https://www.youtube.com/watch?v=VhYCeVGcG3E))
- [Pixel Art Together](https://github.com/liveblocks/pixel-art-together) is a free multiplayer pixel art editor powered by Liveblocks
- [Tooling Manager](https://tooling-manager.netlify.app/) lets you compare your JavaScript Tech Stack against industry standard boilerplates
benmccann marked this conversation as resolved.
Show resolved Hide resolved
- [Easy Portfolio](https://easy-portfolio.com/) is a portfolio generator based on your GitHub Profile
benmccann marked this conversation as resolved.
Show resolved Hide resolved
- [FLOAT](https://github.com/muttoni/float) is an attendance tracking program for events
- [The Coin Perspective](https://thecoinperspective.com/) is a cryptocurrency price tracker and portfolio management tool
- [Locutionis](https://github.com/pbouillon/locutionis) is a small, online reference of figures of speech (en français)
- [ASM Editor](https://asm-editor.specy.app/) is an all in one web editor for M68K and MIPS
- [Otium](https://github.com/alombi/otium) is a free and open source book manager and bookshelf organiser, that helps you managing your books and the ones you would like to read
- [Sinwaver](https://github.com/Hugo-Dz/Sinwaver) is an SVG sine wave generator
-
DreaminDani marked this conversation as resolved.
Show resolved Hide resolved

Want to contribute to a modern SvelteKit website? [Help build the Svelte Society site](https://github.com/svelte-societ