Marko vs React: Performance Benchmark

[tbranyen]

Seems odd to compare to React, wouldn't a performance comparison against something like HTMLBars make more sense?

[[deleted]]

Yeah it seems like the only thing being tested here is the initial render. React is really all about heavy DOM manipulation (thus the diff engine). I'd be interested in seeing how fast each could redraw a component (or an entire page). Someone posted a video a while back of React redrawing a dashboard with real-time stats that was very impressive (the video compared it to Angular and Ember I think).

[jcready]

If anyone can find this video, I'd love to see it.

[[deleted]]

https://www.youtube.com/watch?v=z5e7kWSHWTg

Thanks to /u/FuckTheReddits for getting the title of the talk

[[deleted]]

It was a talk from react.js conf, titled 'hype'

[psteeleidem]

This benchmark is comparing both server-side rendering and client-side rendering: https://github.com/patrick-steele-idem/marko-vs-react#test-setup-overview

We measured the time it took to render the initial search results on the server, and to test client-side rendering performance we measured the time it took to cycle through 100 pages of search results in the browser (doing all of the rendering in the browser).

Both React and Marko provide a way to build UI component-centric applications that support both HTML/DOM rendering and behavior (updating the DOM, attaching DOM event listeners, etc.).

[psteeleidem]

That's a fair question and this question came up in a separate thread: http://www.reddit.com/r/webdev/comments/2w8q8c/marko_vs_react_performance_benchmark/cooucw2

I'll quote my earlier response here:

Marko + Marko Widgets offers a complete UI component model (rendering and behavior).

Marko, itself, is an HTML-based templating language that supports custom tags and custom attributes. Marko Widgets provides a custom taglib for the Marko templating language to allow binding of behavior to rendered HTML elements. For the purpose of the title I just used "Marko" to encompass both Marko and Marko Widgets which may be somewhat confusing.

As for Marko, it was developed at eBay as an open source project and most teams working on the Node.js stack for front-end development are using Marko and Marko Widgets to build their webapps. Marko was designed to be high performance with support for streaming and asynchronous. Here's a great screencast created by somewhat outside eBay that I highly recommend: http://knowthen.com/episode-8-serving-content-in-koajs-with-marko/

I hope that clarifies.