You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
* hydrate the component immediately when loaded and registered
* auto register server components and immediately hydrate stores
* move react-server-dom-webpack.d.ts to types directory
* ensure to initialize registered stores array before accessing
* refactor registration callback into separate class
* make the early hydration compatible with turbopack, backward compatible and refactor
* pass rsc path to RSC Client Root and move the config to RORP
* update min node version to 18
* export registerServerComponent as a separate entrypoint to avoid client bundle increase
* Update webpack assets status checker to use server bundle configuration
* Update webpack assets status checker to handle bundle file paths
* [WIP] handle errors happen in rsc payload (#1663)
* stream rsc payload in json objects like streamed react components
* make path to rsc bundle and react client manifest configurable
* feat: Improve client manifest path handling for dev server
- Add `dev_server_url` helper to centralize dev server URL construction
- Add `public_output_uri_path` to get relative webpack output path
- Add `asset_uri_from_packer` to handle asset URIs consistently
- Update `react_client_manifest_file_path` to return dev server URLs when appropriate
- Add comprehensive specs for new asset URI handling
This change ensures client manifest paths are properly resolved to dev server
URLs during development, improving hot-reloading functionality.
* fix: normalize RSC URL path by absorbing leading/trailing slashes
* specify Shakapacker as top-level module
* add tests for RSCClientRoot
* Make RSCClientRoot tests run with react 18
* Update webpack asset path configuration for client manifest
* Fix client startup rendering when the script runs after the page loaded
* Refactor client-side rendering and page lifecycle management
- Extract context and page lifecycle utilities into separate modules
- Improve handling of Turbolinks and Turbo events
- Simplify client startup and rendering process
- Add more robust page load and unload event management
- Rename and reorganize context-related functions
* Add component registry timeout configuration
- Introduce a new configuration option `component_registry_timeout` to control the maximum time to wait for client-side component registration
- Update `CallbackRegistry` to handle timeout events and reject pending callbacks
- Add validation for the timeout configuration in the Rails configuration
- Modify client-side startup and page lifecycle to support the new timeout mechanism
- Enhance error handling for unregistered components and stores
* Refactor CallbackRegistry and clientStartup initialization
- Move `initializeTimeoutEvents()` call to `getOrWaitForItem()` method in CallbackRegistry
- Remove unnecessary 4-second delay in clientStartup
- Clean up commented-out webpack configuration in clientWebpackConfig
* Update StoreRegistry error messages for clarity
* Fix RSC stream parsing to handle incomplete chunks
- Introduce `lastIncompleteChunk` to preserve partial JSON data between stream reads
- Ensure complete JSON chunks are processed by splitting on newlines
- Handle cases where the last chunk is not terminated with a newline
* Refactor CallbackRegistry to improve item tracking and usage
- Introduce `ItemInfo` type to track item registration, usage, and promise details
- Enhance timeout handling with more informative warnings for unused items
- Improve `get`, `has`, and `getAll` methods to better track item usage
- Optimize `getOrWaitForItem` to handle existing promises and registration states
* Refactor CallbackRegistry and ComponentRegistry to simplify item tracking
- Simplify CallbackRegistry by separating item storage and waiting promises
- Introduce separate maps for registered items and waiting promises
- Add a set to track unused items
- Update ComponentRegistry to include a clear method
- Modify test to use new clear method
* Update StoreRegistry test to use clearHydratedStores method
* Update RSC test to append newline to stream chunks
* don't strip the html chunk
* Add "use client" directive to RSCClientRoot
* Convert RSCWebpackLoader to TypeScript
* Comment on the need for workaround
* Fix Knip
* Simplify RSCWebpackLoader
* remove rsc? and stream? render options and add render_mode option
* Rename flight_payload_streaming to rsc_payload_streaming
* Add async component retrieval and timeout handling to ComponentRegistry
* add specs for packs generator
* Update react_on_rails_helper_spec with new props added to component definition script
* Remove webpacker dependency from Gemfile.lock
* Remove unnecessary webpacker mocking in configuration spec
* Update package.json exports for React Server Components
* fix: don't trim html content on server
* Enable prerendering by default for React Server Components
* Rename RSC rendering methods and configuration to payload generation
* add more comments for new components
* linting
* Update package.json exports order for React Server Components
* remove prerender option for stream_react_component
* small linting changes
* Use node 16 to run oldes tests
* Remove unnecessary data-store-dependencies attribute from test scripts
* linting
* Convert loadReactClientManifest to async and update RSC rendering
* make RSCClientRoot tests compatible with React 19
* Test fetch function only with node version 18+
* pass props to RSC generator and avoid state reset on hydration
* Add ignore configuration for Knip static analysis
* small changes
* Implement stream buffering to safely handle stream events and errors
* Fix stream error emission in buffered stream
* Simplify streaming result parsing logic in server rendering
* remove mentions to experiment react 18 and use only react 19
* Refactor registerServerComponent into client and server modules
* Add RSCWebpackPlugin for React Server Components
* Replace react-server-dom-webpack with @shakacode-tools/react-on-rails-rsc
* Update TypeScript configuration and package dependencies for React Server Components
* Remove webpack dependency from package configuration
* Update @shakacode-tools/react-on-rails-rsc dependency to latest commit
* Make reactOnRailsPageLoaded async
* Update configuration to enable force_load by default and modify redux_store helper
* Bump version to 15.0.0-alpha.2 and update CHANGELOG
* revert this: Update package to use @abanoubghadban/react-on-rails-rsc
* Configure .npmrc for private GitHub package registry
* Update import statements for path and fs modules in test file
* Update test specs to add data-force-load attribute by default
* Add null check for ReactOnRails global object in component and store loading scripts
* Bump version to 15.0.0.alpha.2
* Update GitHub Actions workflows to use Shakacode Tools Packages Token
* Update package to use @shakacode-tools/react-on-rails-rsc
* Revert version to 14.2.0 and update CHANGELOG
* Enhance server-side rendering error logging and debugging
- Add full backtrace to error messages for better diagnostics
- Add temporary debugging breakpoint with binding.pry
* Remove temporary debugging breakpoint in server rendering
* Revert gem version to 14.2.0 in Gemfile.lock
* Remove backtrace from server rendering error logging
* Update package to use react-on-rails-rsc package instead of the old private package
* Update CHANGELOG and knip configuration
- Add description for unreleased changes in CHANGELOG
- Remove unused entry from knip configuration
- Add jsdom as a development dependency in knip config
* Change default defer behavior for generated component packs
* Update test to reflect new default defer behavior for generated component packs
* Update CHANGELOG and release notes for React on Rails 15.0.0
- Add comprehensive release notes for version 15.0.0
- Highlight major features: React Server Components support and improved component hydration
- Document breaking changes related to component hydration and store dependencies
- Summarize key improvements in component and store hydration performance
* Add domNodeId support for server-side rendering identifier prefix to support multiple components in the view
* Remove PR references from 15.0.0 release notes
Copy file name to clipboardExpand all lines: CHANGELOG.md
+11
Original file line number
Diff line number
Diff line change
@@ -18,6 +18,17 @@ Please follow the recommendations outlined at [keepachangelog.com](http://keepac
18
18
### [Unreleased]
19
19
Changes since the last non-beta release.
20
20
21
+
See [Release Notes](docs/release-notes/15.0.0.md) for full details.
22
+
23
+
#### Added
24
+
- React Server Components Support (Pro Feature) [PR 1644](https://github.com/shakacode/react_on_rails/pull/1644) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
25
+
- Improved component and store hydration performance [PR 1656](https://github.com/shakacode/react_on_rails/pull/1656) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
26
+
27
+
#### Breaking Changes
28
+
-`ReactOnRails.reactOnRailsPageLoaded` is now an async function
29
+
-`force_load` configuration now defaults to `true`
30
+
-`defer_generated_component_packs` configuration now defaults to `false`
Experience the future of React with full RSC integration in your Rails apps:
7
+
- Seamlessly use React Server Components
8
+
- Reduce client bundle sizes
9
+
- Enable powerful new patterns for data fetching
10
+
- ⚡️ Requires React on Rails Pro - [See the full tutorial](https://www.shakacode.com/react-on-rails-pro/docs/react-server-components-tutorial)
11
+
12
+
### Improved Component Hydration
13
+
Major improvements to component and store hydration:
14
+
- Components and stores now hydrate immediately rather than waiting for page load
15
+
- Enables faster hydration, especially beneficial for streamed pages
16
+
- Components can hydrate before the page is fully streamed
17
+
- Can use `async` scripts in the page with no fear of race condition
18
+
- No need to use `defer` anymore
19
+
20
+
## Breaking Changes
21
+
22
+
### Component Hydration Changes
23
+
- The `defer_generated_component_packs` and `force_load` configurations now default to `false` and `true` respectively. This means components will hydrate early without waiting for the full page load. This improves performance by eliminating unnecessary delays in hydration.
24
+
- The previous need for deferring scripts to prevent race conditions has been eliminated due to improved hydration handling. Making scripts not defer is critical to execute the hydration scripts early before the page is fully loaded.
25
+
- The `force_load` configuration make `react-on-rails` hydrate components immediately as soon as their server-rendered HTML reaches the client, without waiting for the full page load.
26
+
- If you want to keep the previous behavior, you can set `defer_generated_component_packs: true` or `force_load: false` in your `config/initializers/react_on_rails.rb` file.
27
+
- If we want to keep the original behavior of `force_load` for only one or more components, you can set `force_load: false` in the `react_component` helper or `force_load` configuration.
28
+
- Redux store support `force_load` option now and it uses `config.force_load` value as the default value. Which means that the redux store will hydrate immediately as soon as its server-side data reaches the client. You can override this behavior for individual redux stores by setting `force_load: false` in the `redux_store` helper.
29
+
30
+
-`ReactOnRails.reactOnRailsPageLoaded()` is now an async function:
31
+
- If you are manually calling this function to ensure components are hydrated (e.g. with async script loading), you must now await the promise it returns:
32
+
```js
33
+
// Before
34
+
ReactOnRails.reactOnRailsPageLoaded();
35
+
// Code expecting all components to be hydrated
36
+
37
+
// After
38
+
awaitReactOnRails.reactOnRailsPageLoaded();
39
+
// Code expecting all components to be hydrated
40
+
```
41
+
42
+
## Store Dependencies for Components
43
+
44
+
When using Redux stores with multiple components, you need to explicitly declare store dependencies to optimize hydration. Here's how:
45
+
46
+
### The Problem
47
+
48
+
If you have deferred Redux stores and components like this:
0 commit comments