Need advice about which tool to choose?Ask the StackShare community!

Preact

202
233
+ 1
24
Svelte

690
795
+ 1
412
Add tool

Preact vs Svelte: What are the differences?

Preact: A fast 3k React alternative. Preact is an attempt to recreate the core value proposition of React (or similar libraries like Mithril) using as little code as possible, with first-class support for ES2015. Currently the library is around 3kb (minified & gzipped); Svelte: A UI framework that compiles into tiny standalone JavaScript modules. If you've ever built a JavaScript application, the chances are you've encountered – or at least heard of – frameworks like React, Angular, Vue and Ractive. Like Svelte, these tools all share a goal of making it easy to build slick interactive user interfaces. Rather than interpreting your application code at run time, your app is converted into ideal JavaScript at build time. That means you don't pay the performance cost of the framework's abstractions, or incur a penalty when your app first loads.

Preact and Svelte can be categorized as "Javascript UI Libraries" tools.

"Lightweight" is the top reason why over 7 developers like Preact, while over 2 developers mention "Javascript compiler (do that browsers don't have to)" as the leading cause for choosing Svelte.

Preact and Svelte are both open source tools. It seems that Preact with 22.9K GitHub stars and 1.19K forks on GitHub has more adoption than Svelte with 19.2K GitHub stars and 715 GitHub forks.

Decisions about Preact and Svelte
Máté Homolya
Senior developer at Self-employed · | 11 upvotes · 104.8K views
Migrated
from
React
to
Svelte

Svelte is everything a developer could ever want for flexible, scalable frontend development. I feel like React has reached a maturity level where there needs to be new syntactic sugar added (I'm looking at you, hooks!). I love how Svelte sets out to rebuild a new language to write interfaces in from the ground up.

See more
Alex Guesnon
Full-stack software engineer · | 3 upvotes · 58.9K views
Chose
Svelte
over
Vue.js

Svelte 3 is exacly what I'm looking for that Vue is not made for.

It has a iterable dom just like angular but very low overhead.

This is going to be used with the application.

for old/ lite devices . ie. * android tv, * micro linux, * possibly text based web browser for ascci and/or linux framebuffer * android go devices * android One devices

See more
Chose
Preact
over
React

Preact offers an API which is extremely similar to React's for less than 10% of its size (and createElement is renamed to h, which makes the overall bundle a lot smaller). Although it is less compatible with other libraries than the latter (and its ecosystem is nowhere as developed), this is generally not a problem as Preact exposes the preact/compat API, which can be used as an alias both for React and ReactDOM and allows for the use of libraries which would otherwise just be compatible with React.

See more
Get Advice from developers at your company using Private StackShare. Sign up for Private StackShare.
Learn More
Pros of Preact
Pros of Svelte
  • 13
    Lightweight
  • 4
    Drop-in replacement for React
  • 3
    Props/state passed to render
  • 3
    Performance
  • 1
    ES6 class components
  • 41
    Performance
  • 32
    Reactivity
  • 29
    Javascript compiler (do that browsers don't have to)
  • 29
    Components
  • 28
    Simplicity
  • 26
    Lightweight
  • 24
    Real Reactivity
  • 23
    Fast as vanilajs
  • 22
    Near to no learning curve
  • 16
    Compiler based
  • 16
    All in one
  • 15
    Scalable
  • 15
    Use existing js libraries
  • 13
    SSR
  • 13
    Very easy for beginners
  • 12
    Composable
  • 11
    Ease of use
  • 11
    No runtime overhead
  • 9
    Built in store
  • 7
    Typescript
  • 6
    Start with pure html + css
  • 6
    Best Developer Experience
  • 5
    Templates
  • 3
    Speed

Sign up to add or upvote prosMake informed product decisions

Cons of Preact
Cons of Svelte
    Be the first to leave a con
    • 2
      Complex
    • 2
      Learning Curve
    • 2
      Hard to learn
    • 2
      Event Listener Overload
    • 1
      Little to no libraries

    Sign up to add or upvote consMake informed product decisions

    What is Preact?

    Preact is an attempt to recreate the core value proposition of React (or similar libraries like Mithril) using as little code as possible, with first-class support for ES2015. Currently the library is around 3kb (minified & gzipped).

    What is Svelte?

    If you've ever built a JavaScript application, the chances are you've encountered – or at least heard of – frameworks like React, Angular, Vue and Ractive. Like Svelte, these tools all share a goal of making it easy to build slick interactive user interfaces. Rather than interpreting your application code at run time, your app is converted into ideal JavaScript at build time. That means you don't pay the performance cost of the framework's abstractions, or incur a penalty when your app first loads.

    Need advice about which tool to choose?Ask the StackShare community!

    What companies use Preact?
    What companies use Svelte?
    See which teams inside your own company are using Preact or Svelte.
    Sign up for Private StackShareLearn More

    Sign up to get full access to all the companiesMake informed product decisions

    What tools integrate with Preact?
    What tools integrate with Svelte?

    Sign up to get full access to all the tool integrationsMake informed product decisions

    Blog Posts

    +12
    5
    3470
    What are some alternatives to Preact and Svelte?
    React
    Lots of people use React as the V in MVC. Since React makes no assumptions about the rest of your technology stack, it's easy to try it out on a small feature in an existing project.
    Inferno
    Inferno is an isomorphic library for building high-performance user interfaces, which is crucial when targeting mobile devices. Unlike typical virtual DOM libraries like React, Mithril, Virtual-dom, Snabbdom and Om, Inferno uses techniques to separate static and dynamic content. This allows Inferno to only "diff" renders that have dynamic values.
    Glimmer
    Glimmer is one of the fastest DOM rendering engines, delivering exceptional performance for initial renders as well as updates.
    Mithril
    Mithril is around 12kb gzipped thanks to its small, focused, API. It provides a templating engine with a virtual DOM diff implementation for performant rendering, utilities for high-level modelling via functional composition, as well as support for routing and componentization.
    act
    Rather than having to commit/push every time you want test out the changes you are making to your .github/workflows/ files (or for any changes to embedded GitHub actions), you can use this tool to run the actions locally. The environment variables and filesystem are all configured to match what GitHub provides.
    See all alternatives