shakacode · AbanoubGhadban · Mar 10, 2025 · Mar 10, 2025
diff --git a/Gemfile.development_dependencies b/Gemfile.development_dependencies
@@ -5,13 +5,13 @@ git_source(:github) { |repo| "https://github.com/#{repo}.git" }
 
 ruby '3.3.0'
 
-gem "react_on_rails", "15.0.0.alpha.2" # keep in sync with package.json files
+gem "react_on_rails", github: "shakacode/react_on_rails", branch: "abanoubghadban/pro521-add-support-for-async-scripts-in-the-view" # keep in sync with package.json files
 
 # For local development
 # Add the following line to the Gemfile.local file
 # gem "react_on_rails", path: "../react_on_rails"
 
-gem "shakapacker", "8.0.0"
+gem "shakapacker", github: "shakacode/shakapacker", branch: "abanoubghadban/pro521-add-support-for-async-scripts-in-the-view"
 gem "bootsnap", require: false
 gem "rails", "~> 7.1"
 gem "puma", "~> 6"

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -6,6 +6,30 @@ GIT
       byebug (~> 11.0)
       pry (>= 0.13, < 0.15)
 
+GIT
+  remote: https://github.com/shakacode/react_on_rails.git
+  revision: 353f7251a2ef8a551c0445986b9abc1995dd4805
+  branch: abanoubghadban/pro521-add-support-for-async-scripts-in-the-view
+  specs:
+    react_on_rails (15.0.0.alpha.2)
+      addressable
+      connection_pool
+      execjs (~> 2.5)
+      rails (>= 5.2)
+      rainbow (~> 3.0)
+
+GIT
+  remote: https://github.com/shakacode/shakapacker.git
+  revision: 01462be63865356d9e3127e9f7422ae4348f7b5c
+  branch: abanoubghadban/pro521-add-support-for-async-scripts-in-the-view
+  specs:
+    shakapacker (8.1.0)
+      activesupport (>= 5.2)
+      package_json
+      rack-proxy (>= 0.6.1)
+      railties (>= 5.2)
+      semantic_range (>= 2.3.0)
+
 PATH
   remote: .
   specs:
@@ -284,12 +308,6 @@ GEM
       ffi (~> 1.0)
     rdoc (6.12.0)
       psych (>= 4.0.0)
-    react_on_rails (15.0.0.alpha.2)
-      addressable
-      connection_pool
-      execjs (~> 2.5)
-      rails (>= 5.2)
-      rainbow (~> 3.0)
     regexp_parser (2.9.2)
     reline (0.6.0)
       io-console (~> 0.5)
@@ -359,14 +377,8 @@ GEM
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 3.0)
       websocket (~> 1.0)
-    semantic_range (3.0.0)
+    semantic_range (3.1.0)
     sexp_processor (4.17.1)
-    shakapacker (8.0.0)
-      activesupport (>= 5.2)
-      package_json
-      rack-proxy (>= 0.6.1)
-      railties (>= 5.2)
-      semantic_range (>= 2.3.0)
     simplecov (0.16.1)
       docile (~> 1.1)
       json (>= 1.8, < 3)
@@ -462,7 +474,7 @@ DEPENDENCIES
   pry-theme
   puma (~> 6)
   rails (~> 7.1)
-  react_on_rails (= 15.0.0.alpha.2)
+  react_on_rails!
   react_on_rails_pro!
   rspec-rails
   rspec-retry
@@ -473,7 +485,7 @@ DEPENDENCIES
   sass-rails
   scss_lint
   selenium-webdriver (= 4.9.0)
-  shakapacker (= 8.0.0)
+  shakapacker!
   spring
   spring-watcher-listen
   sprockets

diff --git a/docs/selective-hydration-in-streamed-components.md b/docs/selective-hydration-in-streamed-components.md
@@ -55,12 +55,12 @@ This happens because React on Rails by default adds the scripts that hydrate com
 
 This default behavior was kept for backward compatibility, as there were previously race conditions that could occur when using `async` scripts before the page fully loaded. However, these race conditions have been fixed in the latest React on Rails release.
 
-To enable true selective hydration, we need to configure React on Rails to load scripts as `async` scripts by adding `defer_generated_component_packs: false` to the React on Rails initializer:
+To enable true selective hydration, we need to ensure React on Rails loads scripts as `async` scripts by setting `generated_component_packs_loading_strategy` to `async` (setting it to `sync` will work as well but with lower performance). Check the [React on Rails v15.0.0 release notes](https://github.com/shakacode/react_on_rails/blob/master/docs/release-notes/15.0.0.md#enhanced-script-loading-strategies) for more details about its default behavior and how to set it to `async`.
 
 ```ruby
 # config/initializers/react_on_rails.rb
 ReactOnRails.configure do |config|
-  config.defer_generated_component_packs = false
+  config.generated_component_packs_loading_strategy = :async
 end
 ```
 

diff --git a/spec/dummy/Gemfile.lock b/spec/dummy/Gemfile.lock
@@ -6,6 +6,30 @@ GIT
       byebug (~> 11.0)
       pry (>= 0.13, < 0.15)
 
+GIT
+  remote: https://github.com/shakacode/react_on_rails.git
+  revision: 353f7251a2ef8a551c0445986b9abc1995dd4805
+  branch: abanoubghadban/pro521-add-support-for-async-scripts-in-the-view
+  specs:
+    react_on_rails (15.0.0.alpha.2)
+      addressable
+      connection_pool
+      execjs (~> 2.5)
+      rails (>= 5.2)
+      rainbow (~> 3.0)
+
+GIT
+  remote: https://github.com/shakacode/shakapacker.git
+  revision: 01462be63865356d9e3127e9f7422ae4348f7b5c
+  branch: abanoubghadban/pro521-add-support-for-async-scripts-in-the-view
+  specs:
+    shakapacker (8.1.0)
+      activesupport (>= 5.2)
+      package_json
+      rack-proxy (>= 0.6.1)
+      railties (>= 5.2)
+      semantic_range (>= 2.3.0)
+
 PATH
   remote: ../..
   specs:
@@ -312,12 +336,6 @@ GEM
       ffi (~> 1.0)
     rdoc (6.12.0)
       psych (>= 4.0.0)
-    react_on_rails (15.0.0.alpha.2)
-      addressable
-      connection_pool
-      execjs (~> 2.5)
-      rails (>= 5.2)
-      rainbow (~> 3.0)
     regexp_parser (2.9.2)
     reline (0.6.0)
       io-console (~> 0.5)
@@ -387,14 +405,8 @@ GEM
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 3.0)
       websocket (~> 1.0)
-    semantic_range (3.0.0)
+    semantic_range (3.1.0)
     sexp_processor (4.17.1)
-    shakapacker (8.0.0)
-      activesupport (>= 5.2)
-      package_json
-      rack-proxy (>= 0.6.1)
-      railties (>= 5.2)
-      semantic_range (>= 2.3.0)
     simplecov (0.16.1)
       docile (~> 1.1)
       json (>= 1.8, < 3)
@@ -509,7 +521,7 @@ DEPENDENCIES
   pry-theme
   puma (~> 6)
   rails (~> 7.1)
-  react_on_rails (= 15.0.0.alpha.2)
+  react_on_rails!
   react_on_rails_pro!
   rspec-rails
   rspec-retry
@@ -520,7 +532,7 @@ DEPENDENCIES
   sass-rails
   scss_lint
   selenium-webdriver (= 4.9.0)
-  shakapacker (= 8.0.0)
+  shakapacker!
   spring
   spring-watcher-listen
   sprockets

diff --git a/spec/dummy/config/initializers/react_on_rails.rb b/spec/dummy/config/initializers/react_on_rails.rb
@@ -39,5 +39,4 @@ def self.adjust_props_for_client_side_hydration(_component_name, props)
 
   config.auto_load_bundle = true
   config.components_subdirectory = "ror-auto-load-components"
-  config.defer_generated_component_packs = false
 end
diff --git a/spec/dummy/package.json b/spec/dummy/package.json
@@ -62,7 +62,7 @@
     "sass": "^1.43.4",
     "sass-loader": "^12.3.0",
     "sass-resources-loader": "^2.0.0",
-    "shakapacker": "8.0.0",
+    "shakapacker": "8.1.0",
     "style-loader": "^3.3.1",
     "tailwindcss": "^3.2.7",
     "terser-webpack-plugin": "5",

diff --git a/spec/dummy/yarn.lock b/spec/dummy/yarn.lock
@@ -6116,10 +6116,10 @@ sha.js@^2.4.0, sha.js@^2.4.8:
     inherits "^2.0.1"
     safe-buffer "^5.0.1"
 
-shakapacker@8.0.0:
-  version "8.0.0"
-  resolved "https://registry.yarnpkg.com/shakapacker/-/shakapacker-8.0.0.tgz#f29537c19078af7318758c92e7a1bca4cee96bdd"
-  integrity sha512-HCdpITzIKXzGEyUWQhKzPbpwwOsgTamaPH+0kXdhM59VQxZ3NWnT5cL3DlJdAT3sGsWCJskEl3eMkQlnh9DjhA==
+shakapacker@8.1.0:
+  version "8.1.0"
+  resolved "https://registry.yarnpkg.com/shakapacker/-/shakapacker-8.1.0.tgz#cb9f318f70cd59a99d3a46dda478aede657034c2"
+  integrity sha512-2OCl9KoKraW7CbUUfcEmTt/hK7IfOJx2h6LwsqEUUMsCcMWv3aFpZPjp5B74VdJxIqTgZo/8XVYKI0mj+itnxA==
   dependencies:
     js-yaml "^4.1.0"
     path-complete-extname "^1.0.0"