- Ember's frame rate graph shows improved frame rates for version 1.13.0. Ember's new rendering engine is fast as shown in this Ember with Glimmer video. The tests validate that with concrete numbers and indicate a 25% performance gain.
- When react moved from 0.5 to 0.8, there was a marked increase in performance as shown in the graph. I suspect there were due to the size reduction and upgrades in browserify and jstransform. The performance metrics have been more or less stable since then. Some good optimizations planned for 0.14, and I am hoping to see the graph show the differences too !!
- Testing all the Ionic components clearly shows that the web apps are much faster on Chrome on Android than a Cordova app, possibly due to the tax of using WebView.
- The tests for bootstrap shows how the project has evolved over time. It shows the cleanup that happened towards the 3.0 release and how the components matured towards the end of the 2.0 release.
The test infrastructure is simple to set up. Each framework has canonical web app or a set of components rendered on a web page as the target for testing. These target apps are available on github for react, ionic, ember and bootstrap with instructions on how to set up and run the tests. The metrics were collected using browser-perf and stored in a couchDB database and drawn as a graph using perfjankie.
Though js-perf like test cases that test that test the speed of an event loop exist, there may be significant differences between the event loops and when the browser actually draws a frame.
Help needed - I hope to cover more frameworks and versions, something like todoMVC for performance. If you would like to add something similar for your web framework, ping me and I would love to help. If you have any changes to the canonical app to make it more like a real world app, or additional test cases, please do send in a pull request to the github repositories, or leave a comment.