Performance test with Angular 5, vue and react

I found article the other day with a interesting performance test. So I thought let’s port the Angular app to Aurelia an see how it performs.
My target was not to think about performance when implementing the test code in Aurelia. Maybe there are better ways to do that.

See the comments section for the Aurelia repository link in the article.

1 Like

In the article… the same scenario is implemented in react, vue and angular 5
results differ from 900ms for angular to 1800ms for react with vue in the middle at 1200ms

Comments suggest that angular was optimized to use not default strategy. Hence all comparison is scewed towards “winner”

No reason not to optimise for performance… better to win and get all the… “ahh… you only won, cos you used the framework right way…” comments
If you don’t win - there won’t be comments at all (-:
Right response would be - ok… optimize yours and come back (-:

@dweber019 please share what you will come up with before going to “war” (-:
Maybe we could improve it (-:

1 Like

@dweber019 please share what you will come up with before going to “war” (-:
Maybe we could improve it (-:

Lol these perf thing can easily send war invitation, maybe we better avoid. Things Aurelia users can be guaranteed is 99% (magic number) of cases will run smoothly and efficiently.

Who cares?
Percieved performance wins (-:
Not being present in those comparisons reduces developers choices…
If Aurelias perf is on par - it should be represented. IMO

Thanks for the feedback.

I personally think there should be a healthy competition and Aurelia did a awesome job to keep up with the “big” players.

Lol these perf thing can easily send war invitation, maybe we better avoid.

If someone like to start a “war”, he can go for it but I don’t care ;). My traget was to prove my self and maybe others that Aurelia can compete with other frameworks. In the end if a developer searches for perfs and sees this article and was not sure about taking Aurelia, he will hopefully be strengthen in his decision.

Fun fact:
I created a branch “performance-improvments”. I could bring the benchmark down to ~620ms.
So I wanted to add one more improvement which I do a lot in my project regarding getters. Adding “computedFrom”. Sadly this change increased the result ~180ms and something strange occurred to the rendering (green) and painting (violet) time line.

With computedFrom:
Imgur

Without computedFrom:
Imgur

The overall consumption of painting and rendering without computedFrom were way better.

@Alexander-Taran do you have any idea why?

1 Like

@dweber019,
My straight forward realization was heavy on Layout calculations somehow. I guess I did not transfer all the code from react one right. Test was runing for 1800ms
changing all table tags to divs td/th/tr/ etc brought time elapsed to 523ms

can you share your implementation?

I’ve made a repo with aurelia implementation (port from angular variant)

Here is live demo
http://utro.snipers.ru/

I very much need some foolprofing and optimisation hints.
As it is now on my machine it is more than 4 times faster then react.

Either I missed something or…

@dweber019 can you compare with your edition? the timings

1 Like

1 Like

I think the react test is somewhat dev, the bundle isn’t minified, but its run with the instructions on de repo.
ps: angular -> 848 and vue -> 907

did you run them like that with dev tools covering half the calendar?
I’ve noticed that for some of them - they run faster when calendar does not fit the window.

on my machine:
react 4000ms
vue 2500ms
angular 1500ms
aurelia 650ms

so basically there is a lot of overhead in those… The faster the machine the less visible is the difference…
I think I need a new rig though (-:

2 Likes

No not covered by the dev tool, and all results are the second run.
Now I would like to test with an low end device…