7 thoughts on “Example comparisons of hyperHTML with other frameworks.”
I do like the expressivity of hyperHTML, which is a viable alternative to JSX. However, if I’m not mistaken, viperHTML does not implement a virtual or shadow DOM so comparisons with these other UI libraries seems somewhat superficial without considering the performance advantages they offer.
Yes this is explicitly not shadow dom systems. The only point of comparison is raw speed, frames per second etc. From the benchmarks I’ve seen this is one of the fastest.
Virtual doms are relatively complex systems which have overhead in terms of memory and initial parsing of the dom tree. hyperHTML just uses Es6 template strings and achieves comparable performance without any of that overhead.
viperHTML is the server side rendering version of hyperHTML. There’s also another one for targeting native (similar to React Native).
I’d certainly expect good performance from viperHTML for simple, relatively static content, but I’d be interested to see comparisons for rendering more dynamic content. Of course, the significance of the performance advantage depends upon the application and trade-offs for complexity, etc. Do you happen to have a link to benchmark tests John Hardy Turnbull delenda est?
Thanks. I searched and found a comparable benchmark for React and Mithril (links below) and ran each in a separate tab among a dozen open in Chrome. Test results: Mithril 21 FPS, React 15 FPS, viperHTML 9 FPS; with significantly greater CPU utilization for the latter.
Mithril is nice. DOM operations are computationally expensive; any rendering library that doesn’t use some virtual or shadow DOM technology will not be as fast as one that does, all else being equal. BTW, Mithril does have its own hyperHTML implementation and other implementations are available to use in place of JSX in React or to generate HTML for Angular, etc.
I do like the expressivity of hyperHTML, which is a viable alternative to JSX. However, if I’m not mistaken, viperHTML does not implement a virtual or shadow DOM so comparisons with these other UI libraries seems somewhat superficial without considering the performance advantages they offer.
LikeLike
Yes this is explicitly not shadow dom systems. The only point of comparison is raw speed, frames per second etc. From the benchmarks I’ve seen this is one of the fastest.
Virtual doms are relatively complex systems which have overhead in terms of memory and initial parsing of the dom tree. hyperHTML just uses Es6 template strings and achieves comparable performance without any of that overhead.
viperHTML is the server side rendering version of hyperHTML. There’s also another one for targeting native (similar to React Native).
LikeLike
I’d certainly expect good performance from viperHTML for simple, relatively static content, but I’d be interested to see comparisons for rendering more dynamic content. Of course, the significance of the performance advantage depends upon the application and trade-offs for complexity, etc. Do you happen to have a link to benchmark tests John Hardy Turnbull delenda est?
LikeLike
I can’t find the benchmark comparison page I saw but here is a live version of it running dbmonster which is a test site used but many frameworks to demo speed. webreflection.github.io – You’re looking at hyperHTML version of DBMonster.
LikeLike
Thanks. I searched and found a comparable benchmark for React and Mithril (links below) and ran each in a separate tab among a dozen open in Chrome. Test results: Mithril 21 FPS, React 15 FPS, viperHTML 9 FPS; with significantly greater CPU utilization for the latter.
http://cdn.rawgit.com/lhorie/mithril.js/rewrite/examples/dbmonster/react/index.html
cdn.rawgit.com – dbmon (Mithril)
LikeLike
Interesting. Looks like more work still to do. Mithril keeps coming out fastest. I haven’t looked into it.
LikeLike
Mithril is nice. DOM operations are computationally expensive; any rendering library that doesn’t use some virtual or shadow DOM technology will not be as fast as one that does, all else being equal. BTW, Mithril does have its own hyperHTML implementation and other implementations are available to use in place of JSX in React or to generate HTML for Angular, etc.
LikeLike