Skip to content

Commit 1a44c35

Browse files
WebReflectionWebReflection
authored
Merge branch 'master' into domdiff
2 parents eaf2fce + e0884d0 commit 1a44c35

35 files changed

+1372
-35
lines changed

‎frameworks/keyed/ganic/.babelrc

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"presets": [
3+
["@babel/preset-env", {
4+
"useBuiltIns": false
5+
}]
6+
],
7+
"plugins": [
8+
[
9+
"@babel/plugin-transform-react-jsx",
10+
{
11+
"pragma": "Ganic.createElement",
12+
"pragmaFrag": "Ganic.Fragment",
13+
"throwIfNamespace": false
14+
}
15+
],
16+
[
17+
"@babel/plugin-transform-runtime",
18+
{
19+
"regenerator": true
20+
}
21+
]
22+
],
23+
"parserOpts": {}
24+
}

‎frameworks/keyed/ganic/index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Ganic</title>
6+
<link href="/css/currentStyle.css" rel="stylesheet"/>
7+
</head>
8+
<body>
9+
<div id="main"></div>
10+
<script src="dist/main.js"></script>
11+
</body>
12+
</html>

‎frameworks/keyed/ganic/package.json

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"name": "js-framework-benchmark-ganic",
3+
"version": "1.0.0",
4+
"description": "Benchmark for ganic library",
5+
"js-framework-benchmark": {
6+
"frameworkVersionFromPackage": "ganic"
7+
},
8+
"scripts": {
9+
"build-dev": "webpack --watch",
10+
"build-prod": "webpack"
11+
},
12+
"author": "Rango Yuan",
13+
"license": "Apache-2.0",
14+
"homepage": "https://github.com/krausest/js-framework-benchmark",
15+
"repository": {
16+
"type": "git",
17+
"url": "https://github.com/krausest/js-framework-benchmark.git"
18+
},
19+
"dependencies": {
20+
"ganic": "^2.1.2",
21+
"ganic-dom": "^2.1.7",
22+
"ganic-usex": "^2.1.4"
23+
},
24+
"devDependencies": {
25+
"@babel/core": "^7.7.4",
26+
"@babel/plugin-transform-react-jsx": "^7.7.4",
27+
"@babel/plugin-transform-runtime": "^7.6.2",
28+
"@babel/preset-env": "^7.7.4",
29+
"@babel/runtime": "^7.7.4",
30+
"babel-loader": "8.0.6",
31+
"terser-webpack-plugin": "1.3.0",
32+
"webpack": "4.34.0",
33+
"webpack-cli": "3.3.4"
34+
}
35+
}

‎frameworks/keyed/ganic/src/Benchmark.js

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
/* eslint-disable no-unused-vars */
2+
import Ganic from 'ganic';
3+
import { useCallback } from "ganic-usex";
4+
import useStore from './useStore';
5+
6+
const GlyphIcon = <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>;
7+
8+
const Row = ({ selected, item, dispatch }) => {
9+
const select = useCallback(() => dispatch({ type: 'SELECT', id: item.id })),
10+
remove = useCallback(() => dispatch({ type: 'REMOVE', id: item.id }));
11+
12+
return (<tr class={selected ? "danger" : ""}>
13+
<td class="col-md-1">{item.id}</td>
14+
<td class="col-md-4"><a onClick={select}>{item.label}</a></td>
15+
<td class="col-md-1"><a onClick={remove}>{GlyphIcon}</a></td>
16+
<td class="col-md-6"></td>
17+
</tr>);
18+
};
19+
20+
const Button = ({ id, cb, title }) => (
21+
<div class="col-sm-6 smallpad">
22+
<button type="button" class="btn btn-primary btn-block" id={id} onClick={cb}>{title}</button>
23+
</div>
24+
);
25+
26+
const Jumbotron = ({ dispatch }) => (
27+
<div class="jumbotron">
28+
<div class="row">
29+
<div class="col-md-6">
30+
<h1>Ganic keyed</h1>
31+
</div>
32+
<div class="col-md-6">
33+
<div class="row">
34+
<Button id="run" title="Create 1,000 rows" cb={() => dispatch({ type: 'RUN' })} />
35+
<Button id="runlots" title="Create 10,000 rows" cb={() => dispatch({ type: 'RUN_LOTS' })} />
36+
<Button id="add" title="Append 1,000 rows" cb={() => dispatch({ type: 'ADD' })} />
37+
<Button id="update" title="Update every 10th row" cb={() => dispatch({ type: 'UPDATE' })} />
38+
<Button id="clear" title="Clear" cb={() => dispatch({ type: 'CLEAR' })} />
39+
<Button id="swaprows" title="Swap Rows" cb={() => dispatch({ type: 'SWAP_ROWS' })} />
40+
</div>
41+
</div>
42+
</div>
43+
</div>
44+
);
45+
46+
const Benchmark = () => {
47+
const [state, dispatch] = useStore();
48+
49+
return (<div class="container">
50+
<Jumbotron dispatch={dispatch} />
51+
<table class="table table-hover table-striped test-data"><tbody>
52+
{state.data.map(item => (
53+
<Row key={item.id} item={item} selected={state.selected === item.id} dispatch={dispatch} />
54+
))}
55+
</tbody></table>
56+
<span class="preloadicon glyphicon glyphicon-remove" aria-hidden="true"></span>
57+
</div>);
58+
}
59+
60+
export default Benchmark;

‎frameworks/keyed/ganic/src/buildData.js

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
const random = max => Math.round(Math.random() * 1000) % max;
2+
3+
const A = ["pretty", "large", "big", "small", "tall", "short", "long", "handsome", "plain", "quaint", "clean",
4+
"elegant", "easy", "angry", "crazy", "helpful", "mushy", "odd", "unsightly", "adorable", "important", "inexpensive",
5+
"cheap", "expensive", "fancy"];
6+
const C = ["red", "yellow", "blue", "green", "pink", "brown", "purple", "brown", "white", "black", "orange"];
7+
const N = ["table", "chair", "house", "bbq", "desk", "car", "pony", "cookie", "sandwich", "burger", "pizza", "mouse",
8+
"keyboard"];
9+
10+
let nextId = 1;
11+
12+
const buildData = count => {
13+
const data = new Array(count);
14+
for (let i = 0; i < count; i++) {
15+
data[i] = {
16+
id: nextId++,
17+
label: `${A[random(A.length)]} ${C[random(C.length)]} ${N[random(N.length)]}`,
18+
};
19+
}
20+
return data;
21+
}
22+
23+
export default buildData;

‎frameworks/keyed/ganic/src/main.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import Ganic from 'ganic';
2+
import GanicDOM from 'ganic-dom';
3+
import Benchmark from './Benchmark';
4+
5+
GanicDOM.render(<Benchmark />, document.getElementById('main'));

‎frameworks/keyed/ganic/src/useStore.js

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
/* eslint-disable no-unused-vars */
2+
import { useCallback, useInitialState } from 'ganic-usex';
3+
import buildData from './buildData';
4+
5+
// todo: move useReducer to ganic-usex
6+
const useReducer = (reducer, initState) => {
7+
const [state, setState] = useInitialState(initState);
8+
const dispatch = useCallback(action => setState(s => reducer(s, action)));
9+
return [state, dispatch];
10+
}
11+
12+
const listReducer = (state, action) => {
13+
const { data, selected } = state;
14+
switch (action.type) {
15+
case 'RUN':
16+
return { data: buildData(1000), selected: 0 };
17+
case 'RUN_LOTS':
18+
return { data: buildData(10000), selected: 0 };
19+
case 'ADD':
20+
return { data: data.concat(buildData(1000)), selected };
21+
case 'UPDATE':
22+
const newData = data.slice(0);
23+
for (let i = 0; i < newData.length; i += 10) {
24+
const r = newData[i];
25+
newData[i] = { id: r.id, label: r.label + " !!!" };
26+
}
27+
return { data: newData, selected };
28+
case 'CLEAR':
29+
return { data: [], selected: 0 };
30+
case 'SWAP_ROWS':
31+
return { data: [data[0], data[998], ...data.slice(2, 998), data[1], data[999]], selected };
32+
case 'REMOVE':
33+
const idx = data.findIndex((d) => d.id === action.id);
34+
return { data: [...data.slice(0, idx), ...data.slice(idx + 1)], selected };
35+
case 'SELECT':
36+
return { data, selected: action.id };
37+
}
38+
return state;
39+
}
40+
41+
const initState = { data: [], selected: 0 };
42+
const useStore = () => useReducer(listReducer, initState);
43+
44+
export default useStore;

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

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
const path = require('path');
2+
const webpack = require('webpack');
3+
const TerserPlugin = require('terser-webpack-plugin');
4+
5+
module.exports = {
6+
mode: 'production',
7+
// mode: 'development',
8+
entry: {
9+
main: path.join(__dirname, 'src', 'main.js'),
10+
},
11+
output: {
12+
path: path.join(__dirname, 'dist'),
13+
filename: '[name].js'
14+
},
15+
resolve: {
16+
extensions: ['.js', '.jsx']
17+
},
18+
module: {
19+
rules: [{
20+
test: /\.jsx?$/,
21+
exclude: /node_modules/,
22+
use: [
23+
{
24+
loader: 'babel-loader',
25+
}
26+
]
27+
}]
28+
},
29+
optimization: {
30+
minimizer: [
31+
new TerserPlugin({
32+
terserOptions: {
33+
parse: {
34+
ecma: 8,
35+
},
36+
compress: {
37+
ecma: 5,
38+
warnings: false,
39+
comparisons: false,
40+
},
41+
mangle: {
42+
safari10: true,
43+
},
44+
output: {
45+
ecma: 5,
46+
comments: false,
47+
ascii_only: true,
48+
},
49+
},
50+
parallel: true,
51+
cache: true,
52+
}),
53+
]
54+
},
55+
plugins: [
56+
new webpack.DefinePlugin({
57+
'process.env': { NODE_ENV: JSON.stringify('production') }
58+
// 'process.env': { NODE_ENV: JSON.stringify('development') }
59+
}),
60+
],
61+
};

‎frameworks/keyed/heresy/index.html

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<!DOCTYPE html>
2+
<meta charset="utf-8" />
3+
<title>heresy keyed</title>
4+
<link href="/css/currentStyle.css" rel="stylesheet" />
5+
<div id="container"></div>
6+
<script src='dist/index.js'></script>

‎frameworks/keyed/heresy/package.json

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{
2+
"name": "js-framework-benchmark-heresy",
3+
"version": "1.0.0",
4+
"description": "heresy demo",
5+
"main": "index.js",
6+
"js-framework-benchmark": {
7+
"frameworkVersionFromPackage": "heresy"
8+
},
9+
"scripts": {
10+
"build-dev": "rollup -c -w",
11+
"build-prod": "rollup -c"
12+
},
13+
"repository": {
14+
"type": "git",
15+
"url": "git+https://github.com/krausest/js-framework-benchmark.git"
16+
},
17+
"keywords": [
18+
"heresy"
19+
],
20+
"author": "Mathis Zeiher",
21+
"license": "Apache-2.0",
22+
"bugs": {
23+
"url": "https://github.com/krausest/js-framework-benchmark/issues"
24+
},
25+
"homepage": "https://github.com/krausest/js-framework-benchmark#readme",
26+
"dependencies": {
27+
"heresy": "^0.23.2"
28+
},
29+
"devDependencies": {
30+
"@ungap/degap": "^0.1.4",
31+
"rollup": "^1.27.5",
32+
"rollup-plugin-includepaths": "^0.2.3",
33+
"rollup-plugin-minify-html-literals": "^1.2.2",
34+
"rollup-plugin-node-resolve": "^5.2.0",
35+
"rollup-plugin-terser": "^5.1.2"
36+
}
37+
}

0 commit comments

Comments
 (0)