Arbre is a component based server side DOM rendering library written in Ruby. Arbre was extracted from Active Admin from 2011-2012 but has not gained widespread use elsewhere. As of September 2017 there were around 4M downloads to date from RubyGems and barely 450 stars on GitHub.
class Panel < Arbre::Component
builder_method :panel
def build(title, attributes = {})
super(attributes)
h3(title, class: "panel-title")
end
end
React is a component based isomorphic DOM rendering library written in Javascript. npm downloads have reached 40M in the past couple of years and the project has 75,000 stars on GitHub: it’s no contest really. If you prefer Ruby over ES6 an Opal wrapper is available as hyper-react .
class App < Hyperloop::Component
render(DIV) do
MainNavigation {}
PageContents {}
Footer {}
end
end
The APIs for both are relatively simple.
Arbre has builder_method to register components. Each component has a build method which adds tags to an Arbre::Context that is eventually output using to_s.
React components have a render method that adds elements to a virtual DOM that is synchronized with the browser DOM as needed.
The most obvious difference is that Arbre does not integrate Javascript event handlers: it uses an unobtrusive approach that leaves registering event handlers to accompanying ES6/Coffeescript/Opal files.
Being exclusively server-side means that Arbre can and has been used with ActionView helpers and templates. There are bugs but it mostly works. Arbre is relatively simple and provides what Active Admin needs without further dependencies.
React components are careful about maintaining state and re-render when state is changed. Arbre components get re-instantiated for each request and are more ad hoc.
Is anything to be learned from this comparison? The prospects of widespread adoption of Arbre are slim to none. An increasing number of developers are going to be looking to use a Rails admin framework with React, and that is where opportunity lies.