Skip to content

Commit 29b8360

Browse files
krausestkrausest
committed
Merge branch 'xania-master'
2 parents 3e0fff7 + 1295af7 commit 29b8360

File tree

9 files changed

+3844
-3432
lines changed

9 files changed

+3844
-3432
lines changed

‎frameworks/keyed/xania/package-lock.json‎

Lines changed: 3705 additions & 3268 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frameworks/keyed/xania/package.json‎

Lines changed: 35 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,37 @@
11
{
2-
"name": "js-framework-benchmark-xaniajs",
3-
"version": "1.1.1",
4-
"description": "Xania JS demo",
5-
"main": "index.js",
6-
"js-framework-benchmark": {
7-
"frameworkVersionFromPackage": "@xania/view",
8-
"frameworkHomeURL": "https://github.com/xania/view",
9-
"issues": [772]
10-
},
11-
"scripts": {
12-
"build-dev": "npx rimraf dist && webpack",
13-
"build-prod": "webpack --mode=production"
14-
},
15-
"keywords": [
16-
"xania",
17-
"webpack"
18-
],
19-
"author": "Ibrahim ben Salah",
20-
"license": "MIT",
21-
"homepage": "https://github.com/xania",
22-
"repository": {
23-
"type": "git",
24-
"url": "https://github.com/xania/view.git"
25-
},
26-
"dependencies": {
27-
"@xania/view": "0.3.3",
28-
"webpack": "^5.66.0"
29-
},
30-
"devDependencies": {
31-
"html-webpack-plugin": "5.5.0",
32-
"ts-loader": "9.2.6",
33-
"typescript": "4.5.2",
34-
"webpack-cli": "4.9.1"
35-
}
2+
"name": "js-framework-benchmark-xaniajs",
3+
"version": "1.1.1",
4+
"description": "Xania JS demo",
5+
"main": "index.js",
6+
"js-framework-benchmark": {
7+
"frameworkVersionFromPackage": "@xania/view",
8+
"customURL": "/dist",
9+
"frameworkHomeURL": "https://github.com/xania/view",
10+
"issues": []
11+
},
12+
"scripts": {
13+
"start": "npx vite -c=vite.config.dev.ts",
14+
"build-prod": "npx vite build --emptyOutDir"
15+
},
16+
"keywords": [
17+
"xania",
18+
"webpack"
19+
],
20+
"author": "Ibrahim ben Salah",
21+
"license": "MIT",
22+
"homepage": "https://github.com/xania",
23+
"repository": {
24+
"type": "git",
25+
"url": "https://github.com/xania/view.git"
26+
},
27+
"devDependencies": {
28+
"ts-loader": "9.2.6",
29+
"typescript": "4.9.3",
30+
"vite": "3.2.4",
31+
"vite-tsconfig-paths": "^3.6.0",
32+
"prettier": "2.8.0"
33+
},
34+
"dependencies": {
35+
"@xania/view": "0.4.8"
36+
}
3637
}

‎frameworks/keyed/xania/src/app.tsx‎

Lines changed: 38 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1-
import { jsx, createContainer, property, render } from "@xania/view";
1+
import { List, useContext, jsxFactory, render } from "@xania/view";
22
import { TableStore, DataRow } from "./table-store";
33

4+
const jsx = jsxFactory();
5+
46
interface JumbotronProps {
57
store: TableStore;
68
}
@@ -83,60 +85,44 @@ function Jumbotron(props: JumbotronProps) {
8385
);
8486
}
8587

86-
function Container() {
87-
const rows = createContainer<DataRow>();
88-
const store = new TableStore(rows);
89-
return (
90-
<div id="main">
91-
<div class="container">
92-
<Jumbotron store={store} />
93-
<table class="table table-hover table-striped test-data">
94-
<tbody>{rows.map(Row(store))}</tbody>
95-
</table>
96-
<span
97-
class="preloadicon glyphicon glyphicon-remove"
98-
aria-hidden="true"
99-
></span>
100-
</div>
101-
</div>
102-
);
103-
}
88+
export function Container() {
89+
const store = new TableStore();
10490

105-
function Row(store: TableStore) {
91+
const row = useContext<DataRow>();
92+
const danger = row.defer("danger");
10693
return (
107-
<tr class={property("className")}>
108-
<td class="col-md-1">{property("id")}</td>
109-
<td class="col-md-4">
110-
<a class="lbl" click={store.select}>
111-
{property("label")}
112-
</a>
113-
</td>
114-
<td class="col-md-1">
115-
<a class="remove" click={store.delete}>
116-
<span
117-
class="remove glyphicon glyphicon-remove"
118-
aria-hidden="true"
119-
></span>
120-
</a>
121-
</td>
122-
<td class="col-md-6"></td>
123-
</tr>
94+
<div class="container">
95+
<Jumbotron store={store} />
96+
<table class="table table-hover table-striped test-data">
97+
<tbody>
98+
<List source={store.source}>
99+
<tr class={danger}>
100+
<td class="col-md-1">{row.readonly("id")}</td>
101+
<td class="col-md-4">
102+
<a class="lbl" click={(e) => danger.select(e.data)}>
103+
{row.get("label")}
104+
</a>
105+
</td>
106+
<td class="col-md-1">
107+
<a class="remove" click={store.delete}>
108+
<span
109+
class="remove glyphicon glyphicon-remove"
110+
aria-hidden="true"
111+
></span>
112+
</a>
113+
</td>
114+
<td class="col-md-6"></td>
115+
</tr>
116+
</List>
117+
</tbody>
118+
</table>
119+
<span
120+
class="preloadicon glyphicon glyphicon-remove"
121+
aria-hidden="true"
122+
></span>
123+
</div>
124124
);
125125
}
126126

127-
// interface InputProps<T> {
128-
// value: State<T>;
129-
// }
130-
131-
// function Input<T>(props: InputProps<T>) {
132-
// const tpl = jsx.factory;
133-
// const { value } = props;
134-
// return <input value={value} keyup={onKeyUp} />;
135-
136-
// function onKeyUp({ target }) {
137-
// value.update(target.value);
138-
// }
139-
// }
140-
141127
const main = document.getElementById("main");
142-
render(main, <Container />);
128+
render(<Container />, main);

‎frameworks/keyed/xania/index.html‎ renamed to ‎frameworks/keyed/xania/src/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,6 @@
1111
class="preloadicon glyphicon glyphicon-remove"
1212
aria-hidden="true"
1313
></span>
14-
<script src="dist/main.js"></script>
14+
<script type="module" src="./app.tsx"></script>
1515
</body>
1616
</html>

‎frameworks/keyed/xania/src/table-store.ts‎

Lines changed: 27 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,10 @@
1-
import { ViewContext, ViewContainer } from "@xania/view";
1+
import {
2+
Context,
3+
ListSource,
4+
ListMutationType,
5+
State,
6+
useState,
7+
} from "@xania/view";
28

39
export interface DataRow {
410
id: number;
@@ -64,28 +70,14 @@ var nouns = [
6470

6571
export class TableStore {
6672
private counter = 1;
67-
constructor(private container: ViewContainer<DataRow>) {}
73+
public source: ListSource<DataRow> = new ListSource<DataRow>();
6874

69-
selected?: Node;
70-
71-
select = (context: ViewContext) => {
72-
const { selected, container } = this;
73-
const node = context.node;
74-
if (selected !== node) {
75-
if (selected?.parentNode) {
76-
container.updateAt(selected["rowIndex"], "className", () => null);
77-
}
78-
this.selected = node;
79-
container.updateAt(node["rowIndex"], "className", () => "danger");
80-
}
81-
};
82-
83-
delete = (context: ViewContext) => {
84-
this.container.removeAt(context.node["rowIndex"]);
85-
};
75+
readonly delete = (e: JSX.EventContext<DataRow>) =>
76+
this.source.delete(e.data);
8677

8778
private appendRows(count: number) {
88-
let { counter, container } = this;
79+
let { counter } = this;
80+
8981
const data = new Array(count);
9082
for (let i = 0; i < count; i++) {
9183
data[i] = {
@@ -96,45 +88,43 @@ export class TableStore {
9688
colours[_random(colours.length)] +
9789
" " +
9890
nouns[_random(nouns.length)],
99-
className: null,
10091
};
10192
}
102-
103-
container.push(data);
93+
this.source.append(data);
10494
this.counter = counter;
10595
}
10696

10797
create1000Rows = (): void => {
10898
this.clear();
10999
this.appendRows(1000);
110100
};
111-
112101
create10000Rows = (): void => {
113102
this.clear();
114103
this.appendRows(10000);
115104
};
116-
117105
append1000Rows = (): void => {
118106
this.appendRows(1000);
119107
};
120108

121109
updateEvery10thRow = (): void => {
122-
const { container } = this;
123-
const length = container.length;
124-
125-
for (let i = 0; i < length; i += 10) {
126-
container.updateAt(i, "label", (value) => value + " !!!");
127-
}
110+
this.source.update((data) => {
111+
const updated = [];
112+
for (let i = 0; i < data.length; i += 10) {
113+
const item = data[i];
114+
data[i].label += " !!!";
115+
updated.push(item);
116+
}
117+
return updated;
118+
});
128119
};
129-
130120
clear = (): void => {
131-
this.container.clear();
132-
this.selected = null;
121+
this.source.clear();
133122
};
134-
135123
swapRows = (): void => {
136-
if (this.container.length > 998) {
137-
this.container.swap(1, 998);
124+
const { source } = this;
125+
if (source.length > 998) {
126+
source.move(1, 998);
127+
source.move(998, 1);
138128
}
139129
};
140130
}

‎frameworks/keyed/xania/tsconfig.json‎

Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,17 @@
11
{
2-
"include": ["src"],
3-
"compilerOptions": {
4-
"outDir": "dist/src",
5-
"noImplicitAny": false,
6-
"sourceMap": true,
7-
"module": "esnext",
8-
"moduleResolution": "node",
9-
"target": "ES6",
10-
"jsx": "react",
11-
"jsxFactory": "jsx",
12-
"baseUrl": "./src",
13-
"allowJs": true,
14-
}
15-
}
2+
"include": ["src"],
3+
"compilerOptions": {
4+
"lib": ["dom", "ESNext"],
5+
"outDir": "dist/src",
6+
"noImplicitAny": false,
7+
"sourceMap": true,
8+
"module": "esnext",
9+
"moduleResolution": "node",
10+
"target": "ES6",
11+
"jsx": "react",
12+
"jsxFactory": "jsx.createElement",
13+
"jsxFragmentFactory": "jsx.createFragment",
14+
"allowJs": true,
15+
"types": ["@xania/view/types/jsx"]
16+
}
17+
}

‎frameworks/keyed/xania/vite.config.dev.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { defineConfig } from "vite";
2+
3+
export default defineConfig({
4+
server: {
5+
port: 8082,
6+
host: "0.0.0.0",
7+
},
8+
root: "src",
9+
publicDir: "../../../../",
10+
});

‎frameworks/keyed/xania/vite.config.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { defineConfig } from "vite";
2+
3+
export default defineConfig({
4+
root: "src",
5+
base: "/frameworks/keyed/xania/dist/",
6+
build: {
7+
outDir: "../dist",
8+
},
9+
esbuild: {
10+
drop: ["console", "debugger"],
11+
},
12+
});

‎frameworks/keyed/xania/webpack.config.js‎

Lines changed: 0 additions & 26 deletions
This file was deleted.

0 commit comments

Comments
 (0)