Announcing the v0.17 release of Yew!

Published on July 4, 2020 by Justin Starry
Admin

The latest release significantly improves the performance of Yew!

Performance hasn't historically been a priority but Yew has grown a lot and developers are creating more complex apps that are revealing areas for improvement. Also, the popular JS framework benchmark repo https://github.com/krausest/js-framework-benchmark is referred to quite often and so we finally invested some time into improving Yew's standing.

When setting out to improve performance, we believed that Yew was getting slowed down by making too many calls from WebAssembly to JavaScript while rendering. It turns out that cutting these calls by more than half improved performance a bit but didn't make a serious impact. The main issue with performance was in Yew's rendering scheduler. In the latest release, Yew batches together DOM updates so that they are all done in quick succession which allows browsers to optimize performance. Before this release, Yew wouldn't batch updates and would therefore leave just enough time in between DOM updates such that the browser would re-paint the screen hundreds of times per second during benchmarks. We're happy this issue was tracked down and patched up!

Related to performance, developers can now use Keys to tell Yew when an element or component has moved within a list. Without Keys, reordering a list of components will force Yew to re-render each component. When Yew receives Keys however, it will instead move components in the DOM and skip re-rendering altogether.

Finally, this release is packed full of API improvements, small bug fixes, and neat features like dynamic tag names. Read more here: https://github.com/yewstack/yew/releases/tag/0.17.0