svelte-on-rails 3.1.0 → 3.1.1
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
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: a8c8933b55b56b0a2adcc4c06542b0a9078b8e36408ae6afc9316289f2f2f924
|
4
|
+
data.tar.gz: 777395f46db7c8e2c88df9090b646088e39cb10cf9c2881ff7cd2f7a78dc8065
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 803bb9b519cc14baa104b41689c56dbe168fae17a1ec540a07dedcb8acc1200418f231446fe6ccd611f84d1c0607ffa335a312bed905512b5a95e12592bb6805
|
7
|
+
data.tar.gz: 51d06bdd84b8272d5af59bd9bbc4efd407d39a9b57c343a8d96a68e504770a135a951e18defa50b18e95443c319194c33e31287d922d63e7af4520f35345b85a
|
data/README.md
CHANGED
@@ -68,9 +68,8 @@ Thanks to [shakacode](https://github.com/shakacode/react_on_rails)
|
|
68
68
|
and [ElMassimo](https://github.com/ElMassimo) for inspiring and helping me with their gems.
|
69
69
|
|
70
70
|
**STATUS:** This gem is in the early stages of development, but is ready for use.
|
71
|
-
It has nearly 100% test coverage
|
72
|
-
|
73
|
-
of this company.
|
71
|
+
It has nearly 100% test coverage, with all tests passing. It has been in use since May/June 2025
|
72
|
+
on the systems of my two biggest customers.
|
74
73
|
|
75
74
|
If you have issues, please open one, and contributors are welcome!
|
76
75
|
|
@@ -81,6 +80,7 @@ If you have issues, please open one, and contributors are welcome!
|
|
81
80
|
- ruby 3.2.2 and rails 7.1
|
82
81
|
- ruby 2.7.5 and rails 6.1
|
83
82
|
- vite@6 (v7 not supported, see issues)
|
83
|
+
- turbolinks and hotwired/turbo
|
84
84
|
- vite_rails (the installer will install it by option --full or --vite)
|
85
85
|
- svelte v5 (see: [how to install svelte on rails/vite](https://dev.to/chmich/setup-inertia-and-svelte-on-rails-7-3glk))
|
86
86
|
- turbo (recommended / [how to install turbo on rails](https://github.com/hotwired/turbo-rails?tab=readme-ov-file#installation))
|
@@ -262,10 +262,8 @@ after any `*.svelte` file within the configured `components_folder` changed.
|
|
262
262
|
|
263
263
|
`ssr: :auto` is the default option, as set on config file and can be overridden on the view helper.
|
264
264
|
|
265
|
-
Works with `hotwired/turbo` only
|
266
|
-
|
267
265
|
By passing the `ssr: :auto` option to the view helper,
|
268
|
-
it checks if the request is an initial request (request header `X-Turbo-Request-ID` is present):
|
266
|
+
it checks if the request is an initial request (request header `X-Turbo-Request-ID` is present // configurable by `non_ssr_request_header`):
|
269
267
|
|
270
268
|
On Initial-Request, it adds the attribute `data-svelte-on-rails-initialize-action="hydrate"` and
|
271
269
|
returns a server side rendered component that will be hydrated on the frontend by the npm package.
|
@@ -280,6 +278,20 @@ loaded on very first load to the frontend, then the most work is done
|
|
280
278
|
in frontend and the server is relieved, except on initial request.
|
281
279
|
You will see no unpleasant «blink» on the page.
|
282
280
|
|
281
|
+
**Turbolinks**
|
282
|
+
|
283
|
+
If you are working on turbolinks, you can config the header or set something like
|
284
|
+
|
285
|
+
```
|
286
|
+
document.addEventListener('turbolinks:request-start', (event) => {
|
287
|
+
var xhr = event.data.xhr
|
288
|
+
xhr.setRequestHeader("X-Turbo-Request-ID", "any-content-for-skip-svelte-ssr")
|
289
|
+
});
|
290
|
+
```
|
291
|
+
|
292
|
+
to your javascript file.
|
293
|
+
|
294
|
+
|
283
295
|
**Tip: Performance optimisation for dropdowns**
|
284
296
|
|
285
297
|
For example, with dropdowns, you will never see the unpleasant «blink» effect because
|
@@ -83,6 +83,15 @@ module SvelteOnRails
|
|
83
83
|
end
|
84
84
|
end
|
85
85
|
|
86
|
+
def non_ssr_request_header
|
87
|
+
rss = @configs['non_ssr_request_header']
|
88
|
+
if rss.present?
|
89
|
+
rss
|
90
|
+
else
|
91
|
+
'X-Turbo-Request-ID'
|
92
|
+
end
|
93
|
+
end
|
94
|
+
|
86
95
|
# def dist_folder(app_root = nil)
|
87
96
|
# rails_root(app_root).join('public', 'svelteDist')
|
88
97
|
# end
|
@@ -26,7 +26,12 @@ module SvelteOnRails
|
|
26
26
|
unless [true, false, :auto].include?(rss)
|
27
27
|
raise "Only true, false or auto are allowed for the argument #ssr"
|
28
28
|
end
|
29
|
-
|
29
|
+
|
30
|
+
ssr = if [:auto, 'auto'].include?(rss)
|
31
|
+
request.headers[conf.non_ssr_request_header].blank?
|
32
|
+
else
|
33
|
+
rss
|
34
|
+
end
|
30
35
|
|
31
36
|
hydrate = if props.key?(:hydrate)
|
32
37
|
props[:hydrate]
|
@@ -11,6 +11,11 @@ ssr: :auto
|
|
11
11
|
# :auto: render server side if request is initial request (works only with turbo, because it checks for the X-Turbo-Request-ID header)
|
12
12
|
# when not server-side rendered the components must be built as custom elements, see node-package @csedl/svelte-on-rails
|
13
13
|
|
14
|
+
non_ssr_request_header: 'X-Turbo-Request-ID'
|
15
|
+
# when ssr: :auto =>
|
16
|
+
# when this header contains any value (not blank), we are skipping server-side rendering
|
17
|
+
# when this header is empty we assume initial request and doing server-side rendering
|
18
|
+
|
14
19
|
development:
|
15
20
|
watch_changes: true
|
16
21
|
# Check on every request if any file within the svelte components folder have changed, for recompiling
|