Skip to content

Add React on Rails Quick Start Example Application #1761

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 15 commits into
base: master
Choose a base branch
from
Open

Add React on Rails Quick Start Example Application #1761

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
4ca1e9f
Add Claude.md
justin808 Sep 4, 2025
b8044f3
Improve documentation: Add visual appeal, simplify structure, enhance UX
justin808 Sep 4, 2025
15bd1aa
Add React on Rails Quick Start example application
justin808 Sep 4, 2025
ae80f43
Add React on Rails Quick Start example application
justin808 Sep 4, 2025
031cc6f
Change performance image link in 15.0.0 release notes
justin808 Sep 2, 2025
da4481d
Update CHANGELOG for version 15.0.0
justin808 Sep 2, 2025
02dcaec
Update release notes for React on Rails 15.0.0
justin808 Sep 2, 2025
81dd3bf
Add early hydration performance comparison image and update link in u…
AbanoubGhadban Sep 2, 2025
43326ba
Update CHANGELOG with detailed migration instructions for breaking ch…
AbanoubGhadban Sep 3, 2025
06f52f5
Improve naming clarity in pageLifecycle.ts (#1762)
justin808 Sep 4, 2025
dc4a7f3
Fix PR review feedback: formatting, links, and markdown consistency
justin808 Sep 5, 2025
5b9f0f8
Add comprehensive documentation analysis and AI agent instructions
justin808 Sep 6, 2025
5e48745
Add test-apps directory to .gitignore
justin808 Sep 6, 2025
3cef885
Fix critical installation order in AI agent instructions
justin808 Sep 6, 2025
5bd5d20
Update Claude settings for git and test automation
justin808 Sep 6, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 33 additions & 0 deletions .claude/settings.local.json
View file
Open in desktop
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this file should not be in the repo. I'll remove in a separate commit.

Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
{
"permissions": {
"allow": [
"Bash(find:*)",
"Bash(git add:*)",
"Bash(git push:*)",
"Bash(rails new:*)",
"Bash(bundle:*)",
"Bash(rails:*)",
"Bash(git init:*)",
"Bash(git commit:*)",
"Bash(npm install:*)",
"Bash(bin/shakapacker:*)",
"Bash(git checkout:*)",
"WebFetch(domain:github.com)",
"Bash(yarn run lint)",
"Bash(yarn run prettier:*)",
"Bash(test:*)",
"Bash(rake lint)",
"Bash(yarn run:*)",
"WebFetch(domain:vite-ruby.netlify.app)",
"WebSearch",
"Bash(gem install:*)",
"Bash(gem search:*)",
"Bash(git reset:*)",
"Read(//Users/justin/shakacode/react-on-rails/**)",
"Bash(./bin/dev)",
"Bash(node:*)"
],
"deny": [],
"ask": []
}
}
3 changes: 3 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,3 +60,6 @@ yalc.lock

# Generated by ROR FS-based Registry
generated

# Test applications directory
/test-apps/
231 changes: 231 additions & 0 deletions AI_AGENT_INSTRUCTIONS.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,231 @@
# 🤖 AI Agent Instructions: React on Rails Setup

*Super concise, copy-paste instructions for AI agents to set up React on Rails in common scenarios.*

## 🔍 **Before Starting: Check Current Versions**

```bash
# Get latest available versions (recommended approach)
gem search react_on_rails --remote
gem search shakapacker --remote

# Or use specific versions from these commands in your Gemfile:
# Latest stable versions as of Jan 2025:
# react_on_rails ~> 15.0
# shakapacker ~> 8.3
```

**⚠️ Version Flexibility:** These instructions use `~> X.Y` which allows patch updates. Always check for latest versions before starting a new project.

## 🚨 **CRITICAL: Installation Order Matters**

**ALWAYS install Shakapacker FIRST, then React on Rails. Here's why:**

1. **React on Rails generator requires `package.json`** to add JavaScript dependencies
2. **Rails with `--skip-javascript` doesn't create `package.json`**
3. **Shakapacker creates `package.json`** and JavaScript tooling foundation
4. **Wrong order = "package.json not found" error**

**✅ Correct Order:**
```
Shakapacker → package.json created → React on Rails → success
```

**❌ Wrong Order:**
```
React on Rails → no package.json → ERROR: package.json not found
```

---

## 🆕 Scenario 1: New Rails App with React on Rails

```bash
# Create new Rails app
rails new myapp --skip-javascript --database=postgresql
cd myapp

# STEP 1: Add Shakapacker first (creates package.json)
echo 'gem "shakapacker", "~> 8.3"' >> Gemfile
bundle install
bundle exec rails shakapacker:install

# STEP 2: Add React on Rails (requires package.json to exist)
echo 'gem "react_on_rails", "~> 15.0"' >> Gemfile
bundle install
rails generate react_on_rails:install

# Start development servers
bin/dev
```
Comment on lines +43 to +60
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Include npm/yarn install before starting dev servers.

Generators add JS deps; without install, bin/dev often fails on a clean machine.

 rails generate react_on_rails:install
 
 # Start development servers
-bin/dev
+npm install # or: yarn install
+bin/dev
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
```bash
# Create new Rails app
rails new myapp --skip-javascript --database=postgresql
cd myapp
# STEP 1: Add Shakapacker first (creates package.json)
echo 'gem "shakapacker", "~> 8.3"' >> Gemfile
bundle install
bundle exec rails shakapacker:install
# STEP 2: Add React on Rails (requires package.json to exist)
echo 'gem "react_on_rails", "~> 15.0"' >> Gemfile
bundle install
rails generate react_on_rails:install
# Start development servers
bin/dev
```
rails generate react_on_rails:install
# Start development servers
npm install # or: yarn install
bin/dev
🤖 Prompt for AI Agents 
In AI_AGENT_INSTRUCTIONS.md around lines 43 to 60, the shell steps start the dev
server without installing JS dependencies produced by the generators; update the
sequence to run the JS package install after running shakapacker and
react_on_rails generators and before running bin/dev — e.g., run yarn install
(or npm install/pnpm install depending on project) right after the generators
complete so node_modules are present before starting the dev servers.


**✅ Success Check:** Visit `http://localhost:3000/hello_world` → Should see "Hello World" from React

**📁 Generated Files:**
- `app/javascript/bundles/HelloWorld/components/HelloWorld.jsx`
- `app/controllers/hello_world_controller.rb`
- `app/views/hello_world/index.html.erb`

---

## 🔄 Scenario 2: Add React on Rails to Existing Rails App

```bash
# Navigate to existing Rails app root
cd /path/to/existing/app

# STEP 1: Add Shakapacker first (creates package.json if missing)
echo 'gem "shakapacker", "~> 8.3"' >> Gemfile
bundle install

# Check if package.json exists, create if missing
if [ ! -f "package.json" ]; then
bundle exec rails shakapacker:install
fi

Comment on lines +77 to +85
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Always run Shakapacker install; don’t gate it solely on package.json.

Having package.json doesn’t guarantee Shakapacker configs/scripts were installed.

-# Check if package.json exists, create if missing
-if [ ! -f "package.json" ]; then
-  bundle exec rails shakapacker:install
-fi
+# Ensure Shakapacker is fully installed (idempotent)
+bundle exec rails shakapacker:install
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
# STEP 1: Add Shakapacker first (creates package.json if missing)
echo 'gem "shakapacker", "~> 8.3"' >> Gemfile
bundle install
# Check if package.json exists, create if missing
if [ ! -f "package.json" ]; then
bundle exec rails shakapacker:install
fi
# STEP 1: Add Shakapacker first (creates package.json if missing)
echo 'gem "shakapacker", "~> 8.3"' >> Gemfile
bundle install
# Ensure Shakapacker is fully installed (idempotent)
bundle exec rails shakapacker:install
🤖 Prompt for AI Agents 
In AI_AGENT_INSTRUCTIONS.md around lines 77–85, the script currently only runs
`bundle exec rails shakapacker:install` when package.json is missing, which can
skip installing Shakapacker artifacts even if package.json exists; remove the
conditional and invoke the shakapacker install unconditionally (or replace the
if-check with a more robust idempotent verification) so the install command
always runs after adding the gem, ensuring Shakapacker configs/scripts are
created or refreshed.

# STEP 2: Add React on Rails (requires package.json to exist)
echo 'gem "react_on_rails", "~> 15.0"' >> Gemfile
bundle install
rails generate react_on_rails:install --ignore-existing-files

Comment on lines +86 to +90
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Verification agent

🧩 Analysis chain

Verify generator flag support (--ignore-existing-files).

I’m not sure this flag exists for react_on_rails:install. If unsupported, the command will fail.

Run a quick check or update to a supported flag, e.g., remove it if unnecessary:

-rails generate react_on_rails:install --ignore-existing-files
+rails generate react_on_rails:install

🌐 Web query:

What are the supported options for `rails generate react_on_rails:install` in React on Rails 15.x?

💡 Result:

Supported generator options (rails generate react_on_rails:install) in React on Rails 15.x:

  • --redux / --no-redux (alias -R) — install Redux example and related gems. [1][2]
  • --server-rendering / --no-server-rendering (alias -S) — add server‑side rendering files/config. [2]
  • --skip-js-linters / --no-skip-js-linters (alias -j) — skip installing JS linting files. [2]
  • --ruby-linters / --no-ruby-linters (alias -L) — install Ruby linting files/tasks/configs. [2]
  • --heroku-deployment / --no-heroku-deployment (alias -H) — add files for Heroku deployment. [2]
  • --skip-bootstrap / --no-skip-bootstrap (alias -b) — skip Bootstrap integration. [2]
  • --ignore-warnings / --no-ignore-warnings — skip generator warnings. [1]
  • Common runtime flags: --force (-f), --pretend (-p), --quiet (-q), --skip (-s). [1][2]

Sources: React on Rails generator docs and package docs. [1] [2]

References
[1] Generator Details — React on Rails docs. (shakacode.gitbooks.io)
[2] react_on_rails generator options (package docs / npm). (npmjs.com)

Citations:

Drop unsupported --ignore-existing-files flag
The react_on_rails:install generator in React on Rails 15.x does not support --ignore-existing-files (use --ignore-warnings to suppress warnings). Update to:

-rails generate react_on_rails:install --ignore-existing-files
+rails generate react_on_rails:install
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
# STEP 2: Add React on Rails (requires package.json to exist)
echo 'gem "react_on_rails", "~> 15.0"' >> Gemfile
bundle install
rails generate react_on_rails:install --ignore-existing-files
# STEP 2: Add React on Rails (requires package.json to exist)
echo 'gem "react_on_rails", "~> 15.0"' >> Gemfile
bundle install
rails generate react_on_rails:install
🤖 Prompt for AI Agents 
In AI_AGENT_INSTRUCTIONS.md around lines 86 to 90, the react_on_rails install
command uses the unsupported --ignore-existing-files flag; replace that flag
with --ignore-warnings (or remove it) so the generator call works with React on
Rails 15.x and suppresses warnings if desired.

# Add React component to existing view
# Replace <view-name> with your actual view file
cat >> app/views/<view-name>/<action>.html.erb << 'EOF'

<%= react_component("HelloWorld", props: { name: "World" }) %>
EOF

# Start development
bin/dev
```

**⚠️ Pre-flight Checks:**
- Rails app has `bin/dev` or similar dev script
- Shakapacker will create `package.json` if it doesn't exist
- No existing React setup conflicts

**✅ Success Check:** React component renders in your chosen view

---

## ⚡ Scenario 3: Convert Vite-Ruby to React on Rails

```bash
# Navigate to app root
cd /path/to/vite/ruby/app

# Remove Vite-Ruby gems from Gemfile
sed -i.bak '/gem.*vite_rails/d' Gemfile
sed -i.bak '/gem.*vite_ruby/d' Gemfile

# Backup existing Vite config
mv vite.config.* vite.config.backup 2>/dev/null || true

# Remove Vite-specific files
rm -rf config/vite.json
rm -rf bin/vite*

# STEP 1: Add Shakapacker first (creates package.json)
echo 'gem "shakapacker", "~> 8.3"' >> Gemfile
bundle install
bundle exec rails shakapacker:install --force

# STEP 2: Add React on Rails (requires package.json to exist)
echo 'gem "react_on_rails", "~> 15.0"' >> Gemfile
bundle install
rails generate react_on_rails:install --force

# Migrate existing React components
# Move components from app/frontend/entrypoints/ to app/javascript/bundles/
mkdir -p app/javascript/bundles/Components
find app/frontend -name "*.jsx" -o -name "*.tsx" | while read file; do
basename=$(basename "$file")
cp "$file" "app/javascript/bundles/Components/$basename"
done

# Update component registrations in app/javascript/packs/hello-world-bundle.js
echo "// Register your existing components here"
echo "// import YourComponent from '../bundles/Components/YourComponent';"
echo "// ReactOnRails.register({ YourComponent });"

# Clean up old Vite files
rm -rf app/frontend
rm -rf public/vite*

# Update views to use React on Rails helpers
# Replace vite_javascript_tag with javascript_pack_tag
# Replace vite_stylesheet_tag with stylesheet_pack_tag

# Install dependencies
yarn install

# Start development
bin/dev
```
Comment on lines +111 to +164
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Fix find(1) OR precedence and restrict to files; standardize package install.

The find expression needs grouping; otherwise matches can be inconsistent. Also, prefer npm (or explicitly note yarn alternative) for consistency with the rest of the doc.

-find app/frontend -name "*.jsx" -o -name "*.tsx" | while read file; do
+find app/frontend \( -name "*.jsx" -o -name "*.tsx" \) -type f | while read file; do
     basename=$(basename "$file")
     cp "$file" "app/javascript/bundles/Components/$basename"
 done
@@
-# Install dependencies
-yarn install
+# Install dependencies
+npm install # or: yarn install
🤖 Prompt for AI Agents 
In AI_AGENT_INSTRUCTIONS.md around lines 111 to 164 the find command used to
copy JSX/TSX components lacks grouped OR precedence and doesn't restrict results
to files, which can yield unexpected matches; update the find invocation to
group the name tests and add -type f (e.g. use find app/frontend \( -name
"*.jsx" -o -name "*.tsx" \) -type f ...) and standardize the package manager
step by replacing the loose "yarn install" instruction with a single explicit
command (prefer npm install, or state "npm install (or yarn install if you
prefer)") so the doc is consistent.


**🔧 Manual Steps Required:**
1. **Update views**: Replace `vite_javascript_tag` with `javascript_pack_tag "hello-world-bundle"`
2. **Register components**: Add your components to `app/javascript/packs/hello-world-bundle.js`
3. **Update imports**: Change relative paths if needed

**✅ Success Check:**
- `bin/dev` starts without Vite errors
- React components render using `<%= react_component("YourComponent") %>`

---

## 🛠️ Common Troubleshooting Commands

```bash
# Check current versions and compatibility
bundle info react_on_rails shakapacker
rails --version
ruby --version
node --version

# Check React on Rails installation
rails runner "puts ReactOnRails::VERSION"

# Verify Shakapacker setup
bin/shakapacker --version

# Clear cache if components not updating
rm -rf tmp/cache public/packs
rails assets:clobber

# Check component registration
rails runner "puts ReactOnRails.configuration.components_subdirectory"

# Restart with clean build
pkill -f "bin/shakapacker-dev-server"
rm -rf public/packs-test
bin/dev
```

---

## 📋 Quick Reference

### Essential Files Structure
```
app/
├── controllers/hello_world_controller.rb
├── views/hello_world/index.html.erb
└── javascript/
├── bundles/HelloWorld/components/HelloWorld.jsx
└── packs/hello-world-bundle.js
```

### Key Commands
- **Development**: `bin/dev` (starts Rails + Shakapacker)
- **Generate**: `rails generate react_on_rails:install`
- **Component**: `<%= react_component("ComponentName", props: {}) %>`

### Version Requirements
- Rails 7+ (Rails 8 supported), Ruby 3.0+ (Ruby 3.2+ for Rails 8), Node 20+ LTS, Yarn
- react_on_rails ~> 15.0+, shakapacker ~> 8.3+
- **Note**: Use `bundle info react_on_rails` to check latest available version

---

*💡 **Pro Tip for AI Agents**: Always run `bin/dev` to test setup, and check browser console for any JavaScript errors.*
65 changes: 27 additions & 38 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,64 +23,53 @@ After a release, please make sure to run `bundle exec rake update_changelog`. Th

Changes since the last non-beta release.

#### Fixed

- Enable support for ReactRefreshWebpackPlugin v0.6.0 by adding conditional logic regarding configuration. [PR 1748](https://github.com/shakacode/react_on_rails/pull/1748) by [judahmeek](https://github.com/judahmeek).
### [15.0.0] - 2025-08-28

- Replace RenderOptions.renderRequestId and use local trackers instead. This change should only be relevant to ReactOnRails Pro users. [PR 1745](https://github.com/shakacode/react_on_rails/pull/1745) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
See [Release Notes](docs/release-notes/15.0.0.md) for full details.

- Fixed invalid warnings about non-exact versions when using a pre-release version of React on Rails, as well as missing warnings when using different pre-release versions of the gem and the Node package. [PR 1742](https://github.com/shakacode/react_on_rails/pull/1742) by [alexeyr-ci2](https://github.com/alexeyr-ci2).
### Removed (Breaking Changes)

### [15.0.0-rc.1] - 2025-06-18
- Deprecated `defer_generated_component_packs` configuration option. You should use `generated_component_packs_loading_strategy` instead.
- Migration:
- `defer_generated_component_packs: true` → `generated_component_packs_loading_strategy: :defer`
- `defer_generated_component_packs: false` → `generated_component_packs_loading_strategy: :sync`
- For best performance, use `generated_component_packs_loading_strategy: :async`
- [PR 1712](https://github.com/shakacode/react_on_rails/pull/1712) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
- The package is ESM-only now. Migration:
- If using `require('react-on-rails')`, upgrade to Node v20.19.0+ or change to `import`.
- For TypeScript errors, upgrade to TypeScript 5.8+ and set `module` to `nodenext`.
- `ReactOnRails.reactOnRailsPageLoaded` is now an async function. Migration:
- Add `await` when calling this function: `await ReactOnRails.reactOnRailsPageLoaded()`.
- `force_load` configuration now defaults to `true`. Migration:
- Set `force_load: false` in your config if you want the previous behavior.
Comment on lines +38 to +44
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Verification agent

🧩 Analysis chain

Double-check minimum Node and TypeScript versions before publishing

The stated floors (Node v20.19.0+, TypeScript 5.8+) may drift; ensure they match the package engines and actual build constraints.

🏁 Script executed:

#!/usr/bin/env bash
set -euo pipefail

echo "Check Node engines in node package:"
fd package.json node_package -d 2 | xargs -I{} jq -r '.engines // {}' {}

echo "Scan for use of 'nodenext' and TS min version hints:"
rg -n --type=ts --type=json -C2 'nodenext|typescript' node_package

echo "Verify reactOnRailsPageLoaded is async in the Node package:"
rg -nP -C2 'export\s+async\s+function\s+reactOnRailsPageLoaded|\basync function reactOnRailsPageLoaded' node_package

echo "Verify force_load default is true on the Ruby side:"
rg -nP -C3 '\bforce_load\b.*=\s*true|attr_(reader|accessor).*force_load' lib

echo "Release notes file present:"
fd '15.0.0.md' docs | sed -n '1p'

Length of output: 5569

🏁 Script executed:

#!/usr/bin/env bash
set -euo pipefail

# List all package.json files and inspect their engines field
echo "===== Engines in package.json files ====="
fd package.json -x sh -c 'echo "File: {}"; jq .engines {} 2>/dev/null || echo "  (no engines field)"'

# Check TypeScript devDependency versions in each package.json
echo
echo "===== TypeScript versions in devDependencies ====="
fd package.json -x sh -c 'echo "File: {}"; jq ".devDependencies.typescript" {} 2>/dev/null || echo "  (no typescript devDependency)"'

# Inspect tsconfig.json compilerOptions for module and moduleResolution settings
echo
echo "===== tsconfig.json module settings ====="
fd tsconfig.json -x sh -c 'echo "File: {}"; jq "{module: .compilerOptions.module, moduleResolution: .compilerOptions.moduleResolution}" {} 2>/dev/null'

Length of output: 2130

🏁 Script executed:

#!/usr/bin/env bash
set -euo pipefail

echo "===== tsconfig.json compilerOptions ====="
jq .compilerOptions tsconfig.json 2>/dev/null || echo "(failed to parse tsconfig.json)"

echo
echo "===== CI Node versions in GitHub Actions ====="
grep -R "node-version" -n .github/workflows || echo "(none found)"

echo
echo "===== .nvmrc or .node-version files ====="
fd .nvmrc -x sh -c 'echo "File: {}"; cat {}' || echo "(none found)"
fd .node-version -x sh -c 'echo "File: {}"; cat {}' || echo "(none found)"

Length of output: 1035

Align Node version in CHANGELOG with package.json engines

CHANGELOG.md specifies Node v20.19.0+ but package.json has no engines field; either add

"engines": { "node": ">=20.19.0" }

to package.json or update the CHANGELOG to “Node v20+” to match CI. TypeScript’s devDependency (^5.8.3) already satisfies TS 5.8+.

🤖 Prompt for AI Agents 
In CHANGELOG.md around lines 38 to 44, the Node version callout (Node v20.19.0+)
is inconsistent with package.json (no engines field); either add an engines
entry to package.json specifying "node": ">=20.19.0" to enforce the stated
minimum, or relax the CHANGELOG wording to "Node v20+" to match CI without
adding an engines constraint; update whichever file you choose and ensure
package.json devDependencies already satisfy TypeScript 5.8+.


#### Improved
For detailed migration instructions, see the [15.0.0 Release Notes](docs/release-notes/15.0.0.md).

- Ensured that the RSC payload is injected after the component's HTML markup to improve the performance of the RSC payload injection. [PR 1738](https://github.com/shakacode/react_on_rails/pull/1738) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
#### Fixed

### [15.0.0-rc.0] - 2025-06-16
- Enable support for ReactRefreshWebpackPlugin v0.6.0 by adding conditional logic regarding configuration. [PR 1748](https://github.com/shakacode/react_on_rails/pull/1748) by [judahmeek](https://github.com/judahmeek).
- Replace RenderOptions.renderRequestId and use local trackers instead. This change should only be relevant to ReactOnRails Pro users. [PR 1745](https://github.com/shakacode/react_on_rails/pull/1745) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
- Fixed invalid warnings about non-exact versions when using a pre-release version of React on Rails, as well as missing warnings when using different pre-release versions of the gem and the Node package. [PR 1742](https://github.com/shakacode/react_on_rails/pull/1742) by [alexeyr-ci2](https://github.com/alexeyr-ci2).

#### Improved

- Ensured that the RSC payload is injected after the component's HTML markup to improve the performance of the RSC payload injection. [PR 1738](https://github.com/shakacode/react_on_rails/pull/1738) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
- Improved RSC rendering flow by eliminating double rendering of server components and reducing the number of HTTP requests.
- Updated communication protocol between Node Renderer and Rails to version 2.0.0 which supports the ability to upload multiple bundles at once.
- Added `RSCRoute` component to enable seamless server-side rendering of React Server Components. This component automatically handles RSC payload injection and hydration, allowing server components to be rendered directly within client components while maintaining optimal performance.

[PR 1696](https://github.com/shakacode/react_on_rails/pull/1696) by [AbanoubGhadban](https://github.com/AbanoubGhadban).

#### Added

- Configuration option `generated_component_packs_loading_strategy` to control how generated component packs are loaded. It supports `sync`, `async`, and `defer` strategies. [PR 1712](https://github.com/shakacode/react_on_rails/pull/1712) by [AbanoubGhadban](https://github.com/AbanoubGhadban).

- Support for returning React component from async render-function. [PR 1720](https://github.com/shakacode/react_on_rails/pull/1720) by [AbanoubGhadban](https://github.com/AbanoubGhadban).

### Removed (Breaking Changes)

- Deprecated `defer_generated_component_packs` configuration option. You should use `generated_component_packs_loading_strategy` instead. [PR 1712](https://github.com/shakacode/react_on_rails/pull/1712) by [AbanoubGhadban](https://github.com/AbanoubGhadban).

### Changed

- **Breaking change**: The package is ESM-only now. Please see [Release Notes](docs/release-notes/15.0.0.md#esm-only-package) for more details.
- Added `RSCRoute` component to enable seamless server-side rendering of React Server Components. This component automatically handles RSC payload injection and hydration, allowing server components to be rendered directly within client components while maintaining optimal performance. [PR 1696](https://github.com/shakacode/react_on_rails/pull/1696) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
- The global context is now accessed using `globalThis`. [PR 1727](https://github.com/shakacode/react_on_rails/pull/1727) by [alexeyr-ci2](https://github.com/alexeyr-ci2).
- Generated client packs now import from `react-on-rails/client` instead of `react-on-rails`. [PR 1706](https://github.com/shakacode/react_on_rails/pull/1706) by [alexeyr-ci](https://github.com/alexeyr-ci).
- The "optimization opportunity" message when importing the server-side `react-on-rails` instead of `react-on-rails/client` in browsers is now a warning for two reasons:
- Make it more prominent
- Include a stack trace when clicked

### [15.0.0-alpha.2] - 2025-03-07

See [Release Notes](docs/release-notes/15.0.0.md) for full details.

#### Added

- Configuration option `generated_component_packs_loading_strategy` to control how generated component packs are loaded. It supports `sync`, `async`, and `defer` strategies. [PR 1712](https://github.com/shakacode/react_on_rails/pull/1712) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
- Support for returning React component from async render-function. [PR 1720](https://github.com/shakacode/react_on_rails/pull/1720) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
- React Server Components Support (Pro Feature) [PR 1644](https://github.com/shakacode/react_on_rails/pull/1644) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
- Improved component and store hydration performance [PR 1656](https://github.com/shakacode/react_on_rails/pull/1656) by [AbanoubGhadban](https://github.com/AbanoubGhadban).

#### Breaking Changes

- `ReactOnRails.reactOnRailsPageLoaded` is now an async function
- `force_load` configuration now defaults to `true`
- `defer_generated_component_packs` configuration now defaults to `false`

### [14.2.0] - 2025-03-03

#### Added
Expand Down Expand Up @@ -1577,8 +1566,8 @@ such as:

- Fix several generator-related issues.

[Unreleased]: https://github.com/shakacode/react_on_rails/compare/15.0.0-alpha.2...master
[15.0.0-alpha.2]: https://github.com/shakacode/react_on_rails/compare/14.2.0...15.0.0-alpha.2
[Unreleased]: https://github.com/shakacode/react_on_rails/compare/15.0.0...master
[15.0.0]: https://github.com/shakacode/react_on_rails/compare/14.2.0...15.0.0
[14.2.0]: https://github.com/shakacode/react_on_rails/compare/14.1.1...14.2.0
[14.1.1]: https://github.com/shakacode/react_on_rails/compare/14.1.0...14.1.1
[14.1.0]: https://github.com/shakacode/react_on_rails/compare/14.0.5...14.1.0
Expand Down
Loading
Loading