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

How I made a website with Svelte

johanronsse.be

Post reply on HN
Print view View original

111–120 of 130 posts

Re: How I made a website with Svelte

#111

Post by paulddraper »

marcus_holmes wrote: post #106
vikingcaffiene wrote: post #87

Earlier quoted context omitted.

I find it a little strange that you are pointing out comprehensive documentation on a module as proof of a problem with the framework... Lets talk about what you get with HttpClient: - Easy testing. Because its using the DI system, its very mockable. You can totally set this up with fetch or whatever behind a service but, well why? Its already done. - Robust type safety. Again you can set this up with fetch, but why?…

How come Vue doesn't need this stuff then?

You need this stuff, but Vue use you will figure out their own individual patterns or reach for a different tool.

Re: How I made a website with Svelte

#112

Post by avip »

marcus_holmes wrote: post #106
vikingcaffiene wrote: post #87

Earlier quoted context omitted.

I find it a little strange that you are pointing out comprehensive documentation on a module as proof of a problem with the framework... Lets talk about what you get with HttpClient: - Easy testing. Because its using the DI system, its very mockable. You can totally set this up with fetch or whatever behind a service but, well why? Its already done. - Robust type safety. Again you can set this up with fetch, but why?…

How come Vue doesn't need this stuff then?

Possibly because vue does not have any builtin http capability... which is kind of the point GGP is trying to make up there.

Angular is not overengineered, it's just feature-complete. vue is not "simple made easy", it just delegates lots of functionality to 3rd party, leaving the confused developer to read medium posts on the line of "axios vs. vue-resource".

I prefer the vue way, but it's a subjective personal preference and should basically be ignored by others.

Re: How I made a website with Svelte

#113

Post by JMTQp8lwXL »

paulddraper wrote: post #10

https://svelte.dev/ > Svelte is a radical new approach to building user interfaces. Whereas traditional frameworks like React and Vue do the bulk of their work in the browser, Svelte shifts that work into a compile step that happens when you build your app. > Instead of using techniques like virtual DOM diffing, Svelte writes code that surgically updates the DOM when the state of your app changes. That sounds like a…

Angular is (loosely) a superset of what Svelte provides: it's a templating engine, it has a built-in forms library, built-in routing, dependency injection, baked in i18n support, and better XSS sanitization than other frameworks. Angular's templating engine is fairly complex too; it, for example, has a concept of "pipes", so you can write something like this: "{{data | json}}" which will take a JS object, data, and pipe it through a function that returns a stringified version of it, which is what is used in your template. (Compared to other frameworks, this might seem obsolete since JSX is syntactic sugar for JS: in React, you'd just write: "{{JSON.stringify(data)}}").

It's commonly used with Angular CLI to have simple commands like "ng serve" and "ng build" to bundle your application. It also heavy handedly imposes constraints on the architecture of your application-- to some, that's a benefit. All Angular apps kind of look the same.

Re: How I made a website with Svelte

#114

Post by shantly »

avip wrote: post #112
marcus_holmes wrote: post #106

Earlier quoted context omitted.

How come Vue doesn't need this stuff then?

Possibly because vue does not have any builtin http capability... which is kind of the point GGP is trying to make up there. Angular is not overengineered, it's just feature-complete. vue is not "simple made easy", it just delegates lots of functionality to 3rd party, leaving the confused developer to read medium posts on the line of "axios vs. vue-resource". I prefer the vue way, but it's a subjective personal prefe…

> Possibly because vue does not have any builtin http capability

I mean, it does run in a web browser.

Re: How I made a website with Svelte

#115

Post by bwblabs »

deltron3030 wrote: post #41

I dig the simplicity, but why didn't you use Sapper? https://sapper.svelte.dev/ (Next.js/Nuxt pendant based on Svelte, can also be used as static site generator).

Sapper is very useful and has quite some nice properties:

- automatic SSR (Server Side Rendering)

- possibility to export to server-less plain HTML/CSS/JS

- option to resource preload/fetching on mouseover/touchstart (a headstart of 300+ms)

- serviceworker cache: PWA, offline support, etc.

- session stores

Sure there is room for improvement (e.g. i18n), but it very useful and powerful already today.

Re: How I made a website with Svelte

#116

Post by saagarjha »

tashoecraft wrote: post #80
83hajfjeijg wrote: post #32

Earlier quoted context omitted.

No, you make a small web app. It doesn't have to be a big project, but it should be something that benefits from what the framework can deliver. This doesn't. If you're "exploring game engines" making a resume with one is probably not what you should reach for and if you're "exploring DAWs" your testbed shouldn't be generating a pure sine wave. This sort of site is the opposite of a perfect testbed for a framework. T…

Please stop, people can build whatever they want how ever they wish, especially when it’s not planned to be super public. They wish to build it in svelte, that’s all the reasoning you need. I’ve also literally seen someone use a game engine to build a resume on here, it was super cool and attracted a lot of interest

What is a personal website if not something that you make super public?

Re: How I made a website with Svelte

#117

Post by saagarjha »

yroc92 wrote: post #94
reaperducer wrote: post #25

I'm afraid I honestly don't understand. What was the reason for using a bunch of frameworks and JavaScript for what appears to be a super simple web site? I don't see anything that couldn't have been done in plain static HTML and CSS. Is there some functionality on the pages that I'm missing?

In my experience, there’s seldom such thing as a “super simple web site”. I always run into situations where some dynamic functionality is required and vanilla JavaScript gets messy very quickly. Svelte is so compact and easy that it is the ideal tool for such scenarios.

What kinds of things do you find yourself using dynamic functionality for on a personal website/blog?

Re: How I made a website with Svelte

#118

Post by Rapzid »

I need to read more into svelte but I often find myself bogged down the contrived surgical DOM update examples.

Well.. With redux or Mobx you are largely updating existing DOM attributes in both Vue and React. The overhead in changing existing attributes on components is fairly minimal, and it's certainly not where the bulk of the performance issues in these systems are. It's also not where the value is.

The real value in Vue and React is reconciling data _graphs_ with the DOM _graph_. Unfortunately the need to reconcile the full graph, or even parts of the graph, is where a lot of the performance hit comes from. Particularly with lists; hence virtual scrollers. With the advent of proxies though, I would suspect both Vue and React could be retooled a bit to be more clever about how the DOM graph gets updated in response to changes in lists and other data graphs. More "surgical" so to speak.

Am I missing something or could the bulk of the performance gap be made up without needing to ditch React and Vue(throwing the baby out with the bath water so to speak)?

Re: How I made a website with Svelte

#119

Post by Rapzid »

BiteCode_dev wrote: post #95
crtlaltdel wrote: post #54

Earlier quoted context omitted.

I'm not sure how it forces less logic in the render. Looking at the Svelte docs you can do this: ``` {#if invokeFunction()} This function returned a truthy value! {/if} ``` And with React do this: ``` { invokeFunction() && This function returned a truthy value } ``` and the result would be the same, a conditionally rendered string. I totally agree in the normalizing/formalizing how templates are build and the more ve…

In Vue it would be: {{ vars }} Instead of: { collection.map((vars, i) => {vars} } It's easier for me to picture what the first example is going to render because it makes the markup the hero, with code inside, while the second example is making JS the hero, with markup inside. But this example is not even touching the topic. A render function is rarely that simple. Now if you do maps, and filters, and ternary operato…

Vue's templates are great until they aren't, and then you wish you were using JSX.

The IDE tooling is worlds better with JSX as well. Vetur has.. had a rough year.

Re: How I made a website with Svelte

#120

Post by tashoecraft »

saagarjha wrote: post #116
tashoecraft wrote: post #80

Earlier quoted context omitted.

Please stop, people can build whatever they want how ever they wish, especially when it’s not planned to be super public. They wish to build it in svelte, that’s all the reasoning you need. I’ve also literally seen someone use a game engine to build a resume on here, it was super cool and attracted a lot of interest

What is a personal website if not something that you make super public?

Scale. Just because it was posted on their website doesn't mean they intended to draw a large, extremely critical crowd to it.

It was also the tone the commenter posted in here and across this post that came across very condescending with a holier than thou feel. They also created this account today and have been flagged and had a mod post about their postings. So if they offered some helpful advice in a more constructive way their wouldn't be a need to tell them to stop.

Post reply on HN