Using Hotwire Turbo in Rails with legacy JavaScript

• turbo

  145 6,399 8.8 JavaScript

  The speed of a single-page web application without having to write any JavaScript (by hotwired)

  

The most important one is the data-turbo="false" attribute in the tag. It tells Turbo to ignore all links and forms on the page and leave them for standard processing by the browser. When Turbo decides whether it should handle a link click or form submit, it searches the target element and all its parents for the data-turbo attribute and if it finds a "false" value, it just backs off. This tree traversal is a great feature that will later allow us to selectively switch Turbo on, see below.

• prototype-rails

  1 55 0.0 Ruby

  Add RJS, Prototype, and Scriptaculous helpers to Rails 3.1+ apps

  

there was the Prototype library since who knows when but it was phased out gradually (~2010),

• WorkOS

  workos.com sponsored

  The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

  

• prototype_legacy_helper

  1 61 0.0 Ruby

  Discontinued WARNING: this repo is not maintained anymore, if you want to maintain it, please send an mail to rails-core

  

there was the Prototype library since who knows when but it was phased out gradually (~2010),

• jquery-rails

  2 948 2.4 Ruby

  A gem to automate using jQuery with Rails

  

and in Rails 3.1, it was replaced by jQuery (~2011),

• ruby-coffee-script

  1 28 0.0 Ruby

  Ruby CoffeeScript Compiler

  

CoffeeScript, although still soft-supported via a gem, is discouraged in favor of vanilla ES6 JavaScript or Typescript compiled via webpack (~2018),

• jquery-ujs

  1 2,610 0.0 JavaScript

  Ruby on Rails unobtrusive scripting adapter for jQuery

  

there was Unobtrusive JavaScript to replace the inline style; it was pushed further by the jquery-ujs library (~2010), later superseded by the somewhat compatible Rails UJS (2016),

• Ruby on Rails

  467 54,865 10.0 Ruby

  Ruby on Rails

  

If you used to render links with non-GET methods or ”AJAXified“ links with a remote: true attribute, you need to know that these won’t work any more inside Turbo-enabled contexts. These functions are handled by Rails UJS and are not compatible with Turbo. Non-GET links should be converted to inline forms using button_to and remote links should be refactored to normal links handled by Turbo.

• InfluxDB

  www.influxdata.com sponsored

  Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  

• Turbolinks

  27 12,722 0.9 TypeScript

  Discontinued Turbolinks makes navigating your web application faster

  

since Rails 4, the Turbolinks library has been included but had a bunch of problems at that time (2013), so

• turbolinks-classic

  2 3,581 0.0 CoffeeScript

  Discontinued Classic version of Turbolinks. Now deprecated in favor of Turbolinks 5.

  

Rails 5 came with a major and largely incompatible rewrite of Turbolinks (Turbolinks 5), the previous versions of which were renamed to Turbolinks Classic (2016),

• Webpacker

  54 5,311 4.6 Ruby

  Use Webpack to manage app-like JavaScript modules in Rails

  

Rails 5.1 optionally adopted the webpack bundler and the yarn package manager (2017), the two became the preferred way of handling JavaScript in Rails,

• berry

  181 7,112 9.3 TypeScript

  📦🐈 Active development trunk for Yarn ⚒

  

Rails 5.1 optionally adopted the webpack bundler and the yarn package manager (2017), the two became the preferred way of handling JavaScript in Rails,

• sprockets

  4 925 4.9 Ruby

  Rack-based asset packaging system (by rails)

  

after being in beta for 3 years, Sprockets 4 was released, with support for ES6 and source maps in the asset pipeline (2019), to serve people still hesitant with webpack,

• webpack

  330 64,160 9.8 JavaScript

  A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows for loading parts of the application on demand. Through "loaders", modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff.

  

Rails 5.1 optionally adopted the webpack bundler and the yarn package manager (2017), the two became the preferred way of handling JavaScript in Rails,

• turbo-rails

  48 1,970 8.5 JavaScript

  Use Turbo in your Ruby on Rails app

  

We won’t go into much detail here, the official procedure just worked for us. If you’re still using the Asset Pipeline for your JavaScript files, make sure it supports ES6 syntax (i.e., you’ll need to upgrade to Sprockets 4). You also need a recent-enough Rails version (Rails 6, it seems). Otherwise, all should be good.

• Stimulus

  111 12,444 6.8 TypeScript

  A modest JavaScript framework for the HTML you already have

  

And here comes Hotwire Turbo to change the situation again but this time with truly good promises. The reasoning for high hopes is simple: Turbo lets you create many of the reactive page patterns without having to write a single line of JavaScript. JavaScript is now pushed behind the scenes and the main focus, even for describing reactive behavior, is on HTML which is easy to author via Rails templates (or anything else). Custom JavaScript code, now preferably written as Stimulus JS controllers, becomes just an icing on the cake if you need some more special interactions with a page.

• SaaSHub

  www.saashub.com sponsored

  SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives

  

Suggest a related project