This is a benchmark to test Imba against React and Svelte. This is obviously not an extensive benchmark, but just to illustrate a point: Imba is very fast! ... 9 times faster than React and Svelte.
How comes? Well, Imba uses a different technique called the memoized DOM Check out how it works. It would be interesting to see other libraries and frameworks adopt it since it's so effecient.
The benchmark is a very simple automated test that playwright runs for each framework.
The test is very simple: it just clicks 500 times on a button that increments 10k other buttons
await Promise.all(Array.from(Array(count).keys()).map(()=> page.locator(`data-testid=${target}-1`).click())); // target is replaced with each framework
await expect(button1).toHaveText(`${count + 1}`)
No tricks here ^^' Inspect the code, run it locally and optimize if you feel like it.
Results of running the benchmark can be seen here https://imba-benchmark.netlify.app/
Results are built on every push to main branch. And you can see the same results by inspecting github actions artifacts. Github actions machine is a bit more powerful than Netlify, so results are different but within the same range.
In the following manual test, I clicked 20 times on buttons of each respective "framework".
If you know a way to automate this profiling, create an issue or a PR. I'd love to include that instead.
Look at the scripting portion or even better, try the profiling in your browser:
- Imba: 147ms
- Svelte: 487ms
- React: 589ms