Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Introduction to Svelte

daveceddia.com

Post reply on HN
Print view View original

81–90 of 116 posts

Re: Introduction to Svelte

#81

Post by hajile »

acemarke wrote: post #61
playpause wrote: post #48

For those confused about the "29 MB": that's the size of the compiler itself. A compiled Svelte app is tiny . Taking the TodoMVC demo app as an example: React [1] : 289 KiB over the wire (decompresses to 1,255 KiB) Svelte [2] : 28 KiB over the wire (decompresses to 41 KiB) --- [1] http://todomvc.com/examples/react/ [2] https://github.com/sveltejs/svelte-todomvc

FWIW, that React demo should not be used as a network perf comparison in any way: - It's using an ancient version of React (0.13.3) - It's a debug build of "React with addons", not a minified prod build - It appears to include `JSXTransformer.js` as a separate script to handle in-browser JSX compilation If you were to redo this using a modern version of React and a standard CRA build, I guarantee it would be _much_ s…

Looks like Preact comes in at 6K (compresses to 4.7K). That's pretty interesting when you realize that Preact generally about as fast or faster than Svelte in a lot of benchmarks.

https://github.com/developit/preact-todomvc

https://medium.com/@ajmeyghani/javascript-frameworks-perform...

That said, I don't know that 6K vs 40K is particularly significant. For small apps, it disappears into the noise compared to ads, images, video, trackers, etc. For large apps, the framework starts to make less and less of a total percentage of the total app and often slides into insignificance on that side as well.

Re: Introduction to Svelte

#82

Post by nailer »

wirahx wrote: post #27
nailer wrote: post #2

I've been building something with Svelte 3 for about 6 months now. - As should be clear in the article, it's very easy to pick up. In the first couple of weeks I got compiler errors, and kept having to look at how props and binding worked in the tutorial, but now I just make components without having to really think about Svelte. - TS support is on the way (yaay) - I'd like to know more about server-side rendering on…

Sapper can generate static html for lambda or anything else i f you run `npm run export`. In fact the ideal way to use Sapper is without express/polka.

Hah brill. It might just be the tutorials, which seem focused on using express or something with express-like middleware. I'll do some further investigation. Thanks.

Re: Introduction to Svelte

#83

Post by daliusd »

kansface wrote: post #74
daliusd wrote: post #64

Earlier quoted context omitted.

What exactly JSX offers what templating does not?

JSX is JavaScript. I do not have to learn a new language to iterate over an array. I can interact with it using whatever JS libraries I prefer. JSX components are functions or classes which are trivially composable. I can type functions and classes with typescript unlike string templates.

> I can interact with it using whatever JS libraries I prefer.

Could you give an example with JSX where templating will not cut?

> JSX components are functions or classes which are trivially composable.

This is framework's feature IMHO not language's.

> I can type functions and classes with typescript unlike string templates.

Situation where types are important in other frameworks is JS part not templates part. Could you give an example where typing is import purely in component's return value?

Re: Introduction to Svelte

#84

Post by GordonS »

Doctor_Fegg wrote: post #4

> Another nice thing: the node_modules folder for this Hello World Svelte app totals only 29MB and 242 packages "Only".

Erm, for a JS project that uses NPM packages, that really is tiny.

IME it's not uncommon to see node_modules with thousands of packages.

Do keep in mind of course that these are dev-time dependencies, they don't go into production. IMO only 30MB of build deps is pretty damn good.

Re: Introduction to Svelte

#86

Post by dsego »

kansface wrote: post #74
daliusd wrote: post #64

Earlier quoted context omitted.

What exactly JSX offers what templating does not?

JSX is JavaScript. I do not have to learn a new language to iterate over an array. I can interact with it using whatever JS libraries I prefer. JSX components are functions or classes which are trivially composable. I can type functions and classes with typescript unlike string templates.

> JSX is JavaScript

JSX is decidedly not JavaScript, it is an extension to JavaScript.

> I do not have to learn a new language to iterate over an array.

Since you have to use map() and can't use a simple for-loop, not sure how knowing the language itself helps or not. Either way, loops and conditional are really the basics, you pick it up in a day or two for any template syntax.

> I can interact with it using whatever JS libraries I prefer.

Fair enough, but this prevents many optimizations because the render method can produce virtually anything.

> JSX components are functions or classes which are trivially composable.

This doesn't mean something else isn't as equally composable. Components are composable, doesn't mean they have to be classes or functions.

> I can type functions and classes with typescript unlike string templates.

What does this have to do with JSX ? I guess this is more valid claim for TSX. In any case, since svelte is a compiler, it should be possible to type-check components as well. And it doesn't even depend on typescript, so you can get the same static checks with vanilla javascript.

Re: Introduction to Svelte

#87

Post by dsego »

sktrdie wrote: post #37

I like reading scientific papers and most examples sections provide rich and intricate outlines of real-life use-cases where the idea can be experimented against. These examples usually involve quite complicated scenarios that "put the idea to the test". One that I recently read involved a solution to the "Challenge Problem" [1] (simulating the movement of a rover) which involves lots of interesting properties and al…

There's a bunch of real-world examples on the svelte website: https://svelte.dev/examples.

Re: Introduction to Svelte

#89

Post by Zelphyr »

jf22 wrote: post #79
esotericn wrote: post #47

Earlier quoted context omitted.

LOL. I am actually laughing here at this comment. 30 bloody meg. Never mind ageism in tech, this sort of thing will give me a heart attack before I'm halfway through my career. :D

If you think of js bundle size as a percentage of average hard drive space or compare to a ratio of broadband speeds then 30 megs doesn't seem so bad.

Still, seriously? 30MB to print "Hello, World"?

I can drive a Hummer H3 the block away to the 7-11 but wouldn't it be better if I at least try to ride my bike up there whenever possible?

Re: Introduction to Svelte

#90

Post by nailer »

azangru wrote: post #21
nailer wrote: post #10

Earlier quoted context omitted.

Ins't /Svelte/ the framework du jour? :)

Doesn't du jour imply that it's the go-to framework of the day? Surely, that would be React :-)

JQuery was a completely different way of looking at things with a huge advantage. It got popular and became the go-to tool of the day.

Backbone and Angular were a completely different way of looking at things with a huge advantage. They got popular and became the go-to tool of the day.

React was a completely different way of looking at things with a huge advantage. It got popular and became the go-to tool of the day.

Svelte is a completely different way of looking at things with a huge advantage.

Post reply on HN