I've been spending some hours researching which of three gems will be the best fit for our Rails/React needs. We run a few Rails sites, all of which use React pretty heavily. Usually I presume the best solution is whichever project has the most stars, but in the case of these three, stars alone haven't made it abundantly clear which project will be best. Our main needs/wants:


  • HMR that Just Works, with an example case to prove it. Strong preference for boilerplate-free solutions.

  • Means by which to mount components that are loaded after initial page load (without re-loading previous components and etc)

  • (Prefer) Easy path by which to server-side render component for possible SEO and page speed benefits

  • (Prefer) Sufficiently unambiguous name to easily Google results. Dunno why open source projects often seem to have such a hard time with this.

  • (Maybe) Testing framework


Below is my assessment of the benefits of various contenders.


You can also see the founders of webpacker-react and react_on_rails discussing their perception of the differences here.


linkrenchap/webpacker-react

  • Smallest project, only a couple hundred stars. 14 issues, 70 commits

  • Still labels itself "beta" though its last commit was July 2019

  • Small size advantage

  • Documentation disadvantage

  • Doesn't use packs/application.js (presumably because components are registered directly)


linkreactjs/react-rails

  • Largest project, about 6k stars. 83 issues, 1131 commits

  • Signature feature: allowing React components in Sprockets pipeline (no thanks)

  • This "signature feature" serves to muddy the waters considerably when it comes to Googling documentation on how to connect components and application.js, which is defined both in sprockets (gets some react includes added) and in webpacker (has three lines without documentation)

  • Allows server-side rendering

  • Documentation pretty lacking after first page. Have spent several hours Googling for what would seem to be easy problems. Has been far from a "just works" solution for a complex page with many components, some of which load via xhr

  • Seemingly no example apps that use packages aside from App.js


linkshakacode/react-on-rails

  • Middle project, about 5k stars, 19 issues, 1600 commits

  • Supported by donations from users, memberships aggressively sold (by open source standards) but it doesn't go the Sidekiq route of making payment mandatory for distribution

  • Getting component to load after xhr can be done but takes some heavy lifting to fix it as well as react-rails mountComponents method

  • Explicitly register components via ReactOnRails.register({ HelloWorld }); by default, this implies that one needs to create a caller that has a full list of every component that will be used in the course of rendering a page, which doesn't lend itself to large sites with many components on a page

  • Doesn't use packs/application.js (presumably because components are registered directly)

  • Level of Googling the gem: moderate. "React on Rails" is difficult for Google to disambiguate from the more popular react-rails, so I've found myself mostly Googling "shaka react rails [query]" which has worked OK





The content above is from a note published by an Amplenote subscriber. As updates to the note are made, they are reflected here in real time.   Learn how to embed notes anywhere keyboard_arrow_right