Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: "Frameworks without the framework: why didn't we think of this sooner?"
description: You can't write serious applications in vanilla JavaScript without hitting a complexity wall. But a compiler can do it for you.
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

> Wait, this new framework has a _runtime_? Ugh. Thanks, I'll pass.
Expand All @@ -12,7 +12,7 @@ We're shipping too much code to our users. Like a lot of front end developers, I

But I was wrong. 100kb of .js isn't equivalent to 100kb of .jpg. It's not just the network time that'll kill your app's startup performance, but the time spent parsing and evaluating your script, during which time the browser becomes completely unresponsive. On mobile, those milliseconds rack up very quickly.

If you're not convinced that this is a problem, follow [Alex Russell](https://twitter.com/slightlylate) on Twitter. Alex [hasn't been making many friends in the framework community lately](https://twitter.com/slightlylate/status/728355959022587905), but he's not wrong. But the proposed alternative to using frameworks like Angular, React and Ember – [Polymer](https://www.polymer-project.org/1.0/) – hasn't yet gained traction in the front end world, and it's certainly not for a lack of marketing.
If you're not convinced that this is a problem, follow [Alex Russell](https://bsky.app/profile/infrequently.org) on BlueSky. Alex [hasn't been making many friends in the framework community lately](https://twitter.com/slightlylate/status/728355959022587905), but he's not wrong. But the proposed alternative to using frameworks like Angular, React and Ember – [Polymer](https://www.polymer-project.org/1.0/) – hasn't yet gained traction in the front end world, and it's certainly not for a lack of marketing.

Perhaps we need to rethink the whole thing.

Expand All @@ -30,7 +30,7 @@ Svelte is a new framework that does exactly that. You write your components usin

The [Svelte implementation of TodoMVC](https://svelte-todomvc.surge.sh/) weighs 3.6kb zipped. For comparison, React plus ReactDOM _without any app code_ weighs about 45kb zipped. It takes about 10x as long for the browser just to evaluate React as it does for Svelte to be up and running with an interactive TodoMVC.

And once your app _is_ up and running, according to [js-framework-benchmark](https://github.com/krausest/js-framework-benchmark) **Svelte is fast as heck**. It's faster than React. It's faster than Vue. It's faster than Angular, or Ember, or Ractive, or Preact, or Riot, or Mithril. It's competitive with Inferno, which is probably the fastest UI framework in the world, for now, because [Dominic Gannaway](https://twitter.com/trueadm) is a wizard. (Svelte is slower at removing elements. We're [working on it](https://github.com/sveltejs/svelte/issues/26).)
And once your app _is_ up and running, according to [js-framework-benchmark](https://github.com/krausest/js-framework-benchmark) **Svelte is fast as heck**. It's faster than React. It's faster than Vue. It's faster than Angular, or Ember, or Ractive, or Preact, or Riot, or Mithril. It's competitive with Inferno, which is probably the fastest UI framework in the world, for now, because [Dominic Gannaway](https://bsky.app/profile/trueadm.dev) is a wizard. (Svelte is slower at removing elements. We're [working on it](https://github.com/sveltejs/svelte/issues/26).)

It's basically as fast as vanilla JS, which makes sense because it _is_ vanilla JS – just vanilla JS that you didn't have to write.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: The zen of Just Writing CSS
description: I would say this is the future, but we're already doing it.
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

It's fashionable to dislike CSS. There are lots of reasons why that's the case, but it boils down to this: CSS is _unpredictable_. If you've never had the experience of tweaking a style rule and accidentally breaking some layout that you thought was completely unrelated — usually when you're trying to ship — then you're either new at this or you're a much better programmer than the rest of us.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: 'Sapper: Towards the ideal web app framework'
description: Taking the next-plus-one step
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

> Quickstart for the impatient: [the Sapper docs](https://sapper.svelte.dev), and the [starter template](https://github.com/sveltejs/sapper-template)
Expand Down
2 changes: 1 addition & 1 deletion apps/svelte.dev/content/blog/2018-04-18-version-2.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: Svelte v2 is out!
description: Here's what you need to know
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

<aside>Our motto is 'move slowly and break things'. No, wait, that came out wrong...</aside>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: Using CSS-in-JS with Svelte
description: You don't need to, but you can
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

CSS is a core part of any web app. By extension, a UI framework that doesn't have a built-in way to add styles to your components is unfinished.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: Virtual DOM is pure overhead
description: Let's retire the 'virtual DOM is fast' myth once and for all
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

If you've used JavaScript frameworks in the last few years, you've probably heard the phrase 'the virtual DOM is fast', often said to mean that it's faster than the _real_ DOM. It's a surprisingly resilient meme — for example people have asked how Svelte can be fast when it doesn't use a virtual DOM.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: Svelte on The Changelog
description: Listen to the interview here
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

Earlier this month, I had the privilege of appearing on [The Changelog](https://changelog.com/podcast), a podcast about software development. We had a fun (for me) and wide-ranging conversation:
Expand All @@ -14,8 +14,8 @@ Earlier this month, I had the privilege of appearing on [The Changelog](https://

...and, most importantly, Svelte 3.

Unless you hang out in our [Discord server](/chat) or follow [@sveltejs](https://twitter.com/sveltejs) on Twitter, you might not know that Svelte 3 is just around the corner, and it's going to be a huge release. We've rethought the developer experience from the ground up, and while it _will_ be a nuisance if you need to upgrade a Svelte 2 app (more on that soon) we think you're going to love it.
Unless you hang out in our [Discord server](/chat) or follow [@sveltejs](https://bsky.app/profile/svelte.dev) on BlueSky, you might not know that Svelte 3 is just around the corner, and it's going to be a huge release. We've rethought the developer experience from the ground up, and while it _will_ be a nuisance if you need to upgrade a Svelte 2 app (more on that soon) we think you're going to love it.

On the podcast [Adam](https://twitter.com/adamstac), [Jerod](https://twitter.com/jerodsanto) and I talk about some of the changes and why we're making them. You can listen here or on the [podcast page](https://changelog.com/podcast/332).
On the podcast [Adam](https://bsky.app/profile/adamstac.bsky.social), [Jerod](https://bsky.app/profile/jerod.bsky.social) and I talk about some of the changes and why we're making them. You can listen here or on the [podcast page](https://changelog.com/podcast/332).

<audio data-theme="night" style="width: 100%" data-src="https://changelog.com/podcast/332/embed" src="https://cdn.changelog.com/uploads/podcast/332/the-changelog-332.mp3" preload="none" class="changelog-episode" controls></audio><p><a href="https://changelog.com/podcast/332">The Changelog 332: A UI framework without the framework</a> – Listen on <a href="https://changelog.com/">Changelog.com</a></p><script async src="//cdn.changelog.com/embed.js"></script>
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: Setting up your editor
description: Instructions for configuring linting and syntax highlighting
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
draft: true
---

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: Svelte for new developers
description: Never used Node.js or the command line? No problem
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

This short guide is designed to help you — someone who has looked at the [tutorial](/tutorial) and wants to start creating Svelte apps, but doesn't have a ton of experience using JavaScript build tooling — get up and running.
Expand Down
2 changes: 1 addition & 1 deletion apps/svelte.dev/content/blog/2019-04-20-write-less-code.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: Write less code
description: The most important metric you're not paying attention to
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

All code is buggy. It stands to reason, therefore, that the more code you have to write the buggier your apps will be.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: 'Svelte 3: Rethinking reactivity'
description: It's finally here
author: Rich Harris
authorURL: https://twitter.com/Rich_Harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

After several months of being just days away, we are over the moon to announce the stable release of Svelte 3. This is a huge release representing hundreds of hours of work by many people in the Svelte community, including invaluable feedback from beta testers who have helped shape the design every step of the way.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: Svelte <3 TypeScript
description: Typernetically enhanced web apps
author: Orta Therox
authorURL: https://twitter.com/orta
authorURL: https://bsky.app/profile/orta.io
---

It's been by far the most requested feature for a while, and it's finally here: Svelte officially supports TypeScript.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: What's the deal with SvelteKit?
description: We're rethinking how to build Svelte apps. Here's what you need to know
author: Rich Harris
authorURL: https://twitter.com/rich_harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

<aside><p>If you <em>didn't</em> attend Svelte Summit, you can catch up on the <a href="https://www.youtube.com/c/SvelteSociety/videos">Svelte Society YouTube page</a></p></aside>
Expand Down Expand Up @@ -91,4 +91,4 @@ Keep your eyes peeled for announcements about when we'll launch the public beta

## Where can I learn more?

Follow [@sveltejs](https://twitter.com/sveltejs) and [@SvelteSociety](https://twitter.com/SvelteSociety) on Twitter, and visit [svelte.dev/chat](/chat). You should also subscribe to [Svelte Radio](https://www.svelteradio.com/), where Kevin and his co-hosts will grill me about this project on an upcoming episode (and between now and next week when we record it, [reply to this Twitter thread](https://twitter.com/Rich_Harris/status/1323376048571121665) with your additional questions).
Follow [svelte.dev](https://bsky.app/profile/svelte.dev) and [sveltesociety.dev](https://bsky.app/profile/sveltesociety.dev) on BlueSky, and visit [svelte.dev/chat](/chat). You should also subscribe to [Svelte Radio](https://www.svelteradio.com/), where Kevin and his co-hosts will grill me about this project on an upcoming episode (and between now and next week when we record it, [reply to this Twitter thread](https://twitter.com/Rich_Harris/status/1323376048571121665) with your additional questions).
4 changes: 2 additions & 2 deletions apps/svelte.dev/content/blog/2021-03-23-sveltekit-beta.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: SvelteKit is in public beta
description: And we'd love to have your feedback
author: Rich Harris
authorURL: https://twitter.com/rich_harris
authorURL: https://bsky.app/profile/rich-harris.dev
---

<aside><p>Previously: <a href="/blog/whats-the-deal-with-sveltekit">What's the deal with SvelteKit?</a></p></aside>
Expand Down Expand Up @@ -40,7 +40,7 @@ One thing that might seem surprising after the [announcement video](/blog/whats-

Snowpack created an entirely new category of dev tooling. Rather than _bundling_ your app in development, as we've been doing with webpack and Rollup for the last several years, Snowpack is an _unbundled dev server_ that uses the browser's native `import` and does 1:1 transformations of things like Svelte components on the fly. As a result you get quick startup, simple caching and instant hot module reloading. Once you experience this way of working, it will ruin you for anything else.

Vite falls into the same category as Snowpack. While Vite 1 wasn't suitable for SvelteKit — it was Vue-centric (Vite and Vue are both created by [Evan You](https://twitter.com/youyuxi)) and made server-side rendering difficult — Vite 2 is framework-agnostic and designed with SSR at the core. It also has powerful features, like CSS code-splitting, that we previously had to implement ourselves. When we evaluated the two technologies side-by-side we were forced to conclude that Vite is a closer match for SvelteKit's requirements and would give us the best chance to deliver the framework of our imaginations.
Vite falls into the same category as Snowpack. While Vite 1 wasn't suitable for SvelteKit — it was Vue-centric (Vite and Vue are both created by [Evan You](https://bsky.app/profile/evanyou.me)) and made server-side rendering difficult — Vite 2 is framework-agnostic and designed with SSR at the core. It also has powerful features, like CSS code-splitting, that we previously had to implement ourselves. When we evaluated the two technologies side-by-side we were forced to conclude that Vite is a closer match for SvelteKit's requirements and would give us the best chance to deliver the framework of our imaginations.

We owe a deep debt of gratitude to the Snowpack team, both for the close collaboration earlier in development and for lighting the path that web development will take over the next few years. It's a wonderful tool, and you should absolutely try it out.

Expand Down
Loading
Loading