react_on_rails_pro 16.2.0.beta.20 → 16.2.0.test.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/.prettierignore +0 -3
- data/.rubocop.yml +90 -7
- data/CHANGELOG.md +2 -9
- data/Gemfile.development_dependencies +4 -4
- data/Gemfile.loader +8 -11
- data/Gemfile.lock +123 -146
- data/docs/code-splitting-loadable-components.md +53 -69
- data/lib/react_on_rails_pro/version.rb +1 -1
- metadata +4 -4
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: a0112c934965b40a6275bd05fe1309924b21f087f2ff0b8874ca4540dd40d4f7
|
|
4
|
+
data.tar.gz: ed5b0b8d9fc888529bacd29b900221b99e28544204dd016fe0d3449803f865b7
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 14688a5ec648396a4160bcf77a775df3a382ff8103cfed7f57e2b78a7f780e43c3c83bb3d0a5d4125005b39531845cd928fcfb255c032a9f2e5e53710ec15fe2
|
|
7
|
+
data.tar.gz: c675bd301c26d46d07d01f51750d4e4f6bc7c480e05f9ac1362a2730fbd30c857f1a51a714c68326c943d93135a4c90c9c5be53589ed1b1b1d75f9048eafaa32
|
data/.prettierignore
CHANGED
data/.rubocop.yml
CHANGED
|
@@ -1,31 +1,111 @@
|
|
|
1
|
-
#
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
merge:
|
|
7
|
-
- Exclude
|
|
1
|
+
# This is the configuration used to check the rubocop source code.
|
|
2
|
+
# Check out: https://github.com/bbatsov/rubocop
|
|
3
|
+
require:
|
|
4
|
+
- rubocop-performance
|
|
5
|
+
- rubocop-rspec
|
|
8
6
|
|
|
9
7
|
AllCops:
|
|
8
|
+
NewCops: enable
|
|
9
|
+
DisplayCopNames: true
|
|
10
|
+
TargetRubyVersion: 3.0
|
|
11
|
+
|
|
12
|
+
Include:
|
|
13
|
+
- '**/Rakefile'
|
|
14
|
+
- '**/config.ru'
|
|
15
|
+
- 'Gemfile'
|
|
16
|
+
- '**/*.rb'
|
|
17
|
+
- '**/*.rake'
|
|
18
|
+
|
|
10
19
|
Exclude:
|
|
11
20
|
<% `git status --ignored --porcelain`.lines.grep(/^!! /).each do |path| %>
|
|
12
21
|
- <%= path.sub(/^!! /, '') %>
|
|
13
22
|
<% end %>
|
|
23
|
+
- '**/node_modules/**/*'
|
|
14
24
|
- 'db/schema.rb'
|
|
15
25
|
- 'db/seeds.rb'
|
|
26
|
+
- 'spec/fixtures/**/*'
|
|
16
27
|
- 'spec/dummy/db/schema.rb'
|
|
17
28
|
- 'spec/dummy/bin/**/*'
|
|
29
|
+
- 'node_modules/**/*'
|
|
30
|
+
- 'coverage/**/*'
|
|
18
31
|
- 'bin/**/*'
|
|
32
|
+
- 'vendor/**/*'
|
|
33
|
+
|
|
34
|
+
Naming/FileName:
|
|
35
|
+
Exclude:
|
|
36
|
+
- '**/Gemfile'
|
|
37
|
+
- '**/Rakefile'
|
|
38
|
+
|
|
39
|
+
Layout/LineLength:
|
|
40
|
+
Max: 120
|
|
41
|
+
|
|
42
|
+
Style/StringLiterals:
|
|
43
|
+
EnforcedStyle: double_quotes
|
|
44
|
+
|
|
45
|
+
Style/Documentation:
|
|
46
|
+
Enabled: false
|
|
47
|
+
|
|
48
|
+
Style/HashEachMethods:
|
|
49
|
+
Enabled: true
|
|
50
|
+
|
|
51
|
+
Style/HashTransformKeys:
|
|
52
|
+
Enabled: true
|
|
53
|
+
|
|
54
|
+
Style/HashTransformValues:
|
|
55
|
+
Enabled: true
|
|
56
|
+
|
|
57
|
+
Metrics/AbcSize:
|
|
58
|
+
Max: 28
|
|
59
|
+
|
|
60
|
+
Metrics/CyclomaticComplexity:
|
|
61
|
+
Max: 8
|
|
62
|
+
|
|
63
|
+
Metrics/PerceivedComplexity:
|
|
64
|
+
Max: 10
|
|
65
|
+
|
|
66
|
+
Metrics/ClassLength:
|
|
67
|
+
Max: 140
|
|
68
|
+
|
|
69
|
+
Metrics/ParameterLists:
|
|
70
|
+
Max: 5
|
|
71
|
+
CountKeywordArgs: false
|
|
72
|
+
|
|
73
|
+
Metrics/MethodLength:
|
|
74
|
+
Max: 41
|
|
75
|
+
|
|
76
|
+
Metrics/ModuleLength:
|
|
77
|
+
Max: 180
|
|
78
|
+
|
|
79
|
+
RSpec/DescribeClass:
|
|
80
|
+
Enabled: false
|
|
81
|
+
|
|
82
|
+
RSpec/ExampleLength:
|
|
83
|
+
Enabled: false
|
|
84
|
+
|
|
85
|
+
RSpec/MessageSpies:
|
|
86
|
+
Enabled: false
|
|
87
|
+
|
|
88
|
+
RSpec/NestedGroups:
|
|
89
|
+
Max: 5
|
|
19
90
|
|
|
20
91
|
RSpec/BeforeAfterAll:
|
|
21
92
|
Exclude:
|
|
22
93
|
- 'spec/react_on_rails/generators/dev_tests_generator_spec.rb'
|
|
23
94
|
- 'spec/react_on_rails/generators/install_generator_spec.rb'
|
|
24
95
|
|
|
96
|
+
RSpec/MessageChain:
|
|
97
|
+
Enabled: false
|
|
98
|
+
|
|
99
|
+
RSpec/MultipleExpectations:
|
|
100
|
+
Enabled: false
|
|
101
|
+
|
|
25
102
|
RSpec/MultipleDescribes:
|
|
26
103
|
Exclude:
|
|
27
104
|
- 'spec/dummy/spec/system/integration_spec.rb'
|
|
28
105
|
|
|
106
|
+
RSpec/MultipleMemoizedHelpers:
|
|
107
|
+
Max: 12
|
|
108
|
+
|
|
29
109
|
RSpec:
|
|
30
110
|
Language:
|
|
31
111
|
Expectations:
|
|
@@ -35,3 +115,6 @@ RSpec:
|
|
|
35
115
|
Style/GlobalVars:
|
|
36
116
|
Exclude:
|
|
37
117
|
- 'spec/dummy/config/environments/development.rb'
|
|
118
|
+
|
|
119
|
+
Style/FrozenStringLiteralComment:
|
|
120
|
+
EnforcedStyle: always
|
data/CHANGELOG.md
CHANGED
|
@@ -17,9 +17,7 @@ You can find the **package** version numbers from this repo's tags and below in
|
|
|
17
17
|
|
|
18
18
|
## [Unreleased]
|
|
19
19
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
Changes since the last non-beta release.
|
|
20
|
+
_Add changes in master not yet tagged._
|
|
23
21
|
|
|
24
22
|
### Improved
|
|
25
23
|
|
|
@@ -50,12 +48,8 @@ Changes since the last non-beta release.
|
|
|
50
48
|
|
|
51
49
|
### Fixed
|
|
52
50
|
|
|
53
|
-
- **SECURITY: CVE-2025-55182 - React Server Components RCE Vulnerability**: by updating `react-on-rails-rsc` peer dependency to `v19.0.3` which mitigates that vulnerability. Also, users should update `react` and `react-dom` package versions to `v19.0.1` to ensure complete mitigation. [PR 2175](https://github.com/shakacode/react_on_rails/pull/2175) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
|
|
54
|
-
|
|
55
51
|
- Fixed compatibility issue with httpx 1.6.x by explicitly requiring http-2 >= 1.1.1. [PR 2141](https://github.com/shakacode/react_on_rails/pull/2141) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
|
|
56
52
|
|
|
57
|
-
- **Client Disconnect Handling for Streaming**: Added error handling for client disconnects during streaming. When a client disconnects mid-stream (browser closed, network drop), the system now catches `IOError`/`Errno::EPIPE`, sets a `client_disconnected` flag, stops the barrier to cancel producer tasks, and logs the disconnect for debugging. Prevents wasted CPU from producers continuing after the writer fails. [PR 2137](https://github.com/shakacode/react_on_rails/pull/2137) by [justin808](https://github.com/justin808).
|
|
58
|
-
|
|
59
53
|
- **Node Renderer Worker Restart**: Fixed "descriptor closed" error that occurred when the node renderer restarts while handling an in-progress request (especially streaming requests). Workers now perform graceful shutdowns: they disconnect from the cluster to stop receiving new requests, wait for active requests to complete, then shut down cleanly. A configurable `gracefulWorkerRestartTimeout` ensures workers are forcibly killed if they don't shut down in time. [PR 1970](https://github.com/shakacode/react_on_rails/pull/1970) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
|
|
60
54
|
|
|
61
55
|
- **Body Duplication Bug On Streaming**: Fixed a bug that happens while streaming if the node renderer connection closed after streaming some chunks to the client. [PR 1995](https://github.com/shakacode/react_on_rails/pull/1995) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
|
|
@@ -542,8 +536,7 @@ Above changes in [PR 52](https://github.com/shakacode/react_on_rails_pro/pull/52
|
|
|
542
536
|
- advanced error handling
|
|
543
537
|
|
|
544
538
|
[HEAD compared to 3.2.1]: https://github.com/shakacode/react_on_rails_pro/compare/3.3.1...HEAD
|
|
545
|
-
[Unreleased]: https://github.com/shakacode/
|
|
546
|
-
[v16.2.0.beta.13]: https://github.com/shakacode/react_on_rails/compare/16.1.1...v16.2.0.beta.13
|
|
539
|
+
[Unreleased]: https://github.com/shakacode/react_on_rails_pro/compare/4.0.0-rc-15...HEAD
|
|
547
540
|
[4.0.0-rc.15]: https://github.com/shakacode/react_on_rails_pro/compare/4.0.0-rc.14...4.0.0-rc.15
|
|
548
541
|
[4.0.0.rc.11]: https://github.com/shakacode/react_on_rails_pro/compare/4.0.0-rc.9...4.0.0-rc.11
|
|
549
542
|
[4.0.0.rc.9]: https://github.com/shakacode/react_on_rails_pro/compare/4.0.0-rc.6...4.0.0-rc.9
|
|
@@ -1,16 +1,13 @@
|
|
|
1
1
|
# Keep in sync with https://github.com/shakacode/react_on_rails/blob/master/Gemfile.development_dependencies
|
|
2
2
|
# frozen_string_literal: true
|
|
3
3
|
|
|
4
|
-
# Shared dev dependencies (rubocop, etc.)
|
|
5
|
-
eval_gemfile File.expand_path("../Gemfile.shared_dev_dependencies", __dir__)
|
|
6
|
-
|
|
7
4
|
git_source(:github) { |repo| "https://github.com/#{repo}.git" }
|
|
8
5
|
|
|
9
6
|
ruby '3.3.7'
|
|
10
7
|
|
|
11
8
|
gem "react_on_rails", path: "../"
|
|
12
9
|
|
|
13
|
-
gem "shakapacker", "9.
|
|
10
|
+
gem "shakapacker", "9.3.0"
|
|
14
11
|
gem "bootsnap", require: false
|
|
15
12
|
gem "rails", "~> 7.1"
|
|
16
13
|
gem "puma", "~> 6"
|
|
@@ -54,6 +51,9 @@ group :development, :test do
|
|
|
54
51
|
gem 'pry-theme' # An easy way to customize Pry colors via theme files
|
|
55
52
|
|
|
56
53
|
gem "rbs", require: false
|
|
54
|
+
gem "rubocop", "1.36.0", require: false
|
|
55
|
+
gem 'rubocop-performance', "1.15.0", require: false
|
|
56
|
+
gem 'rubocop-rspec', "2.13.2", require: false
|
|
57
57
|
gem "scss_lint", require: false
|
|
58
58
|
gem 'fakefs', require: 'fakefs/safe'
|
|
59
59
|
end
|
data/Gemfile.loader
CHANGED
|
@@ -1,20 +1,19 @@
|
|
|
1
1
|
# frozen_string_literal: true
|
|
2
2
|
|
|
3
3
|
# Load base dependencies
|
|
4
|
-
|
|
5
|
-
base_deps = File.read(base_deps_path)
|
|
4
|
+
base_deps = File.read(File.expand_path("./Gemfile.development_dependencies", __dir__))
|
|
6
5
|
|
|
7
6
|
# Determine which override file to use
|
|
8
|
-
|
|
7
|
+
override_deps = if ENV["CI"] == "true" && File.exist?(File.expand_path("./Gemfile.ci", __dir__))
|
|
9
8
|
# In CI environment, use CI dependencies
|
|
10
|
-
File.expand_path("./Gemfile.ci", __dir__)
|
|
9
|
+
File.read(File.expand_path("./Gemfile.ci", __dir__))
|
|
11
10
|
elsif File.exist?(File.expand_path("./Gemfile.local", __dir__))
|
|
12
11
|
# In non-CI environment, use local dependencies if they exist
|
|
13
|
-
File.expand_path("./Gemfile.local", __dir__)
|
|
12
|
+
File.read(File.expand_path("./Gemfile.local", __dir__))
|
|
13
|
+
else
|
|
14
|
+
""
|
|
14
15
|
end
|
|
15
16
|
|
|
16
|
-
override_deps = override_deps_path ? File.read(override_deps_path) : ""
|
|
17
|
-
|
|
18
17
|
# Parse override gems
|
|
19
18
|
override_gem_names = override_deps.scan(/^\s*gem\s+["']([^"']+)["']/).flatten
|
|
20
19
|
|
|
@@ -27,9 +26,7 @@ end
|
|
|
27
26
|
base_deps.gsub!(/^\s*$\n/, '')
|
|
28
27
|
|
|
29
28
|
# Evaluate the modified base dependencies
|
|
30
|
-
|
|
31
|
-
# allowing eval_gemfile calls to work correctly inside loaded files.
|
|
32
|
-
instance_eval(base_deps, base_deps_path)
|
|
29
|
+
eval(base_deps)
|
|
33
30
|
|
|
34
31
|
# Evaluate override dependencies if they exist
|
|
35
|
-
|
|
32
|
+
eval(override_deps) unless override_deps.empty?
|
data/Gemfile.lock
CHANGED
|
@@ -9,7 +9,7 @@ GIT
|
|
|
9
9
|
PATH
|
|
10
10
|
remote: ..
|
|
11
11
|
specs:
|
|
12
|
-
react_on_rails (16.2.0.
|
|
12
|
+
react_on_rails (16.2.0.test.3)
|
|
13
13
|
addressable
|
|
14
14
|
connection_pool
|
|
15
15
|
execjs (~> 2.5)
|
|
@@ -20,7 +20,7 @@ PATH
|
|
|
20
20
|
PATH
|
|
21
21
|
remote: .
|
|
22
22
|
specs:
|
|
23
|
-
react_on_rails_pro (16.2.0.
|
|
23
|
+
react_on_rails_pro (16.2.0.test.3)
|
|
24
24
|
addressable
|
|
25
25
|
async (>= 2.6)
|
|
26
26
|
connection_pool
|
|
@@ -29,73 +29,71 @@ PATH
|
|
|
29
29
|
httpx (~> 1.5)
|
|
30
30
|
jwt (~> 2.7)
|
|
31
31
|
rainbow
|
|
32
|
-
react_on_rails (= 16.2.0.
|
|
32
|
+
react_on_rails (= 16.2.0.test.3)
|
|
33
33
|
|
|
34
34
|
GEM
|
|
35
35
|
remote: https://rubygems.org/
|
|
36
36
|
specs:
|
|
37
|
-
actioncable (7.2.
|
|
38
|
-
actionpack (= 7.2.
|
|
39
|
-
activesupport (= 7.2.
|
|
37
|
+
actioncable (7.2.2.1)
|
|
38
|
+
actionpack (= 7.2.2.1)
|
|
39
|
+
activesupport (= 7.2.2.1)
|
|
40
40
|
nio4r (~> 2.0)
|
|
41
41
|
websocket-driver (>= 0.6.1)
|
|
42
42
|
zeitwerk (~> 2.6)
|
|
43
|
-
actionmailbox (7.2.
|
|
44
|
-
actionpack (= 7.2.
|
|
45
|
-
activejob (= 7.2.
|
|
46
|
-
activerecord (= 7.2.
|
|
47
|
-
activestorage (= 7.2.
|
|
48
|
-
activesupport (= 7.2.
|
|
43
|
+
actionmailbox (7.2.2.1)
|
|
44
|
+
actionpack (= 7.2.2.1)
|
|
45
|
+
activejob (= 7.2.2.1)
|
|
46
|
+
activerecord (= 7.2.2.1)
|
|
47
|
+
activestorage (= 7.2.2.1)
|
|
48
|
+
activesupport (= 7.2.2.1)
|
|
49
49
|
mail (>= 2.8.0)
|
|
50
|
-
actionmailer (7.2.
|
|
51
|
-
actionpack (= 7.2.
|
|
52
|
-
actionview (= 7.2.
|
|
53
|
-
activejob (= 7.2.
|
|
54
|
-
activesupport (= 7.2.
|
|
50
|
+
actionmailer (7.2.2.1)
|
|
51
|
+
actionpack (= 7.2.2.1)
|
|
52
|
+
actionview (= 7.2.2.1)
|
|
53
|
+
activejob (= 7.2.2.1)
|
|
54
|
+
activesupport (= 7.2.2.1)
|
|
55
55
|
mail (>= 2.8.0)
|
|
56
56
|
rails-dom-testing (~> 2.2)
|
|
57
|
-
actionpack (7.2.
|
|
58
|
-
actionview (= 7.2.
|
|
59
|
-
activesupport (= 7.2.
|
|
60
|
-
cgi
|
|
57
|
+
actionpack (7.2.2.1)
|
|
58
|
+
actionview (= 7.2.2.1)
|
|
59
|
+
activesupport (= 7.2.2.1)
|
|
61
60
|
nokogiri (>= 1.8.5)
|
|
62
61
|
racc
|
|
63
|
-
rack (>= 2.2.4, < 3.
|
|
62
|
+
rack (>= 2.2.4, < 3.2)
|
|
64
63
|
rack-session (>= 1.0.1)
|
|
65
64
|
rack-test (>= 0.6.3)
|
|
66
65
|
rails-dom-testing (~> 2.2)
|
|
67
66
|
rails-html-sanitizer (~> 1.6)
|
|
68
67
|
useragent (~> 0.16)
|
|
69
|
-
actiontext (7.2.
|
|
70
|
-
actionpack (= 7.2.
|
|
71
|
-
activerecord (= 7.2.
|
|
72
|
-
activestorage (= 7.2.
|
|
73
|
-
activesupport (= 7.2.
|
|
68
|
+
actiontext (7.2.2.1)
|
|
69
|
+
actionpack (= 7.2.2.1)
|
|
70
|
+
activerecord (= 7.2.2.1)
|
|
71
|
+
activestorage (= 7.2.2.1)
|
|
72
|
+
activesupport (= 7.2.2.1)
|
|
74
73
|
globalid (>= 0.6.0)
|
|
75
74
|
nokogiri (>= 1.8.5)
|
|
76
|
-
actionview (7.2.
|
|
77
|
-
activesupport (= 7.2.
|
|
75
|
+
actionview (7.2.2.1)
|
|
76
|
+
activesupport (= 7.2.2.1)
|
|
78
77
|
builder (~> 3.1)
|
|
79
|
-
cgi
|
|
80
78
|
erubi (~> 1.11)
|
|
81
79
|
rails-dom-testing (~> 2.2)
|
|
82
80
|
rails-html-sanitizer (~> 1.6)
|
|
83
|
-
activejob (7.2.
|
|
84
|
-
activesupport (= 7.2.
|
|
81
|
+
activejob (7.2.2.1)
|
|
82
|
+
activesupport (= 7.2.2.1)
|
|
85
83
|
globalid (>= 0.3.6)
|
|
86
|
-
activemodel (7.2.
|
|
87
|
-
activesupport (= 7.2.
|
|
88
|
-
activerecord (7.2.
|
|
89
|
-
activemodel (= 7.2.
|
|
90
|
-
activesupport (= 7.2.
|
|
84
|
+
activemodel (7.2.2.1)
|
|
85
|
+
activesupport (= 7.2.2.1)
|
|
86
|
+
activerecord (7.2.2.1)
|
|
87
|
+
activemodel (= 7.2.2.1)
|
|
88
|
+
activesupport (= 7.2.2.1)
|
|
91
89
|
timeout (>= 0.4.0)
|
|
92
|
-
activestorage (7.2.
|
|
93
|
-
actionpack (= 7.2.
|
|
94
|
-
activejob (= 7.2.
|
|
95
|
-
activerecord (= 7.2.
|
|
96
|
-
activesupport (= 7.2.
|
|
90
|
+
activestorage (7.2.2.1)
|
|
91
|
+
actionpack (= 7.2.2.1)
|
|
92
|
+
activejob (= 7.2.2.1)
|
|
93
|
+
activerecord (= 7.2.2.1)
|
|
94
|
+
activesupport (= 7.2.2.1)
|
|
97
95
|
marcel (~> 1.0)
|
|
98
|
-
activesupport (7.2.
|
|
96
|
+
activesupport (7.2.2.1)
|
|
99
97
|
base64
|
|
100
98
|
benchmark (>= 0.3)
|
|
101
99
|
bigdecimal
|
|
@@ -107,19 +105,19 @@ GEM
|
|
|
107
105
|
minitest (>= 5.1)
|
|
108
106
|
securerandom (>= 0.3)
|
|
109
107
|
tzinfo (~> 2.0, >= 2.0.5)
|
|
110
|
-
addressable (2.8.
|
|
111
|
-
public_suffix (>= 2.0.2, <
|
|
108
|
+
addressable (2.8.7)
|
|
109
|
+
public_suffix (>= 2.0.2, < 7.0)
|
|
112
110
|
amazing_print (1.6.0)
|
|
113
|
-
ast (2.4.
|
|
114
|
-
async (2.
|
|
111
|
+
ast (2.4.2)
|
|
112
|
+
async (2.27.4)
|
|
115
113
|
console (~> 1.29)
|
|
116
114
|
fiber-annotation
|
|
117
115
|
io-event (~> 1.11)
|
|
118
116
|
metrics (~> 0.12)
|
|
119
|
-
traces (~> 0.
|
|
120
|
-
base64 (0.
|
|
121
|
-
benchmark (0.
|
|
122
|
-
bigdecimal (3.
|
|
117
|
+
traces (~> 0.15)
|
|
118
|
+
base64 (0.2.0)
|
|
119
|
+
benchmark (0.4.0)
|
|
120
|
+
bigdecimal (3.1.9)
|
|
123
121
|
bindex (0.8.1)
|
|
124
122
|
bootsnap (1.18.3)
|
|
125
123
|
msgpack (~> 1.2)
|
|
@@ -137,15 +135,14 @@ GEM
|
|
|
137
135
|
capybara-screenshot (1.0.26)
|
|
138
136
|
capybara (>= 1.0, < 4)
|
|
139
137
|
launchy
|
|
140
|
-
cgi (0.5.0)
|
|
141
138
|
childprocess (5.0.0)
|
|
142
139
|
coderay (1.1.3)
|
|
143
140
|
commonmarker (1.1.4-arm64-darwin)
|
|
144
141
|
commonmarker (1.1.4-x86_64-darwin)
|
|
145
142
|
commonmarker (1.1.4-x86_64-linux)
|
|
146
143
|
concurrent-ruby (1.3.5)
|
|
147
|
-
connection_pool (
|
|
148
|
-
console (1.
|
|
144
|
+
connection_pool (2.5.0)
|
|
145
|
+
console (1.33.0)
|
|
149
146
|
fiber-annotation
|
|
150
147
|
fiber-local (~> 1.1)
|
|
151
148
|
json
|
|
@@ -159,15 +156,14 @@ GEM
|
|
|
159
156
|
bigdecimal
|
|
160
157
|
rexml
|
|
161
158
|
crass (1.0.6)
|
|
162
|
-
date (3.
|
|
159
|
+
date (3.4.1)
|
|
163
160
|
diff-lcs (1.5.1)
|
|
164
161
|
docile (1.4.0)
|
|
165
|
-
drb (2.2.
|
|
162
|
+
drb (2.2.1)
|
|
166
163
|
equivalent-xml (0.6.0)
|
|
167
164
|
nokogiri (>= 1.4.3)
|
|
168
|
-
erb (6.0.0)
|
|
169
165
|
erubi (1.13.1)
|
|
170
|
-
execjs (2.
|
|
166
|
+
execjs (2.9.1)
|
|
171
167
|
fakefs (2.8.0)
|
|
172
168
|
faker (3.4.1)
|
|
173
169
|
i18n (>= 1.8.11, < 2)
|
|
@@ -182,19 +178,19 @@ GEM
|
|
|
182
178
|
generator_spec (0.10.0)
|
|
183
179
|
activesupport (>= 3.0.0)
|
|
184
180
|
railties (>= 3.0.0)
|
|
185
|
-
globalid (1.
|
|
181
|
+
globalid (1.2.1)
|
|
186
182
|
activesupport (>= 6.1)
|
|
187
183
|
graphiql-rails (1.10.0)
|
|
188
184
|
railties
|
|
189
185
|
hashdiff (1.1.0)
|
|
190
186
|
http-2 (1.1.1)
|
|
191
|
-
httpx (1.
|
|
187
|
+
httpx (1.5.1)
|
|
192
188
|
http-2 (>= 1.0.0)
|
|
193
189
|
i18n (1.14.7)
|
|
194
190
|
concurrent-ruby (~> 1.0)
|
|
195
|
-
io-console (0.8.
|
|
196
|
-
io-event (1.
|
|
197
|
-
irb (1.15.
|
|
191
|
+
io-console (0.8.0)
|
|
192
|
+
io-event (1.12.1)
|
|
193
|
+
irb (1.15.1)
|
|
198
194
|
pp (>= 0.6.0)
|
|
199
195
|
rdoc (>= 4.0.0)
|
|
200
196
|
reline (>= 0.4.2)
|
|
@@ -205,38 +201,36 @@ GEM
|
|
|
205
201
|
rails-dom-testing (>= 1, < 3)
|
|
206
202
|
railties (>= 4.2.0)
|
|
207
203
|
thor (>= 0.14, < 2.0)
|
|
208
|
-
json (2.
|
|
209
|
-
jwt (2.
|
|
204
|
+
json (2.7.2)
|
|
205
|
+
jwt (2.9.3)
|
|
210
206
|
base64
|
|
211
|
-
language_server-protocol (3.17.0.5)
|
|
212
207
|
launchy (3.0.1)
|
|
213
208
|
addressable (~> 2.8)
|
|
214
209
|
childprocess (~> 5.0)
|
|
215
210
|
listen (3.9.0)
|
|
216
211
|
rb-fsevent (~> 0.10, >= 0.10.3)
|
|
217
212
|
rb-inotify (~> 0.9, >= 0.9.10)
|
|
218
|
-
logger (1.
|
|
219
|
-
loofah (2.24.
|
|
213
|
+
logger (1.6.6)
|
|
214
|
+
loofah (2.24.0)
|
|
220
215
|
crass (~> 1.0.2)
|
|
221
216
|
nokogiri (>= 1.12.0)
|
|
222
|
-
mail (2.
|
|
223
|
-
logger
|
|
217
|
+
mail (2.8.1)
|
|
224
218
|
mini_mime (>= 0.1.1)
|
|
225
219
|
net-imap
|
|
226
220
|
net-pop
|
|
227
221
|
net-smtp
|
|
228
|
-
marcel (1.
|
|
222
|
+
marcel (1.0.4)
|
|
229
223
|
matrix (0.4.2)
|
|
230
224
|
method_source (1.1.0)
|
|
231
|
-
metrics (0.
|
|
225
|
+
metrics (0.14.0)
|
|
232
226
|
mini_mime (1.1.5)
|
|
233
|
-
minitest (5.
|
|
227
|
+
minitest (5.25.4)
|
|
234
228
|
mize (0.4.1)
|
|
235
229
|
protocol (~> 2.0)
|
|
236
230
|
msgpack (1.7.2)
|
|
237
231
|
net-http (0.4.1)
|
|
238
232
|
uri
|
|
239
|
-
net-imap (0.5.
|
|
233
|
+
net-imap (0.5.8)
|
|
240
234
|
date
|
|
241
235
|
net-protocol
|
|
242
236
|
net-pop (0.1.2)
|
|
@@ -245,23 +239,22 @@ GEM
|
|
|
245
239
|
timeout
|
|
246
240
|
net-smtp (0.5.1)
|
|
247
241
|
net-protocol
|
|
248
|
-
nio4r (2.7.
|
|
249
|
-
nokogiri (1.18.
|
|
242
|
+
nio4r (2.7.4)
|
|
243
|
+
nokogiri (1.18.8-arm64-darwin)
|
|
250
244
|
racc (~> 1.4)
|
|
251
|
-
nokogiri (1.18.
|
|
245
|
+
nokogiri (1.18.8-x86_64-darwin)
|
|
252
246
|
racc (~> 1.4)
|
|
253
|
-
nokogiri (1.18.
|
|
247
|
+
nokogiri (1.18.8-x86_64-linux-gnu)
|
|
254
248
|
racc (~> 1.4)
|
|
255
249
|
package_json (0.2.0)
|
|
256
|
-
parallel (1.
|
|
257
|
-
parser (3.3.
|
|
250
|
+
parallel (1.25.1)
|
|
251
|
+
parser (3.3.3.0)
|
|
258
252
|
ast (~> 2.4.1)
|
|
259
253
|
racc
|
|
260
254
|
pg (1.5.6)
|
|
261
|
-
pp (0.6.
|
|
255
|
+
pp (0.6.2)
|
|
262
256
|
prettyprint
|
|
263
257
|
prettyprint (0.2.0)
|
|
264
|
-
prism (1.6.0)
|
|
265
258
|
protocol (2.0.0)
|
|
266
259
|
ruby_parser (~> 3.0)
|
|
267
260
|
pry (0.14.2)
|
|
@@ -274,67 +267,63 @@ GEM
|
|
|
274
267
|
pry (>= 0.13.0)
|
|
275
268
|
pry-theme (1.3.1)
|
|
276
269
|
coderay (~> 1.1)
|
|
277
|
-
psych (5.2.
|
|
270
|
+
psych (5.2.3)
|
|
278
271
|
date
|
|
279
272
|
stringio
|
|
280
|
-
public_suffix (
|
|
273
|
+
public_suffix (6.0.0)
|
|
281
274
|
puma (6.5.0)
|
|
282
275
|
nio4r (~> 2.0)
|
|
283
276
|
racc (1.8.1)
|
|
284
|
-
rack (3.
|
|
277
|
+
rack (3.1.12)
|
|
285
278
|
rack-proxy (0.7.7)
|
|
286
279
|
rack
|
|
287
|
-
rack-session (2.1.
|
|
280
|
+
rack-session (2.1.0)
|
|
288
281
|
base64 (>= 0.1.0)
|
|
289
282
|
rack (>= 3.0.0)
|
|
290
283
|
rack-test (2.2.0)
|
|
291
284
|
rack (>= 1.3)
|
|
292
|
-
rackup (2.
|
|
285
|
+
rackup (2.2.1)
|
|
293
286
|
rack (>= 3)
|
|
294
|
-
rails (7.2.
|
|
295
|
-
actioncable (= 7.2.
|
|
296
|
-
actionmailbox (= 7.2.
|
|
297
|
-
actionmailer (= 7.2.
|
|
298
|
-
actionpack (= 7.2.
|
|
299
|
-
actiontext (= 7.2.
|
|
300
|
-
actionview (= 7.2.
|
|
301
|
-
activejob (= 7.2.
|
|
302
|
-
activemodel (= 7.2.
|
|
303
|
-
activerecord (= 7.2.
|
|
304
|
-
activestorage (= 7.2.
|
|
305
|
-
activesupport (= 7.2.
|
|
287
|
+
rails (7.2.2.1)
|
|
288
|
+
actioncable (= 7.2.2.1)
|
|
289
|
+
actionmailbox (= 7.2.2.1)
|
|
290
|
+
actionmailer (= 7.2.2.1)
|
|
291
|
+
actionpack (= 7.2.2.1)
|
|
292
|
+
actiontext (= 7.2.2.1)
|
|
293
|
+
actionview (= 7.2.2.1)
|
|
294
|
+
activejob (= 7.2.2.1)
|
|
295
|
+
activemodel (= 7.2.2.1)
|
|
296
|
+
activerecord (= 7.2.2.1)
|
|
297
|
+
activestorage (= 7.2.2.1)
|
|
298
|
+
activesupport (= 7.2.2.1)
|
|
306
299
|
bundler (>= 1.15.0)
|
|
307
|
-
railties (= 7.2.
|
|
308
|
-
rails-dom-testing (2.
|
|
300
|
+
railties (= 7.2.2.1)
|
|
301
|
+
rails-dom-testing (2.2.0)
|
|
309
302
|
activesupport (>= 5.0.0)
|
|
310
303
|
minitest
|
|
311
304
|
nokogiri (>= 1.6)
|
|
312
305
|
rails-html-sanitizer (1.6.2)
|
|
313
306
|
loofah (~> 2.21)
|
|
314
307
|
nokogiri (>= 1.15.7, != 1.16.7, != 1.16.6, != 1.16.5, != 1.16.4, != 1.16.3, != 1.16.2, != 1.16.1, != 1.16.0.rc1, != 1.16.0)
|
|
315
|
-
railties (7.2.
|
|
316
|
-
actionpack (= 7.2.
|
|
317
|
-
activesupport (= 7.2.
|
|
318
|
-
cgi
|
|
308
|
+
railties (7.2.2.1)
|
|
309
|
+
actionpack (= 7.2.2.1)
|
|
310
|
+
activesupport (= 7.2.2.1)
|
|
319
311
|
irb (~> 1.13)
|
|
320
312
|
rackup (>= 1.0.0)
|
|
321
313
|
rake (>= 12.2)
|
|
322
314
|
thor (~> 1.0, >= 1.2.2)
|
|
323
|
-
tsort (>= 0.2)
|
|
324
315
|
zeitwerk (~> 2.6)
|
|
325
316
|
rainbow (3.1.1)
|
|
326
|
-
rake (13.
|
|
317
|
+
rake (13.2.1)
|
|
327
318
|
rb-fsevent (0.11.2)
|
|
328
319
|
rb-inotify (0.11.1)
|
|
329
320
|
ffi (~> 1.0)
|
|
330
321
|
rbs (3.9.5)
|
|
331
322
|
logger
|
|
332
|
-
rdoc (6.
|
|
333
|
-
erb
|
|
323
|
+
rdoc (6.12.0)
|
|
334
324
|
psych (>= 4.0.0)
|
|
335
|
-
tsort
|
|
336
325
|
regexp_parser (2.9.2)
|
|
337
|
-
reline (0.6.
|
|
326
|
+
reline (0.6.0)
|
|
338
327
|
io-console (~> 0.5)
|
|
339
328
|
rexml (3.3.9)
|
|
340
329
|
rspec-core (3.13.0)
|
|
@@ -358,34 +347,23 @@ GEM
|
|
|
358
347
|
rspec-support (3.13.1)
|
|
359
348
|
rspec_junit_formatter (0.6.0)
|
|
360
349
|
rspec-core (>= 2, < 4, != 2.12.0)
|
|
361
|
-
rubocop (1.
|
|
350
|
+
rubocop (1.36.0)
|
|
362
351
|
json (~> 2.3)
|
|
363
|
-
language_server-protocol (>= 3.17.0)
|
|
364
352
|
parallel (~> 1.10)
|
|
365
|
-
parser (>= 3.
|
|
353
|
+
parser (>= 3.1.2.1)
|
|
366
354
|
rainbow (>= 2.2.2, < 4.0)
|
|
367
355
|
regexp_parser (>= 1.8, < 3.0)
|
|
368
356
|
rexml (>= 3.2.5, < 4.0)
|
|
369
|
-
rubocop-ast (>= 1.
|
|
357
|
+
rubocop-ast (>= 1.20.1, < 2.0)
|
|
370
358
|
ruby-progressbar (~> 1.7)
|
|
371
|
-
unicode-display_width (>=
|
|
372
|
-
rubocop-ast (1.
|
|
373
|
-
parser (>= 3.3.
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
rubocop (
|
|
377
|
-
rubocop-
|
|
378
|
-
rubocop (~> 1.
|
|
379
|
-
rubocop-performance (1.20.2)
|
|
380
|
-
rubocop (>= 1.48.1, < 2.0)
|
|
381
|
-
rubocop-ast (>= 1.30.0, < 2.0)
|
|
382
|
-
rubocop-rspec (2.31.0)
|
|
383
|
-
rubocop (~> 1.40)
|
|
384
|
-
rubocop-capybara (~> 2.17)
|
|
385
|
-
rubocop-factory_bot (~> 2.22)
|
|
386
|
-
rubocop-rspec_rails (~> 2.28)
|
|
387
|
-
rubocop-rspec_rails (2.29.1)
|
|
388
|
-
rubocop (~> 1.61)
|
|
359
|
+
unicode-display_width (>= 1.4.0, < 3.0)
|
|
360
|
+
rubocop-ast (1.31.3)
|
|
361
|
+
parser (>= 3.3.1.0)
|
|
362
|
+
rubocop-performance (1.15.0)
|
|
363
|
+
rubocop (>= 1.7.0, < 2.0)
|
|
364
|
+
rubocop-ast (>= 0.4.0)
|
|
365
|
+
rubocop-rspec (2.13.2)
|
|
366
|
+
rubocop (~> 1.33)
|
|
389
367
|
ruby-progressbar (1.13.0)
|
|
390
368
|
ruby_parser (3.21.0)
|
|
391
369
|
racc (~> 1.5)
|
|
@@ -415,7 +393,7 @@ GEM
|
|
|
415
393
|
websocket (~> 1.0)
|
|
416
394
|
semantic_range (3.1.0)
|
|
417
395
|
sexp_processor (4.17.1)
|
|
418
|
-
shakapacker (9.
|
|
396
|
+
shakapacker (9.3.0)
|
|
419
397
|
activesupport (>= 5.2)
|
|
420
398
|
package_json
|
|
421
399
|
rack-proxy (>= 0.6.1)
|
|
@@ -440,19 +418,18 @@ GEM
|
|
|
440
418
|
sqlite3 (1.7.3-arm64-darwin)
|
|
441
419
|
sqlite3 (1.7.3-x86_64-darwin)
|
|
442
420
|
sqlite3 (1.7.3-x86_64-linux)
|
|
443
|
-
stringio (3.1.
|
|
421
|
+
stringio (3.1.2)
|
|
444
422
|
sync (0.5.0)
|
|
445
423
|
term-ansicolor (1.10.2)
|
|
446
424
|
mize
|
|
447
425
|
tins (~> 1.0)
|
|
448
|
-
thor (1.
|
|
426
|
+
thor (1.3.2)
|
|
449
427
|
tilt (2.4.0)
|
|
450
|
-
timeout (0.4.
|
|
428
|
+
timeout (0.4.3)
|
|
451
429
|
tins (1.33.0)
|
|
452
430
|
bigdecimal
|
|
453
431
|
sync
|
|
454
|
-
traces (0.18.
|
|
455
|
-
tsort (0.2.0)
|
|
432
|
+
traces (0.18.1)
|
|
456
433
|
turbolinks (5.2.1)
|
|
457
434
|
turbolinks-source (~> 5.2)
|
|
458
435
|
turbolinks-source (5.2.0)
|
|
@@ -460,7 +437,7 @@ GEM
|
|
|
460
437
|
concurrent-ruby (~> 1.0)
|
|
461
438
|
uglifier (4.2.0)
|
|
462
439
|
execjs (>= 0.3.0, < 3)
|
|
463
|
-
unicode-display_width (2.
|
|
440
|
+
unicode-display_width (2.5.0)
|
|
464
441
|
uri (1.0.3)
|
|
465
442
|
useragent (0.16.11)
|
|
466
443
|
web-console (4.2.1)
|
|
@@ -477,14 +454,14 @@ GEM
|
|
|
477
454
|
crack (>= 0.3.2)
|
|
478
455
|
hashdiff (>= 0.4.0, < 2.0.0)
|
|
479
456
|
websocket (1.2.10)
|
|
480
|
-
websocket-driver (0.
|
|
457
|
+
websocket-driver (0.7.7)
|
|
481
458
|
base64
|
|
482
459
|
websocket-extensions (>= 0.1.0)
|
|
483
460
|
websocket-extensions (0.1.5)
|
|
484
461
|
xpath (3.2.0)
|
|
485
462
|
nokogiri (~> 1.8)
|
|
486
463
|
yard (0.9.36)
|
|
487
|
-
zeitwerk (2.7.
|
|
464
|
+
zeitwerk (2.7.1)
|
|
488
465
|
|
|
489
466
|
PLATFORMS
|
|
490
467
|
arm64-darwin-24
|
|
@@ -526,13 +503,13 @@ DEPENDENCIES
|
|
|
526
503
|
rspec-rails
|
|
527
504
|
rspec-retry
|
|
528
505
|
rspec_junit_formatter
|
|
529
|
-
rubocop (= 1.
|
|
530
|
-
rubocop-performance (
|
|
531
|
-
rubocop-rspec (
|
|
506
|
+
rubocop (= 1.36.0)
|
|
507
|
+
rubocop-performance (= 1.15.0)
|
|
508
|
+
rubocop-rspec (= 2.13.2)
|
|
532
509
|
sass-rails
|
|
533
510
|
scss_lint
|
|
534
511
|
selenium-webdriver (= 4.9.0)
|
|
535
|
-
shakapacker (= 9.
|
|
512
|
+
shakapacker (= 9.3.0)
|
|
536
513
|
spring
|
|
537
514
|
spring-watcher-listen
|
|
538
515
|
sprockets
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
# Server-side rendering with code-splitting using Loadable/Components
|
|
2
|
-
|
|
3
2
|
by ShakaCode
|
|
4
3
|
|
|
5
|
-
|
|
4
|
+
*Last updated September 19, 2022*
|
|
6
5
|
|
|
7
6
|
## Introduction
|
|
8
|
-
|
|
9
7
|
The [React library recommends](https://loadable-components.com/docs/getting-started/) the use of React.lazy for code splitting with dynamic imports except
|
|
10
8
|
when using server-side rendering. In that case, as of February 2020, they recommend [Loadable Components](https://loadable-components.com)
|
|
11
|
-
for server-side rendering with dynamic imports.
|
|
9
|
+
for server-side rendering with dynamic imports.
|
|
12
10
|
|
|
13
11
|
Note, in 2019 and prior, the code-splitting feature was implemented using `react-loadable`. The React
|
|
14
12
|
team no longer recommends that library. The new way is far preferable.
|
|
@@ -20,8 +18,7 @@ yarn add @loadable/babel-plugin @loadable/component @loadable/server @loadable/
|
|
|
20
18
|
```
|
|
21
19
|
|
|
22
20
|
### Summary
|
|
23
|
-
|
|
24
|
-
- [`@loadable/babel-plugin`](https://loadable-components.com/docs/getting-started/) - The plugin transforms your code to be ready for Server Side Rendering.
|
|
21
|
+
- [`@loadable/babel-plugin`](https://loadable-components.com/docs/getting-started/) - The plugin transforms your code to be ready for Server Side Rendering.
|
|
25
22
|
- `@loadable/component` - Main library for creating loadable components.
|
|
26
23
|
- `@loadable/server` - Has functions for collecting chunks and provide style, script, link tags for the server.
|
|
27
24
|
- `@loadable/webpack-plugin` - The plugin to create a stats file with all chunks, assets information.
|
|
@@ -38,16 +35,15 @@ See example of server configuration differences in the loadable-components [exam
|
|
|
38
35
|
for server-side rendering](https://github.com/gregberge/loadable-components/blob/master/examples/server-side-rendering/webpack.config.babel.js)
|
|
39
36
|
|
|
40
37
|
You need to configure 3 things:
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
b. server-side: `node`
|
|
38
|
+
1. `target`
|
|
39
|
+
a. client-side: `web`
|
|
40
|
+
b. server-side: `node`
|
|
45
41
|
2. `output.libraryTarget`
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
3. babel-loader options.caller = 'node' or 'web'
|
|
49
|
-
|
|
50
|
-
|
|
42
|
+
a. client-side: `undefined`
|
|
43
|
+
b. server-side: `commonjs2`
|
|
44
|
+
3. babel-loader options.caller = 'node' or 'web'
|
|
45
|
+
3. `plugins`
|
|
46
|
+
a. server-side: `new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 })`
|
|
51
47
|
|
|
52
48
|
```js
|
|
53
49
|
{
|
|
@@ -62,15 +58,14 @@ You need to configure 3 things:
|
|
|
62
58
|
Explanation:
|
|
63
59
|
|
|
64
60
|
- `target: 'node'` is required to be able to run the server bundle with the dynamic import logic on nodejs.
|
|
65
|
-
|
|
61
|
+
If that is not done, webpack will add and invoke browser-specific functions to fetch the chunks into the bundle, which throws an error on server-rendering.
|
|
66
62
|
|
|
67
63
|
- `new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 })`
|
|
68
|
-
|
|
64
|
+
The react_on_rails_pro node-renderer expects only one single server-bundle. In other words, we cannot and do not want to split the server bundle.
|
|
69
65
|
|
|
70
66
|
#### Client config
|
|
71
67
|
|
|
72
68
|
For the client config we only need to add the plugin:
|
|
73
|
-
|
|
74
69
|
```js
|
|
75
70
|
{
|
|
76
71
|
plugins: [
|
|
@@ -79,33 +74,30 @@ For the client config we only need to add the plugin:
|
|
|
79
74
|
]
|
|
80
75
|
}
|
|
81
76
|
```
|
|
82
|
-
|
|
83
77
|
This plugin collects all the information about entrypoints, chunks, and files, that have these chunks and creates a stats file during client bundle build.
|
|
84
78
|
This stats file is used later to map rendered components to file assets. While you can use any filename, our documentation will use the default name.
|
|
85
79
|
|
|
86
80
|
### Babel
|
|
87
81
|
|
|
88
82
|
Per [the docs](https://loadable-components.com/docs/babel-plugin/#transformation):
|
|
89
|
-
|
|
90
83
|
> The plugin transforms your code to be ready for Server Side Rendering
|
|
91
84
|
|
|
92
85
|
Add this to `babel.config.js`:
|
|
93
|
-
|
|
94
86
|
```js
|
|
95
87
|
{
|
|
96
88
|
"plugins": ["@loadable/babel-plugin"]
|
|
97
89
|
}
|
|
98
90
|
```
|
|
99
|
-
|
|
100
91
|
https://loadable-components.com/docs/babel-plugin/
|
|
101
92
|
|
|
93
|
+
|
|
102
94
|
### Convert components into loadable components
|
|
103
95
|
|
|
104
96
|
Instead of importing the component directly, use a dynamic import:
|
|
105
97
|
|
|
106
98
|
```js
|
|
107
|
-
import load from '@loadable/component'
|
|
108
|
-
const MyComponent = load(() => import('./MyComponent'))
|
|
99
|
+
import load from '@loadable/component'
|
|
100
|
+
const MyComponent = load(() => import('./MyComponent'))
|
|
109
101
|
```
|
|
110
102
|
|
|
111
103
|
### Resolving issue with ChunkLoadError
|
|
@@ -126,25 +118,22 @@ const consoleDebug = (fn) => {
|
|
|
126
118
|
console.debug(fn());
|
|
127
119
|
}
|
|
128
120
|
};
|
|
129
|
-
const retry = (fn, retryMessage = '', retriesLeft = 3, interval = 500) =>
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
}, interval);
|
|
146
|
-
});
|
|
147
|
-
});
|
|
121
|
+
const retry = (fn, retryMessage = '', retriesLeft = 3, interval = 500) => new Promise((resolve, reject) => {
|
|
122
|
+
fn()
|
|
123
|
+
.then(resolve)
|
|
124
|
+
.catch(() => {
|
|
125
|
+
setTimeout(() => {
|
|
126
|
+
if (retriesLeft === 1) {
|
|
127
|
+
console.warn(`Maximum retries exceeded, retryMessage: ${retryMessage}. Reloading page...`);
|
|
128
|
+
window.location.reload();
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
// Passing on "reject" is the important part
|
|
132
|
+
consoleDebug(() => `Trying request, retryMessage: ${retryMessage}, retriesLeft: ${retriesLeft - 1}`);
|
|
133
|
+
retry(fn, retryMessage, retriesLeft - 1, interval).then(resolve, reject);
|
|
134
|
+
}, interval);
|
|
135
|
+
});
|
|
136
|
+
});
|
|
148
137
|
export default retry;
|
|
149
138
|
```
|
|
150
139
|
|
|
@@ -163,21 +152,21 @@ const HomePage = loadable(() => retry(() => import('./HomePage')));
|
|
|
163
152
|
|
|
164
153
|
In the client bundle, we need to wrap the `hydrateRoot` call into a `loadableReady` function.
|
|
165
154
|
So, hydration will be fired only after all necessary chunks preloads. In this example below,
|
|
166
|
-
`ClientApp` is registering as `App`.
|
|
155
|
+
`ClientApp` is registering as `App`.
|
|
167
156
|
|
|
168
157
|
```js
|
|
169
158
|
import React from 'react';
|
|
170
159
|
import ReactOnRails from 'react-on-rails';
|
|
171
|
-
import { hydrateRoot } from 'react-dom/client'
|
|
172
|
-
import { loadableReady } from '@loadable/component'
|
|
160
|
+
import { hydrateRoot } from 'react-dom/client'
|
|
161
|
+
import { loadableReady } from '@loadable/component'
|
|
173
162
|
import App from './App';
|
|
174
163
|
|
|
175
164
|
const ClientApp = (props, railsContext, domId) => {
|
|
176
165
|
loadableReady(() => {
|
|
177
|
-
const root = document.getElementById(domId)
|
|
166
|
+
const root = document.getElementById(domId)
|
|
178
167
|
hydrateRoot(root, <App {...props} />);
|
|
179
|
-
})
|
|
180
|
-
}
|
|
168
|
+
})
|
|
169
|
+
}
|
|
181
170
|
|
|
182
171
|
ReactOnRails.register({
|
|
183
172
|
App: ClientApp,
|
|
@@ -186,20 +175,20 @@ ReactOnRails.register({
|
|
|
186
175
|
|
|
187
176
|
#### Server
|
|
188
177
|
|
|
189
|
-
The purpose of the server function is to collect all rendered chunks and pass them as script, link,
|
|
190
|
-
style tags to the Rails view. In this example below, `ServerApp` is registering as `App`.
|
|
178
|
+
The purpose of the server function is to collect all rendered chunks and pass them as script, link,
|
|
179
|
+
style tags to the Rails view. In this example below, `ServerApp` is registering as `App`.
|
|
191
180
|
|
|
192
181
|
```js
|
|
193
182
|
import React from 'react';
|
|
194
183
|
import ReactOnRails from 'react-on-rails';
|
|
195
|
-
import { ChunkExtractor } from '@loadable/server'
|
|
196
|
-
import App from './App'
|
|
197
|
-
import path from 'path'
|
|
184
|
+
import { ChunkExtractor } from '@loadable/server'
|
|
185
|
+
import App from './App'
|
|
186
|
+
import path from 'path'
|
|
198
187
|
|
|
199
188
|
const ServerApp = (props, railsContext) => {
|
|
200
189
|
// This loadable-stats file was generated by `LoadablePlugin` in client webpack config.
|
|
201
190
|
// You must configure the path to resolve per your setup. If you are copying the file to
|
|
202
|
-
// a remote server, the file should be a sibling of this file.
|
|
191
|
+
// a remote server, the file should be a sibling of this file.
|
|
203
192
|
// __dirname is going to be the directory where the server-bundle.js exists
|
|
204
193
|
// Note, React on Rails Pro automatically copies the loadable-stats.json to the same place as the
|
|
205
194
|
// server-bundle.js. Thus, the __dirname of this code is where we can find loadable-stats.json.
|
|
@@ -209,10 +198,10 @@ const ServerApp = (props, railsContext) => {
|
|
|
209
198
|
// This object is used to search filenames by corresponding chunk names.
|
|
210
199
|
// See https://loadable-components.com/docs/api-loadable-server/#chunkextractor
|
|
211
200
|
// for the entryPoints, pass an array of all your entryPoints using dynamic imports
|
|
212
|
-
const extractor = new ChunkExtractor({ statsFile, entrypoints: ['client-bundle'] })
|
|
201
|
+
const extractor = new ChunkExtractor({ statsFile, entrypoints: ['client-bundle'] })
|
|
213
202
|
|
|
214
203
|
// It creates the wrapper `ChunkExtractorManager` around `App` to collect chunk names of rendered components.
|
|
215
|
-
const jsx = extractor.collectChunks(<App {...props} railsContext={railsContext} />)
|
|
204
|
+
const jsx = extractor.collectChunks(<App {...props} railsContext={railsContext} />)
|
|
216
205
|
|
|
217
206
|
const componentHtml = renderToString(jsx);
|
|
218
207
|
|
|
@@ -222,8 +211,8 @@ const ServerApp = (props, railsContext) => {
|
|
|
222
211
|
// Returns all the files with rendered chunks for furture insert into rails view.
|
|
223
212
|
linkTags: extractor.getLinkTags(),
|
|
224
213
|
styleTags: extractor.getStyleTags(),
|
|
225
|
-
scriptTags: extractor.getScriptTags()
|
|
226
|
-
}
|
|
214
|
+
scriptTags: extractor.getScriptTags()
|
|
215
|
+
}
|
|
227
216
|
};
|
|
228
217
|
};
|
|
229
218
|
|
|
@@ -235,7 +224,6 @@ ReactOnRails.register({
|
|
|
235
224
|
## Configure react_on_rails_pro
|
|
236
225
|
|
|
237
226
|
### React on Rails Pro
|
|
238
|
-
|
|
239
227
|
You must set `config.assets_top_copy` so that the node-renderer will have access to the loadable-stats.json.
|
|
240
228
|
|
|
241
229
|
```ruby
|
|
@@ -245,16 +233,15 @@ You must set `config.assets_top_copy` so that the node-renderer will have access
|
|
|
245
233
|
Your server rendering code, per the above, will find this file like this:
|
|
246
234
|
|
|
247
235
|
```js
|
|
248
|
-
const statsFile = path.resolve(__dirname, 'loadable-stats.json');
|
|
249
|
-
```
|
|
236
|
+
const statsFile = path.resolve(__dirname, 'loadable-stats.json');
|
|
237
|
+
```
|
|
250
238
|
|
|
251
239
|
Note, if `__dirname` is not working in your webpack build, that's because you didn't set `node: false`
|
|
252
240
|
in your webpack configuration. That turns off the polyfills for things like `__dirname`.
|
|
253
241
|
|
|
254
|
-
### Node Renderer
|
|
255
242
|
|
|
243
|
+
### Node Renderer
|
|
256
244
|
In your `node-renderer.js` file which runs node renderer, you need to specify `supportModules` options as follows:
|
|
257
|
-
|
|
258
245
|
```js
|
|
259
246
|
const path = require('path');
|
|
260
247
|
const env = process.env;
|
|
@@ -274,7 +261,7 @@ reactOnRailsProNodeRenderer(config);
|
|
|
274
261
|
```erb
|
|
275
262
|
<% res = react_component_hash("App", props: {}, prerender: true) %>
|
|
276
263
|
<%= content_for :link_tags, res['linkTags'] %>
|
|
277
|
-
<%= content_for :style_tags, res['styleTags'] %>
|
|
264
|
+
<%= content_for :style_tags, res['styleTags'] %>
|
|
278
265
|
|
|
279
266
|
<%= res['componentHtml'].html_safe %>
|
|
280
267
|
|
|
@@ -282,7 +269,6 @@ reactOnRailsProNodeRenderer(config);
|
|
|
282
269
|
```
|
|
283
270
|
|
|
284
271
|
## Making HMR Work
|
|
285
|
-
|
|
286
272
|
To make HMR work, it's best to disable loadable-components when using the Dev Server.
|
|
287
273
|
Note: you will need access to our **private** React on Rails Pro repository to open the following links.
|
|
288
274
|
|
|
@@ -291,11 +277,9 @@ Take a look at the code searches for ['imports-loadable'](https://github.com/sha
|
|
|
291
277
|
The general concept is that we have a non-loadable, HMR-ready, file that substitutes for the loadable-enabled one, with the suffixes `imports-hmr.js` instead of `imports-loadable.js`
|
|
292
278
|
|
|
293
279
|
### Webpack configuration
|
|
294
|
-
|
|
295
280
|
Use the [NormalModuleReplacement plugin](https://webpack.js.org/plugins/normal-module-replacement-plugin/):
|
|
296
281
|
|
|
297
282
|
[code](https://github.com/shakacode/react_on_rails_pro/blob/a361f4e163b9170f180ae07ee312fb9b4c719fc3/spec/dummy/config/webpack/environment.js#L81-L91)
|
|
298
|
-
|
|
299
283
|
```js
|
|
300
284
|
if (isWebpackDevServer) {
|
|
301
285
|
environment.plugins.append(
|
|
@@ -321,7 +305,7 @@ Note: you will need access to our **private** React on Rails Pro repository to o
|
|
|
321
305
|
### Client-Side Startup
|
|
322
306
|
|
|
323
307
|
- [spec/dummy/client/app/loadable/loadable-client.imports-hmr.js](https://github.com/shakacode/react_on_rails_pro/blob/master/spec/dummy/client/app/loadable/loadable-client.imports-hmr.js)
|
|
324
|
-
- [spec/dummy/client/app/loadable/loadable-client.imports-loadable.
|
|
308
|
+
- [spec/dummy/client/app/loadable/loadable-client.imports-loadable.js](https://github.com/shakacode/react_on_rails_pro/blob/master/spec/dummy/client/app/loadable/loadable-client.imports-loadable.js)
|
|
325
309
|
|
|
326
310
|
### Server-Side Startup
|
|
327
311
|
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: react_on_rails_pro
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 16.2.0.
|
|
4
|
+
version: 16.2.0.test.3
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Justin Gordon
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: exe
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2025-12-
|
|
11
|
+
date: 2025-12-07 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: addressable
|
|
@@ -128,14 +128,14 @@ dependencies:
|
|
|
128
128
|
requirements:
|
|
129
129
|
- - '='
|
|
130
130
|
- !ruby/object:Gem::Version
|
|
131
|
-
version: 16.2.0.
|
|
131
|
+
version: 16.2.0.test.3
|
|
132
132
|
type: :runtime
|
|
133
133
|
prerelease: false
|
|
134
134
|
version_requirements: !ruby/object:Gem::Requirement
|
|
135
135
|
requirements:
|
|
136
136
|
- - '='
|
|
137
137
|
- !ruby/object:Gem::Version
|
|
138
|
-
version: 16.2.0.
|
|
138
|
+
version: 16.2.0.test.3
|
|
139
139
|
- !ruby/object:Gem::Dependency
|
|
140
140
|
name: bundler
|
|
141
141
|
requirement: !ruby/object:Gem::Requirement
|