Skip to content

Commit

Permalink
Merge branch 'release/rsc' into feat-rsc-to-ssr
Browse files Browse the repository at this point in the history
  • Loading branch information
ClarkXia committed Dec 26, 2023
2 parents e88c729 + effee4a commit f514221
Show file tree
Hide file tree
Showing 94 changed files with 11,609 additions and 7,059 deletions.
1 change: 1 addition & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ coverage/

# 忽略第三方包
/vendor/loader.js
override/

# 忽略文件
**/*-min.js
Expand Down
5 changes: 5 additions & 0 deletions examples/with-first-chunk-cache-ssr/ice.config.mts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import { defineConfig } from '@ice/app';

export default defineConfig({
ssr: true,
});
Binary file added examples/with-first-chunk-cache-ssr/ice.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
22 changes: 22 additions & 0 deletions examples/with-first-chunk-cache-ssr/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"name": "@examples/with-first-chunk-cache-ssr",
"version": "1.0.0",
"private": true,
"scripts": {
"start": "ice start",
"build": "ice build"
},
"description": "ICE example with first chunk cache ssr",
"author": "ICE Team",
"license": "MIT",
"dependencies": {
"@ice/app": "workspace:*",
"@ice/runtime": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@types/react": "^18.0.17",
"@types/react-dom": "^18.0.6"
}
}
Binary file not shown.
7 changes: 7 additions & 0 deletions examples/with-first-chunk-cache-ssr/src/app.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { defineAppConfig } from 'ice';

export default defineAppConfig({
app: {
rootId: 'app',
},
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
.box {
display: flex;
width: 100%;
height: 100px;
flex-direction: row;
background-color: white;
}

.item {
flex: 1;
}
44 changes: 44 additions & 0 deletions examples/with-first-chunk-cache-ssr/src/components/Box/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
import { useSuspenseData, withSuspense } from 'ice';
import logo from '../../../ice.png';
import styles from './index.module.css';

const Item = withSuspense((props) => {
console.log('Render: Item');

return (
(<div className={styles.item}>
<img src={props.src} height="100" width="100" />
</div>)
);
});

function Box() {
const data = useSuspenseData(getData);
console.log('Render: Box');

return (
<div className={styles.box}>
{
data.map((item, index) => {
return <Item id="Item" key={index} src={item} />;
})
}
</div>
);
}

export default withSuspense(Box);

async function getData() {
console.log('load box');

await new Promise<any>((resolve) => {
setTimeout(() => resolve(null), 1000);
});

return [
logo,
logo,
logo,
];
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
.list {
background-color: rgba(0,0,0,.03);
}

.item{
padding: 20px;
background-color: aliceblue;
margin: 20px;
display: flex;
}

.image {
padding: 10px;
}

.title {
padding: 15px 0px;
}
75 changes: 75 additions & 0 deletions examples/with-first-chunk-cache-ssr/src/components/List/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
import { useSuspenseData, withSuspense } from 'ice';
import logo from '../../../ice.png';
import styles from './index.module.css';

const Item = withSuspense((props) => {
console.log('Render: List');

return (
(<div className={styles.item} >
<img className={styles.image} src={props.src} alt="logo" height="100" width="100" />
<div>
<div className={styles.title}>{props.title}</div>
<div>{props.description}</div>
</div>
</div>)
);
});

function List() {
const data = useSuspenseData(getData);
console.log('Render: List');

return (
<div className={styles.list}>
{
data.map(item => {
return (<Item
id="Item"
description={item.description}
src={item.logo}
title={item.title}
/>);
})
}
</div>
);
}

export default withSuspense(List);

async function getData() {
console.log('load list');

await new Promise<any>((resolve) => {
setTimeout(() => resolve(null), 2000);
});

return [
{
logo,
title: 'ice.js',
description: '这是 ICE 框架',
},
{
logo,
title: 'ice.js',
description: '这是 ICE 框架',
},
{
logo,
title: 'ice.js',
description: '这是 ICE 框架',
},
{
logo,
title: 'ice.js',
description: '这是 ICE 框架',
},
{
logo,
title: 'ice.js',
description: '这是 ICE 框架',
},
];
}
23 changes: 23 additions & 0 deletions examples/with-first-chunk-cache-ssr/src/document.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { Meta, Title, Links, Main, Scripts, FirstChunkCache } from 'ice';

function Document() {
return (
<html>
<head>
<meta charSet="utf-8" />
<meta name="description" content="ICE 3.0 Demo" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<Meta />
<Title />
<Links />
</head>
<body>
<Main />
<FirstChunkCache />
<Scripts async />
</body>
</html>
);
}

export default Document;
63 changes: 63 additions & 0 deletions examples/with-first-chunk-cache-ssr/src/pages/index.module.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
.app {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
overflow-x: hidden;
}

.app > header {
display: flex;
flex-direction: column;
align-items: center;
}

.app > header > img {
width: 120px;
}

.app > header > p {
margin: 20px 0;
text-align: center;
font-size: 2.6rem;
}

.app > main {
display: flex;
flex-direction: column;
margin: 20px 0 10px;
font-size: 0.9rem;
}

.boxFallback {
background: rgba(0,0,0,.03);
border-radius: 3.2vw;
height: 100px;
}

.header {
background: linear-gradient(to bottom right, rgb(2, 46, 244), rgb(46, 40, 150));
height: 100px;
width: 100%;
font-size: 22px;
align-items: center;
line-height: 100px;
text-align: center;
color: #FFF;
}

.link {
font-size: 1.2rem;
color: var(--primary);
}

.button {
outline: none;
border: none;
border-radius: 8px;
padding: 10px 35px;
background: var(--primary);
box-shadow: 0 5px 10px 0 #ddd;
font-size: calc(10px + 2vmin);
}
26 changes: 26 additions & 0 deletions examples/with-first-chunk-cache-ssr/src/pages/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import styles from './index.module.css';
import List from '@/components/List/index';
import Box from '@/components/Box/index';


export default function Home() {
console.log('Render: Home');

return (
<div>
<Header />
<Box id="Box" fallback={<div className={styles.boxFallback} />} />
<List id="List" fallback={<div className={styles.boxFallback} />} />
{/* https://github.com/xiaoxiaojx/blog/issues/37 */}
<div dangerouslySetInnerHTML={{ __html: '<div style="height:0;width:0;">\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b\u200b</div>' }} />
</div>
);
}

function Header() {
return (
<div className={styles.header} >
First chunk Demo
</div>
);
}
1 change: 1 addition & 0 deletions examples/with-first-chunk-cache-ssr/src/typings.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
/// <reference types="@ice/app/types" />
32 changes: 32 additions & 0 deletions examples/with-first-chunk-cache-ssr/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
{
"compileOnSave": false,
"buildOnSave": false,
"compilerOptions": {
"baseUrl": ".",
"outDir": "build",
"module": "esnext",
"target": "esnext",
"jsx": "react-jsx",
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"lib": ["es6", "dom"],
"sourceMap": true,
"allowJs": true,
"rootDir": "./",
"forceConsistentCasingInFileNames": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noImplicitAny": false,
"importHelpers": true,
"strictNullChecks": true,
"suppressImplicitAnyIndexErrors": true,
"noUnusedLocals": true,
"skipLibCheck": true,
"paths": {
"@/*": ["./src/*"],
"ice": [".ice"]
}
},
"include": ["src", ".ice", "ice.config.*"],
"exclude": ["build", "public"]
}
8 changes: 8 additions & 0 deletions examples/with-unocss/ice.config.mts
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
import { defineConfig } from '@ice/app';
import Unocss from '@ice/plugin-unocss';

export default defineConfig(() => ({
plugins: [
Unocss(),
]
}));
20 changes: 20 additions & 0 deletions examples/with-unocss/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
{
"name": "@examples/with-unocss",
"private": true,
"version": "1.0.0",
"scripts": {
"start": "ice start",
"build": "ice build"
},
"dependencies": {
"@ice/runtime": "workspace:*",
"react": "^18.0.0",
"react-dom": "^18.0.0"
},
"devDependencies": {
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
"@ice/app": "workspace:*",
"@ice/plugin-unocss": "workspace:*"
}
}
3 changes: 3 additions & 0 deletions examples/with-unocss/src/app.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import { defineAppConfig } from 'ice';

export default defineAppConfig(() => ({}));
Loading

0 comments on commit f514221

Please sign in to comment.