3 ms·
While I like Svelte, I fear it looses some of the flexible API-building enabled by React. Specifically: since it uses a templating system, you can't pass aroun
by SebastianKra 4y ago
While I like Svelte, I fear it looses some of the flexible API-building enabled by React.
Specifically: since it uses a templating system, you can't pass around interface definitions easily:
- https://github.com/sveltejs/svelte/issues/3480 https://github.com/sveltejs/svelte/issues/3480 (no dynamic slots)
- https://github.com/sveltejs/svelte/issues/5381 https://github.com/sveltejs/svelte/issues/5381 (can't wrap children)
You can always find workarounds for these cases, often using `<svelte:component>`, but React's Javascript/Typescript-centric design avoids such issues before they even occur. For instance, I can trivially define a tabbed interface by mixing strings, JSX, and components, without imposing any DOM-structure. The component that reads this definition can use it to build a tabbed-view on mobile, and a master-detail-view on desktop. It could even build a table of contents.
In the definition, I can still work mostly with strings, but fall back to JSX in the rare case where I do need some advanced formatting:
const tabs = [
{ name: "Tab 1", icon: <img ... />, content: MainTab },
{ name: <>Tab with <b>bold<b/> text</>, icon: <MyIconComponent ... />, content: SecondTab },
]
Again, I like Svelte, but I'm not yet sure whether the better syntax is worth the reduced expressivity.
- sesm 4y agoNot sure what you mean by `React's Typescript-centric design`, React used Flow from the very start and also had PropTypes for plain JS. Typescript support came much later.
- SebastianKra 4y agoI was thinking about the full power of JavaScript while still being perfectly typesafe. I edited the comment to hopefully better reflect that.
- rk06 4y agoJsx is expressive but it comes with a deviation from html. And loses optimization opportunities. Templates are closer to html, can be better optimized but lack expressiveness. Is there a third option which has both? Not yet for sure. Right now, you need to compromise somewhere. The only pragmatic option is to support both template and jsx (Vue approach) but then people complain about "complexity" and "multiple ways to do same thing"
- SebastianKra 4y agoReacts performance problems don't come from JSX, but rather how single updates can affect the entire tree below it. Solid uses fine-grained observability like Svelte and achieves similar performance [1]. SwiftUI uses static diffing, fine-grained observability, and avoids re-renders by comparing view dependencies [2]. It is performant even on watches. [1]: https://krausest.github.io/js-framework-benchmark/current.html https://krausest.github.io/js-framework-benchmark/current.ht... [2]: https://developer.apple.com/videos/play/wwdc2021/10022/ https://developer.apple.com/videos/play/wwdc2021/10022/