Why is preacts performance now worse or the same as reacts?

[ps73]

Will preact eventually deliver significantly better performance than react again?

[marvinhagemeister]

The numbers are not representative. The last time we looked at them, the benchmarks for Preact were made intentionally worse compared to React by using lots of unnecessary closures and other things which greatly affect results. The source code for React with hooks and Preact with hooks should look the exact same, but for some reason they decided against that 🤷

So yeah take any result on the krausebenchmark table with a grain of salt. It's too easy to skew the numbers in benchmarks in favor of a particular entry. They are not representative of Preact's or other framework's real world performance for that matter.

[rschristian]

Just to add: there's also a group of people who spend quite a bit of time in that repo tweaking their framework's bench setup to try to find the optimal source code config.

This isn't necessarily a bad thing, optimizing the hell out of some source benchmark code is an impressive skill in its own right and the repo owner is clearly okay with this, but it does start to get further away from a real world test (if you could ever call a micro-benchmarking suite "real world" to begin with) and into the territory of optimizing the benchmark, rather than the framework's, performance.

[squidfunk]

We should really stop fighting over benchmarks and start building useful software.

[adaptive-shield-matrix]

@squidfunk
Benchmarks are a very important tool for developers to make technical technological decisions.
If something is only 1-5% slower/faster then it is as you say (as is the case here, in rendering performance).
If it is 2x faster then it is a very big improvement even for the user experience and worth investigating further.

In the bechmarks React seems to have a much worse

• startup time (30-50% depending how you count) and
• much higher memory consumption (50-70% depending how you count)

@marvinhagemeister
Could you please point out the line of code that was made worse?
I'm new to preact and do not see how the code was made intentionally worse
https://github.com/krausest/js-framework-benchmark/blob/master/frameworks/keyed/preact-hooks/src/main.jsx

In comparison, the react code seems more optimized to me, with the usage of createMemo for each row.
https://github.com/krausest/js-framework-benchmark/blob/master/frameworks/keyed/preact-hooks/src/main.jsx

That may be the reason react uses more than 0.6 times more/additional memory, so its more like a speed-memory trade-off?

[sekoyo]

What I'm surprised about is that Preact with signals is barely better than React with hooks

[marvinhagemeister]

@sekoyo The benchmarks don't contain any test case where signals would shine, like deep tree updates. Those are very common in actual real world apps. If they would add a test case for that it would show that signals are significantly faster.