Skip to content

Commit 47eedc4

Browse files
SaltyAomSaltyAom
committed
📘 doc: add migration from x guide
1 parent 763a6ea commit 47eedc4

18 files changed

+4689
-62
lines changed

‎bun.lock‎

Lines changed: 167 additions & 46 deletions
Large diffs are not rendered by default.

‎docs/.vitepress/config.ts‎

Lines changed: 31 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -205,6 +205,7 @@ export default defineConfig({
205205
sidebar: [
206206
{
207207
text: 'Getting Started',
208+
collapsed: true,
208209
items: [
209210
{
210211
text: 'At Glance',
@@ -216,7 +217,22 @@ export default defineConfig({
216217
},
217218
{
218219
text: 'Tutorial',
219-
link: '/tutorial'
220+
link: '/tutorial',
221+
collapsed: true,
222+
items: [
223+
{
224+
text: 'From Express',
225+
link: '/migrate/from-express'
226+
},
227+
{
228+
text: 'From Fastify',
229+
link: '/migrate/from-fastify'
230+
},
231+
{
232+
text: 'From Hono',
233+
link: '/migrate/from-hono'
234+
}
235+
]
220236
},
221237
{
222238
text: 'Key Concept',
@@ -267,36 +283,36 @@ export default defineConfig({
267283
link: '/patterns/configuration'
268284
},
269285
{
270-
text: "Deploy to Production",
271-
link: "/patterns/deploy",
286+
text: 'Cookie',
287+
link: '/patterns/cookie'
272288
},
273289
{
274-
text: 'Type',
275-
link: '/patterns/type'
290+
text: "Deploy to Production",
291+
link: "/patterns/deploy",
276292
},
277293
{
278294
text: 'Macro',
279295
link: '/patterns/macro'
280296
},
281297
{
282-
text: 'Cookie',
283-
link: '/patterns/cookie'
298+
text: 'Mount',
299+
link: '/patterns/mount'
284300
},
285301
{
286-
text: 'Web Socket',
287-
link: '/patterns/websocket'
302+
text: 'Trace',
303+
link: '/patterns/trace'
288304
},
289305
{
290-
text: 'Unit Test',
291-
link: '/patterns/unit-test'
306+
text: 'Type',
307+
link: '/patterns/type'
292308
},
293309
{
294-
text: 'Mount',
295-
link: '/patterns/mount'
310+
text: 'Unit Test',
311+
link: '/patterns/unit-test'
296312
},
297313
{
298-
text: 'Trace',
299-
link: '/patterns/trace'
314+
text: 'Web Socket',
315+
link: '/patterns/websocket'
300316
}
301317
]
302318
},

‎docs/.vitepress/theme/layout.vue‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -171,7 +171,16 @@ router.onAfterRouteChange = () => {
171171
}
172172
173173
.medium-zoom-overlay {
174+
will-change: transform;
174175
backdrop-filter: blur(2.5rem) brightness(1.1);
176+
z-index: 998;
177+
}
178+
179+
.medium-zoom-image {
180+
z-index: 999;
181+
-webkit-transform: translateZ(0);
182+
-webkit-backface-visibility: hidden;
183+
-webkit-transform-style: preserve-3d;
175184
}
176185
177186
html.dark .medium-zoom-overlay {

‎docs/components/fern/benchmark-express.vue‎

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
<template>
2+
<div class="result">
3+
<article>
4+
<ol class="graph">
5+
<li>
6+
<h6>
7+
<span
8+
class="!text-xl !font-semibold !text-transparent !ml-0 text-gradient from-violet-500 to-sky-500"
9+
>
10+
Elysia
11+
</span>
12+
</h6>
13+
<div
14+
class="w-full bg-gradient-to-r from-violet-500 to-fuchsia-400 !text-white"
15+
>
16+
2,454,631 reqs/s
17+
</div>
18+
</li>
19+
<li>
20+
<h6>Express</h6>
21+
<div style="width: 4.61%" />
22+
<p>113,117</p>
23+
</li>
24+
</ol>
25+
<p class="text-sm !m-0 text-gray-400 !leading-normal">
26+
Measured in requests/second. Result from
27+
<a
28+
href="https://www.techempower.com/benchmarks/#hw=ph&test=plaintext&section=data-r22"
29+
target="_blank"
30+
class="underline"
31+
>TechEmpower Benchmark</a
32+
>
33+
Round 22 (2023-10-17) in PlainText
34+
</p>
35+
</article>
36+
</div>
37+
</template>
38+
39+
<style scoped>
40+
@reference "../../tailwind.css";
41+
42+
.result {
43+
@apply flex flex-col flex-1 from-sky-300 to-purple-300 bg-gradient-to-r rounded-2xl;
44+
padding: 1.5px;
45+
46+
& > article {
47+
@apply flex flex-col gap-3 p-5 bg-white dark:bg-slate-800;
48+
border-radius: calc(var(--radius-2xl) - 1.5px);
49+
}
50+
}
51+
52+
.graph {
53+
@apply flex flex-col flex-1 gap-1 m-0 px-0 py-2;
54+
55+
& > li {
56+
@apply flex justify-start items-center gap-4 w-full h-6;
57+
58+
& > h6 {
59+
@apply w-26 min-w-26 font-mono text-lg font-medium text-gray-500 dark:text-gray-400;
60+
61+
& > span {
62+
@apply text-sm text-gray-400 font-normal;
63+
}
64+
}
65+
66+
& > div {
67+
@apply flex justify-end items-center w-full h-6 font-bold font-mono text-gray-500 dark:text-gray-400 text-sm pr-3 bg-gray-200 dark:bg-gray-600 rounded-2xl;
68+
}
69+
70+
& > p {
71+
@apply font-medium font-mono text-gray-400 text-sm -translate-x-2;
72+
}
73+
}
74+
}
75+
</style>

‎docs/components/fern/benchmark-fastify.vue‎

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
<template>
2+
<div class="result">
3+
<article>
4+
<ol class="graph">
5+
<li>
6+
<h6>
7+
<span
8+
class="!text-xl !font-semibold !text-transparent !ml-0 text-gradient from-violet-500 to-sky-500"
9+
>
10+
Elysia
11+
</span>
12+
</h6>
13+
<div
14+
class="w-full bg-gradient-to-r from-violet-500 to-fuchsia-400 !text-white"
15+
>
16+
2,454,631 reqs/s
17+
</div>
18+
</li>
19+
<li>
20+
<h6>Fastify</h6>
21+
<div style="width: 16.93%" />
22+
<p>415,600</p>
23+
</li>
24+
</ol>
25+
<p class="text-sm !m-0 text-gray-400 !leading-normal">
26+
Measured in requests/second. Result from
27+
<a
28+
href="https://www.techempower.com/benchmarks/#hw=ph&test=plaintext&section=data-r22"
29+
target="_blank"
30+
class="underline"
31+
>TechEmpower Benchmark</a
32+
>
33+
Round 22 (2023-10-17) in PlainText
34+
</p>
35+
</article>
36+
</div>
37+
</template>
38+
39+
<style scoped>
40+
@reference "../../tailwind.css";
41+
42+
.result {
43+
@apply flex flex-col flex-1 from-sky-300 to-purple-300 bg-gradient-to-r rounded-2xl;
44+
padding: 1.5px;
45+
46+
& > article {
47+
@apply flex flex-col gap-3 p-5 bg-white dark:bg-slate-800;
48+
border-radius: calc(var(--radius-2xl) - 1.5px);
49+
}
50+
}
51+
52+
.graph {
53+
@apply flex flex-col flex-1 gap-1 m-0 px-0 py-2;
54+
55+
& > li {
56+
@apply flex justify-start items-center gap-4 w-full h-6;
57+
58+
& > h6 {
59+
@apply w-26 min-w-26 font-mono text-lg font-medium text-gray-500 dark:text-gray-400;
60+
61+
& > span {
62+
@apply text-sm text-gray-400 font-normal;
63+
}
64+
}
65+
66+
& > div {
67+
@apply flex justify-end items-center w-full h-6 font-bold font-mono text-gray-500 dark:text-gray-400 text-sm pr-3 bg-gray-200 dark:bg-gray-600 rounded-2xl;
68+
}
69+
70+
& > p {
71+
@apply font-medium font-mono text-gray-400 text-sm -translate-x-2;
72+
}
73+
}
74+
}
75+
</style>

‎docs/components/fern/benchmark-hono.vue‎

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
<template>
2+
<div class="result">
3+
<article>
4+
<ol class="graph">
5+
<li>
6+
<h6>
7+
<span
8+
class="!text-xl !font-semibold !text-transparent !ml-0 text-gradient from-violet-500 to-sky-500"
9+
>
10+
Elysia
11+
</span>
12+
</h6>
13+
<div
14+
class="w-full bg-gradient-to-r from-violet-500 to-fuchsia-400 !text-white"
15+
>
16+
1,837,294 reqs/s
17+
</div>
18+
</li>
19+
<li>
20+
<h6>Fastify</h6>
21+
<div style="width: 40.03%" />
22+
<p>740,451</p>
23+
</li>
24+
</ol>
25+
<p class="text-sm !m-0 text-gray-400 !leading-normal">
26+
Measured in requests/second. Result from
27+
<a
28+
href="https://www.techempower.com/benchmarks/#section=data-r23&test=json"
29+
target="_blank"
30+
class="underline"
31+
>TechEmpower Benchmark</a
32+
>
33+
Round 23 (2025-02-24) in JSON serialization
34+
</p>
35+
</article>
36+
</div>
37+
</template>
38+
39+
<style scoped>
40+
@reference "../../tailwind.css";
41+
42+
.result {
43+
@apply flex flex-col flex-1 from-sky-300 to-purple-300 bg-gradient-to-r rounded-2xl;
44+
padding: 1.5px;
45+
46+
& > article {
47+
@apply flex flex-col gap-3 p-5 bg-white dark:bg-slate-800;
48+
border-radius: calc(var(--radius-2xl) - 1.5px);
49+
}
50+
}
51+
52+
.graph {
53+
@apply flex flex-col flex-1 gap-1 m-0 px-0 py-2;
54+
55+
& > li {
56+
@apply flex justify-start items-center gap-4 w-full h-6;
57+
58+
& > h6 {
59+
@apply w-26 min-w-26 font-mono text-lg font-medium text-gray-500 dark:text-gray-400;
60+
61+
& > span {
62+
@apply text-sm text-gray-400 font-normal;
63+
}
64+
}
65+
66+
& > div {
67+
@apply flex justify-end items-center w-full h-6 font-bold font-mono text-gray-500 dark:text-gray-400 text-sm pr-3 bg-gray-200 dark:bg-gray-600 rounded-2xl;
68+
}
69+
70+
& > p {
71+
@apply font-medium font-mono text-gray-400 text-sm -translate-x-2;
72+
}
73+
}
74+
}
75+
</style>

‎docs/components/fern/compare.vue‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<template>
2+
<section class="code-compare">
3+
<article>
4+
<section>
5+
<slot name="left" />
6+
</section>
7+
<slot name="left-content" />
8+
</article>
9+
<article>
10+
<section>
11+
<slot name="right" />
12+
</section>
13+
<slot name="right-content" />
14+
</article>
15+
</section>
16+
</template>
17+
18+
<style>
19+
@reference "../../tailwind.css";
20+
21+
.code-compare {
22+
@apply z-40 grid grid-cols-1 xl:grid-cols-2 gap-3 xl:w-[60rem] xl:-translate-x-20 bg-white dark:bg-slate-800 rounded-xl;
23+
grid-auto-rows: 1fr;
24+
25+
& > article {
26+
@apply flex flex-col gap-4 *:!m-0;
27+
28+
& > section {
29+
@apply flex flex-1 *:w-full rounded-xl;
30+
31+
& > .vp-code-group > .blocks {
32+
@apply h-full;
33+
34+
& > div {
35+
@apply m-0;
36+
height: calc(100% - 50px);
37+
38+
& > pre {
39+
@apply h-full overflow-y-hidden;
40+
}
41+
}
42+
}
43+
}
44+
}
45+
}
46+
</style>

‎docs/components/nearl/card.vue‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<a role="article" :href="props.href"
2+
<a role="article" :href="props.href" :download="props.download"
33
class="flex flex-col gap-1 !text-gray-600 text-sm px-4 py-3 rounded-lg border dark:bg-slate-800 dark:border-gray-800 dark:!text-gray-300 hover:shadow-lg !transition-all focus:shadow-lg hover:-translate-y-1 focus:-translate-y-1 !font-normal !no-underline">
44
<h3 class="!text-black dark:!text-white !font-medium text-sm !my-0">{{ props.title }}</h3>
55
<p class="!m-0 !leading-normal">
@@ -13,5 +13,6 @@
1313
const props = defineProps<{
1414
href: string
1515
title: string
16+
download?: boolean
1617
}>()
1718
</script>

0 commit comments

Comments
 (0)