Live data from Hacker News

Svelte is the most beautiful web framework I've seen

thefutureoftheweb.com

101–110 of 210 posts

Re: Svelte is the most beautiful web framework I've seen

#101

I have a table of 100 rows x 10 columns mostly of numbers which change 10 times a second (think trading). The source data sits in an array of objects. On each update, I need to update the table cells with the latest values from the source array. The content of each cell can change, possibly it's css class too (from red it become blue for example). I'm using Vue/Bootstrap-Vue table at the moment, but it's quite slow.…

Check out canvas-datagrid: https://github.com/TonyGermaneri/canvas-datagrid

I'm using it to mimic Excel-like display of data, and it's pretty responsive, but I'm not at your scale of 10x/sec.

It also supports cell highlighting with different colors, but, unfortunately, doesn't natively support CSS-type classes on cells.

Re: Svelte is the most beautiful web framework I've seen

#102

Interesting that the custom element appears to just take a single JavaScript object as a parameter: In JSX this would be either: or: This is almost as ergonomic as JSX except for attributes like checked where the value is omitted. It might encourage some refactoring, compared with React, because the thought of putting attributes in a variable and adding them as a spread might occur more often when seeing an object be…

Am I the only one who would rather write the following instead of JSX? Board.draw(game) or drawBoard(game)

Not sure how that's a preference without any further context about how you plan on writing the rest of the client. For all we know, both of those functions return .

Re: Svelte is the most beautiful web framework I've seen

#103

I have a table of 100 rows x 10 columns mostly of numbers which change 10 times a second (think trading). The source data sits in an array of objects. On each update, I need to update the table cells with the latest values from the source array. The content of each cell can change, possibly it's css class too (from red it become blue for example). I'm using Vue/Bootstrap-Vue table at the moment, but it's quite slow.…

Look into https://github.com/finos/perspective/

WebAssembly might help you as well.

Re: Svelte is the most beautiful web framework I've seen

#104

Earlier quoted context omitted.

Am I the only one who would rather write the following instead of JSX? Board.draw(game) or drawBoard(game)

Not sure how that's a preference without any further context about how you plan on writing the rest of the client. For all we know, both of those functions return .

> For all we know, both of those functions return .

No.

Re: Svelte is the most beautiful web framework I've seen

#105

I have a table of 100 rows x 10 columns mostly of numbers which change 10 times a second (think trading). The source data sits in an array of objects. On each update, I need to update the table cells with the latest values from the source array. The content of each cell can change, possibly it's css class too (from red it become blue for example). I'm using Vue/Bootstrap-Vue table at the moment, but it's quite slow.…

No matter which framework you describe, this is an iterative approach and will be inefficient. The optimized (or, at least faster) way to handle this would be to have a unique ID attached to a cell and offer a direct callback to it via the data. E.g. the symbol for "GOOG" stored in a hash table, when GOOG updates; call that hash directly: "symbols[symbol].update(data)" then re-render the cell DOM element.

If you update all the data why is this more efficient?

Re: Svelte is the most beautiful web framework I've seen

#106
post #17

Earlier quoted context omitted.

You're right that it's more options, but it's also one more box a "competent JS dev" is expected to tick. One of the best and worst things about the JS ecosystem is the plethora of choices available. On compilation, nope. Riot.js did it first, and this is literally the entire premise of typescript (I know typescript is a different language, but I see little difference here as it can mix with JS between writing only s…

> But I also don't see why they couldn't have submitted a PR to react/angular/ember/meteor/vue. I see this sentiment a lot in open source. When I made Rollup — which is now used to build the most popular libraries in the JavaScript ecosystem, including some you just mentioned! — people asked why I didn't just submit a PR to webpack? I understand why people ask that. But it just doesn't work like that. Very often, to…

FWIW I did a project with Ractive before React became popular, and I liked it. I guess for many problems it would still be enough if only it were more popular.

Re: Svelte is the most beautiful web framework I've seen

#107

I have a table of 100 rows x 10 columns mostly of numbers which change 10 times a second (think trading). The source data sits in an array of objects. On each update, I need to update the table cells with the latest values from the source array. The content of each cell can change, possibly it's css class too (from red it become blue for example). I'm using Vue/Bootstrap-Vue table at the moment, but it's quite slow.…

Look into https://github.com/finos/perspective/ WebAssembly might help you as well.

Good rec! Perspective was purpose built for this precise use case at JPMC, and has some unique features such as streaming Apache Arrow support, which can pretty easily handle datasets in the low millions of rows, at thousands of updates/second.

Source - I work on perspective.

Re: Svelte is the most beautiful web framework I've seen

#108
post #68

Earlier quoted context omitted.

I think svelte compiling to native javascript is lightyears more understandable than whatever the hell react is doing

I think it's the reverse. If you write pure functional components, React is very understandable. It's easily testable, you know that you'll have the same output if you pass it the same props. Svelte templates just take us back where we've been, with the twist of compiling the templates, which I believe some templating libraries already did.

React conceptually is very understandable, but understanding what it's actually doing under the hood is not.

Re: Svelte is the most beautiful web framework I've seen

#109
As someone who has built a number of data products w/ React, I decided to give Svelte a try a few months ago. At this point I am using it on some internal projects to great success & ease and probably wouldn't go back to React for newer projects unless there was a compelling reason to (eg collaboration w/ other React devs). As a disclaimer, I admire the React community + devs and think React has made a lot of hard things much, much easier.

A few unvarnished takeaways from a data science / viz point of view that I was thinking of writing up, but will use HN as a sketchpad:

1. I don't really miss the React 3rd party ecosystem as much as I thought I would. Since most of what I do is data viz / data presentations, I really just need a few d3 helper functions, and most other things I can build myself w/ svelte's affordances. The biggest downside, however, is that there aren't any good accessible UX component libraries for Svelte, so I have built my own. This all said, I'm productively code-homesteading and I love it. Animating component lifecycles, component style scoping, and state management are 1st-class citizens, so these pieces are pretty high-quality, usable, and thoughtfully built.

2. my "time to first meaningful render" metric was at an all-time low with Svelte. Getting started on a new idea or project is far, far easier than w/ any React project I've ever done. Substantially less boilerplate means I can get much, much more done in the same amount of time. I feel this every time I jump back into the React projects I work on & maintain.

3. as my apps have grown in complexity, I've found that Svelte really holds up beautifully. The style/layout/behavior colocation strategy keeps the cognitive overhead of working on all the parts of multiple components to a minimum. The performance gains of Svelte, even with complex components and interactions, feels magical. Bundle sizes are bizarrely small.

4. as someone who feels CSS will absolutely outlive all of these frameworks, I think the design of Svelte really feels like the best of both worlds. And that's how it should be – css + markup should be first-class citizens.

5. the testing story isn't fully there yet, so I would say to that end, proceed with caution. I typically try to compartmentalize JS logic from presentation as much as possible, but perhaps you don't.

6. the reactivity parts shine everywhere and are fairly easy to reason about in all cases, but they REALLY shine when you're building complex visualizations.

7. this is an important one to me – building something in Svelte really tickles the same part of the pleasure centers of the brain that JQuery did for a previous generation (and d3 did for early data scientists). You just SEE the thing work, effortlessly, at a low cognitive cost, and everything fits together so nicely. I often start svelte-powered experiments and end with a great, reusable component. I think there is a large group of engineers who remember the JQuery days and sat out the React era because it just seemed like way too much to do simple things. I think Svelte is especially for them.

In sum, really highly recommended to at least try it. I wanted to find evidence to discount Svelte, but haven't found any at this point, despite my best efforts. There is probably a certain class of dev that should be trying it – one without a ton of organizational constraints, probably. But if you do data science and want to level up your data presentation skills, you should be using Svelte imo.

Post reply on HN