what-server 0.5.1 → 0.5.4
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 +136 -0
- package/package.json +8 -4
package/README.md
ADDED
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
# what-server
|
|
2
|
+
|
|
3
|
+
Server-side rendering, streaming, islands architecture, and static site generation for [What Framework](https://whatfw.com). Zero JavaScript shipped by default -- islands opt in to client interactivity.
|
|
4
|
+
|
|
5
|
+
## Install
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install what-server what-core
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
Or use via the main package:
|
|
12
|
+
|
|
13
|
+
```js
|
|
14
|
+
import { renderToString, renderToStream } from 'what-framework/server';
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
## Render to String
|
|
18
|
+
|
|
19
|
+
```js
|
|
20
|
+
import { renderToString } from 'what-server';
|
|
21
|
+
import { h } from 'what-core';
|
|
22
|
+
|
|
23
|
+
function App() {
|
|
24
|
+
return h('div', null,
|
|
25
|
+
h('h1', null, 'Hello from the server'),
|
|
26
|
+
h('p', null, 'This page ships zero JavaScript.')
|
|
27
|
+
);
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
const html = renderToString(h(App));
|
|
31
|
+
// <div><h1>Hello from the server</h1><p>This page ships zero JavaScript.</p></div>
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## Streaming SSR
|
|
35
|
+
|
|
36
|
+
```js
|
|
37
|
+
import { renderToStream } from 'what-server';
|
|
38
|
+
|
|
39
|
+
for await (const chunk of renderToStream(h(App))) {
|
|
40
|
+
response.write(chunk);
|
|
41
|
+
}
|
|
42
|
+
response.end();
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
## Page Modes
|
|
46
|
+
|
|
47
|
+
```js
|
|
48
|
+
import { definePage } from 'what-server';
|
|
49
|
+
|
|
50
|
+
export const page = definePage({
|
|
51
|
+
mode: 'static', // Pre-render at build time (default)
|
|
52
|
+
// mode: 'server' // Render on each request
|
|
53
|
+
// mode: 'client' // Render in browser (SPA)
|
|
54
|
+
// mode: 'hybrid' // Static shell + interactive islands
|
|
55
|
+
});
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
## Static Generation
|
|
59
|
+
|
|
60
|
+
```js
|
|
61
|
+
import { generateStaticPage } from 'what-server';
|
|
62
|
+
|
|
63
|
+
const html = generateStaticPage({
|
|
64
|
+
component: App,
|
|
65
|
+
title: 'My Page',
|
|
66
|
+
meta: { description: 'A statically generated page' },
|
|
67
|
+
mode: 'static',
|
|
68
|
+
});
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
## Server Components
|
|
72
|
+
|
|
73
|
+
Mark components as server-only. They render on the server and ship no JavaScript to the client.
|
|
74
|
+
|
|
75
|
+
```js
|
|
76
|
+
import { server } from 'what-server';
|
|
77
|
+
|
|
78
|
+
const Header = server(({ title }) => h('header', null, title));
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
## Server Actions
|
|
82
|
+
|
|
83
|
+
```js
|
|
84
|
+
import { action, useAction, formAction, useFormAction } from 'what-server/actions';
|
|
85
|
+
|
|
86
|
+
// Define a server action
|
|
87
|
+
const addTodo = action(async (text) => {
|
|
88
|
+
await db.todos.create({ text });
|
|
89
|
+
});
|
|
90
|
+
|
|
91
|
+
// Use in a component
|
|
92
|
+
function TodoForm() {
|
|
93
|
+
const { execute, isPending } = useAction(addTodo);
|
|
94
|
+
return h('button', { onclick: () => execute('New todo') }, 'Add');
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
// Form action
|
|
98
|
+
const submitForm = formAction(async (formData) => {
|
|
99
|
+
const email = formData.get('email');
|
|
100
|
+
await subscribe(email);
|
|
101
|
+
});
|
|
102
|
+
```
|
|
103
|
+
|
|
104
|
+
## Sub-path Exports
|
|
105
|
+
|
|
106
|
+
| Path | Contents |
|
|
107
|
+
|---|---|
|
|
108
|
+
| `what-server` | `renderToString`, `renderToStream`, `definePage`, `generateStaticPage`, `server` |
|
|
109
|
+
| `what-server/islands` | Islands hydration runtime |
|
|
110
|
+
| `what-server/actions` | Server actions and mutations |
|
|
111
|
+
|
|
112
|
+
## API
|
|
113
|
+
|
|
114
|
+
| Export | Description |
|
|
115
|
+
|---|---|
|
|
116
|
+
| `renderToString(vnode)` | Render a component tree to an HTML string |
|
|
117
|
+
| `renderToStream(vnode)` | Render as an async iterator for streaming |
|
|
118
|
+
| `definePage(config)` | Define page rendering mode and metadata |
|
|
119
|
+
| `generateStaticPage(page, data?)` | Generate a full HTML document |
|
|
120
|
+
| `server(Component)` | Mark a component as server-only |
|
|
121
|
+
| `action(fn)` | Define a server action |
|
|
122
|
+
| `formAction(fn)` | Define a form-based server action |
|
|
123
|
+
| `useAction(action)` | Hook to call a server action |
|
|
124
|
+
| `useFormAction(action)` | Hook for form server actions |
|
|
125
|
+
| `useOptimistic(state)` | Optimistic UI updates |
|
|
126
|
+
| `useMutation(fn)` | Mutation with loading/error states |
|
|
127
|
+
| `invalidatePath(path)` | Revalidate a page path |
|
|
128
|
+
|
|
129
|
+
## Links
|
|
130
|
+
|
|
131
|
+
- [Documentation](https://whatfw.com)
|
|
132
|
+
- [GitHub](https://github.com/zvndev/what-fw)
|
|
133
|
+
|
|
134
|
+
## License
|
|
135
|
+
|
|
136
|
+
MIT
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "what-server",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.4",
|
|
4
4
|
"description": "What Framework - SSR, islands architecture, static generation",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "src/index.js",
|
|
@@ -32,10 +32,14 @@
|
|
|
32
32
|
"author": "",
|
|
33
33
|
"license": "MIT",
|
|
34
34
|
"peerDependencies": {
|
|
35
|
-
"what-core": "^0.5.
|
|
35
|
+
"what-core": "^0.5.3"
|
|
36
36
|
},
|
|
37
37
|
"repository": {
|
|
38
38
|
"type": "git",
|
|
39
|
-
"url": "
|
|
40
|
-
}
|
|
39
|
+
"url": "https://github.com/zvndev/what-fw"
|
|
40
|
+
},
|
|
41
|
+
"bugs": {
|
|
42
|
+
"url": "https://github.com/zvndev/what-fw/issues"
|
|
43
|
+
},
|
|
44
|
+
"homepage": "https://whatfw.com"
|
|
41
45
|
}
|