vue-ssr-lite 0.1.13 → 0.1.14
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.
- package/README.md +13 -19
- package/dist/SsrReactivityRuntime.d.ts +8 -1
- package/dist/SsrReactivityRuntime.d.ts.map +1 -1
- package/dist/SsrRequestResolution.d.ts +3 -1
- package/dist/SsrRequestResolution.d.ts.map +1 -1
- package/dist/chunks/SsrReactivityRuntime-CB3IYMti.mjs +28 -0
- package/dist/client.mjs +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +1 -1
- package/dist/chunks/SsrReactivityRuntime-CUbPx7ew.mjs +0 -9
package/README.md
CHANGED
|
@@ -971,29 +971,23 @@ writes into a shared store that a **sibling** component reads — because Vue do
|
|
|
971
971
|
not block a sibling's render on an earlier sibling's `onServerPrefetch`. The
|
|
972
972
|
sibling renders before the store is populated.
|
|
973
973
|
|
|
974
|
-
|
|
974
|
+
**Applications write no orchestration for this.** Reconcile resolved data into
|
|
975
|
+
the store with `ssrWatch` exactly as you already would:
|
|
975
976
|
|
|
976
977
|
```ts
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
onServerPrefetch(async () => {
|
|
982
|
-
const data = await load()
|
|
983
|
-
store.set(key, data)
|
|
984
|
-
// Populated asynchronously, after the sibling already rendered: ask for one
|
|
985
|
-
// more pass. Inert in the browser.
|
|
986
|
-
if (resolution?.server && !synchronous) resolution.requestAdditionalPass()
|
|
987
|
-
})
|
|
988
|
-
synchronous = false
|
|
978
|
+
const { result } = useMyQuery(vars, { ssr: true })
|
|
979
|
+
ssrWatch(() => result.value, (data) => {
|
|
980
|
+
if (data) store.set(key, data)
|
|
981
|
+
}, { immediate: true })
|
|
989
982
|
```
|
|
990
983
|
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
`
|
|
995
|
-
|
|
996
|
-
|
|
984
|
+
`ssrWatch` automatically requests one more render pass when it fires from the
|
|
985
|
+
awaited prefetch (after a sibling already rendered). On the resumed pass the
|
|
986
|
+
data is warm in the API client's request cache — `vue-apollo-client` settles it
|
|
987
|
+
synchronously at setup — so the same `ssrWatch` runs on its immediate tick, the
|
|
988
|
+
sibling sees the store, and no further pass is requested. Bounded, and each
|
|
989
|
+
operation runs exactly once. Nothing app-specific, and nothing to repeat per
|
|
990
|
+
component or per project.
|
|
997
991
|
|
|
998
992
|
## SSR-safe reactivity
|
|
999
993
|
|
|
@@ -39,6 +39,12 @@ export type SsrWatchOptions<Immediate extends boolean = boolean> = Omit<WatchOpt
|
|
|
39
39
|
* Identical semantics to Vue's `watch` otherwise: pass `{ immediate: true }` to
|
|
40
40
|
* run once on setup, and use the returned handle to stop it. Because the flush
|
|
41
41
|
* is synchronous, avoid mutating the watched source from inside the callback.
|
|
42
|
+
*
|
|
43
|
+
* When the callback runs on the server AFTER creation (a dependency settled
|
|
44
|
+
* during the render, e.g. an awaited query result), it automatically requests
|
|
45
|
+
* one more render pass through the resolution contract so consumers that read
|
|
46
|
+
* the mutated state elsewhere reflect it. Applications write no SSR
|
|
47
|
+
* orchestration for this — it is a property of the primitive.
|
|
42
48
|
*/
|
|
43
49
|
export declare function ssrWatch<T, Immediate extends boolean = false>(source: WatchSource<T>, callback: WatchCallback<T, Immediate extends true ? T | undefined : T>, options?: SsrWatchOptions<Immediate>): WatchStopHandle;
|
|
44
50
|
export declare function ssrWatch<T extends readonly unknown[], Immediate extends boolean = false>(source: readonly [...T] | (() => T), callback: WatchCallback<T, Immediate extends true ? T | undefined : T>, options?: SsrWatchOptions<Immediate>): WatchStopHandle;
|
|
@@ -46,7 +52,8 @@ export declare function ssrWatch<T extends readonly unknown[], Immediate extends
|
|
|
46
52
|
* `watchEffect`, pinned to `flush: 'sync'` so the effect is active during SSR.
|
|
47
53
|
* The effect runs immediately and re-runs synchronously whenever a tracked
|
|
48
54
|
* dependency changes — including changes that happen while the server render is
|
|
49
|
-
* still in progress.
|
|
55
|
+
* still in progress. Post-creation server runs request one more render pass
|
|
56
|
+
* (see {@link ssrWatch}).
|
|
50
57
|
*/
|
|
51
58
|
export declare const ssrWatchEffect: (effect: Parameters<typeof watchEffect>[0], options?: Omit<NonNullable<Parameters<typeof watchEffect>[1]>, "flush">) => WatchStopHandle;
|
|
52
59
|
//# sourceMappingURL=SsrReactivityRuntime.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SsrReactivityRuntime.d.ts","sourceRoot":"","sources":["../src/SsrReactivityRuntime.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"SsrReactivityRuntime.d.ts","sourceRoot":"","sources":["../src/SsrReactivityRuntime.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,WAAW,EACX,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,eAAe,EACrB,MAAM,KAAK,CAAA;AAwBZ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,MAAM,MAAM,eAAe,CAAC,SAAS,SAAS,OAAO,GAAG,OAAO,IAAI,IAAI,CACrE,YAAY,CAAC,SAAS,CAAC,EACvB,OAAO,CACR,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,SAAS,SAAS,OAAO,GAAG,KAAK,EAC3D,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,EACtB,QAAQ,EAAE,aAAa,CAAC,CAAC,EAAE,SAAS,SAAS,IAAI,GAAG,CAAC,GAAG,SAAS,GAAG,CAAC,CAAC,EACtE,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,GACnC,eAAe,CAAA;AAClB,wBAAgB,QAAQ,CAAC,CAAC,SAAS,SAAS,OAAO,EAAE,EAAE,SAAS,SAAS,OAAO,GAAG,KAAK,EACtF,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,EACnC,QAAQ,EAAE,aAAa,CAAC,CAAC,EAAE,SAAS,SAAS,IAAI,GAAG,CAAC,GAAG,SAAS,GAAG,CAAC,CAAC,EACtE,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,GACnC,eAAe,CAAA;AAkBlB;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,GACzB,QAAQ,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,CAAC,EACzC,UAAU,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,KACtE,eAaF,CAAA"}
|
|
@@ -45,7 +45,9 @@ export interface SsrRequestResolution {
|
|
|
45
45
|
/**
|
|
46
46
|
* Request one additional render pass even when no tracked promise is pending.
|
|
47
47
|
* Use when work mutated shared state synchronously in a way the current tree
|
|
48
|
-
* did not observe. Honoured up to the configured pass bound.
|
|
48
|
+
* did not observe. Honoured up to the configured pass bound. The {@link
|
|
49
|
+
* ssrWatch} primitive calls this automatically, so applications rarely call it
|
|
50
|
+
* directly.
|
|
49
51
|
*/
|
|
50
52
|
requestAdditionalPass(): void;
|
|
51
53
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SsrRequestResolution.d.ts","sourceRoot":"","sources":["../src/SsrRequestResolution.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,KAAK,CAAA;AAE/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,MAAM,WAAW,oBAAoB;IACnC,+EAA+E;IAC/E,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAA;IACxB,iEAAiE;IACjE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB;;;;;OAKG;IACH,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAA;IACtC
|
|
1
|
+
{"version":3,"file":"SsrRequestResolution.d.ts","sourceRoot":"","sources":["../src/SsrRequestResolution.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,KAAK,CAAA;AAE/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,MAAM,WAAW,oBAAoB;IACnC,+EAA+E;IAC/E,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAA;IACxB,iEAAiE;IACjE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB;;;;;OAKG;IACH,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAA;IACtC;;;;;;OAMG;IACH,qBAAqB,IAAI,IAAI,CAAA;CAC9B;AAED;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,EAE9B,YAAY,CAAC,oBAAoB,CAAC,CAAA;AAEvC;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,gBAAgB,QAAO,oBAAoB,GAAG,IACQ,CAAA;AAEnE,MAAM,WAAW,uBAAwB,SAAQ,oBAAoB;IACnE,wEAAwE;IACxE,SAAS,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,+EAA+E;IAC/E,WAAW,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE,CAAA;IACjC,wEAAwE;IACxE,uBAAuB,IAAI,OAAO,CAAA;IAClC;;;OAGG;IACH,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,WAAW,GAAG,OAAO,CAAC,OAAO,CAAC,CAAA;IACjE,qEAAqE;IACrE,OAAO,IAAI,IAAI,CAAA;CAChB;AAYD;;;;GAIG;AACH,eAAO,MAAM,6BAA6B,GACxC,SAAQ,OAAuC,KAC9C,uBA4EF,CAAA"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { watch as i, watchEffect as f, hasInjectionContext as p, inject as d } from "vue";
|
|
2
|
+
import { S as h } from "./SsrApplicationRuntime-lMR_sMdk.mjs";
|
|
3
|
+
const a = () => p() ? d(h, null) : null;
|
|
4
|
+
function m(r, n, s) {
|
|
5
|
+
const t = a();
|
|
6
|
+
let e = !1;
|
|
7
|
+
const o = i(r, (...l) => {
|
|
8
|
+
const u = n(...l);
|
|
9
|
+
return e && t?.server && t.requestAdditionalPass(), u;
|
|
10
|
+
}, { ...s, flush: "sync" });
|
|
11
|
+
return e = !0, o;
|
|
12
|
+
}
|
|
13
|
+
const w = (r, n) => {
|
|
14
|
+
const s = a();
|
|
15
|
+
let t = !1;
|
|
16
|
+
const e = f(
|
|
17
|
+
((c) => {
|
|
18
|
+
const o = r(c);
|
|
19
|
+
return t && s?.server && s.requestAdditionalPass(), o;
|
|
20
|
+
}),
|
|
21
|
+
{ ...n, flush: "sync" }
|
|
22
|
+
);
|
|
23
|
+
return t = !0, e;
|
|
24
|
+
};
|
|
25
|
+
export {
|
|
26
|
+
w as a,
|
|
27
|
+
m as s
|
|
28
|
+
};
|
package/dist/client.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { c as i } from "./chunks/SsrApplicationRuntime-lMR_sMdk.mjs";
|
|
2
2
|
import { S as E, u as v } from "./chunks/SsrApplicationRuntime-lMR_sMdk.mjs";
|
|
3
3
|
import { g as d } from "./chunks/SsrSerialization-k-3aCFYt.mjs";
|
|
4
|
-
import { s as g, a as R } from "./chunks/SsrReactivityRuntime-
|
|
4
|
+
import { s as g, a as R } from "./chunks/SsrReactivityRuntime-CB3IYMti.mjs";
|
|
5
5
|
const u = (r, e, o, s) => ({
|
|
6
6
|
requestId: `${o}-${Date.now().toString(36)}`,
|
|
7
7
|
url: e,
|
package/dist/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { a as o, b as S, S as n, c as i, d as c, e as l, f as R, u as f } from "./chunks/SsrApplicationRuntime-lMR_sMdk.mjs";
|
|
2
|
-
import { s as d, a as E } from "./chunks/SsrReactivityRuntime-
|
|
2
|
+
import { s as d, a as E } from "./chunks/SsrReactivityRuntime-CB3IYMti.mjs";
|
|
3
3
|
import { e as m, g as u, r as x, s as _, a as C } from "./chunks/SsrSerialization-k-3aCFYt.mjs";
|
|
4
4
|
import { c as H } from "./chunks/SsrDiagnosticsRuntime-B5VbSgsA.mjs";
|
|
5
5
|
const e = (s) => s, r = (s) => s;
|
package/package.json
CHANGED