Skip to content

Commit 5b5a366

Browse files
committed
Merge branch 'adamhaile-master'
2 parents 7f0a0b5 + 2f2452d commit 5b5a366

File tree

9 files changed

+331
-0
lines changed

9 files changed

+331
-0
lines changed

surplus-v0.4.0/index.html

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

surplus-v0.4.0/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-surplus",
3+
"version": "0.4.0",
4+
"description": "Surplus js-framework-benchmark implementation",
5+
"main": "dist/main.js",
6+
"scripts": {
7+
"build-dev": "webpack -w -d --config webpack.config.js",
8+
"build-prod": "webpack -p --config webpack.config.js"
9+
},
10+
"keywords": [
11+
"s.js",
12+
"surplus",
13+
"javascript",
14+
"framework",
15+
"benchmark"
16+
],
17+
"author": "Adam Haile",
18+
"license": "MIT",
19+
"homepage": "https://github.com/curveship/js-framework-benchmark",
20+
"repository": {
21+
"type": "git",
22+
"url": "https://github.com/curveship/js-framework-benchmark.git"
23+
},
24+
"dependencies": {
25+
"s-js": "^0.4.0",
26+
"s-array": "^0.4.0",
27+
"surplus": "^0.4.0"
28+
},
29+
"devDependencies": {
30+
"ts-loader": "0.8.2",
31+
"typescript": "2.2.1",
32+
"surplus-loader": "^0.4.0",
33+
"webpack": "2.2.1"
34+
}
35+
}

surplus-v0.4.0/src/controller.ts

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
import { Store } from './store';
2+
3+
var startTime : number;
4+
var lastMeasure : string | null;
5+
var startMeasure = function(name : string) {
6+
startTime = performance.now();
7+
lastMeasure = name;
8+
}
9+
var stopMeasure = function() {
10+
var last = lastMeasure;
11+
if (lastMeasure) {
12+
window.setTimeout(function () {
13+
lastMeasure = null;
14+
var stop = performance.now();
15+
var duration = 0;
16+
console.log(last + " took " + (stop - startTime));
17+
}, 0);
18+
}
19+
}
20+
21+
export class App {
22+
constructor(public store : Store) { }
23+
run() {
24+
startMeasure("run");
25+
this.store.run();
26+
stopMeasure();
27+
}
28+
add() {
29+
startMeasure("add");
30+
this.store.add();
31+
stopMeasure();
32+
}
33+
update() {
34+
startMeasure("update");
35+
this.store.update();
36+
stopMeasure();
37+
}
38+
select(idx : number) {
39+
startMeasure("select");
40+
this.store.select(idx);
41+
stopMeasure();
42+
}
43+
delete(idx : number) {
44+
startMeasure("delete");
45+
this.store.delete(idx);
46+
stopMeasure();
47+
}
48+
runLots() {
49+
startMeasure("runLots");
50+
this.store.runLots();
51+
stopMeasure();
52+
}
53+
clear() {
54+
startMeasure("clear");
55+
this.store.clear();
56+
stopMeasure();
57+
}
58+
swapRows() {
59+
startMeasure("swapRows");
60+
this.store.swapRows();
61+
stopMeasure();
62+
}
63+
}

surplus-v0.4.0/src/main.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { Store } from './store';
2+
import { App } from './controller';
3+
import { AppView } from './view';
4+
import * as S from 's-js';
5+
6+
var view = S.root(() => AppView(new App(new Store()))) ;
7+
document.getElementById('main')!.appendChild(view);

surplus-v0.4.0/src/store.ts

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import * as S from 's-js';
2+
import * as SArray from 's-array';
3+
4+
function _random(max : number) {
5+
return Math.round(Math.random()*1000)%max;
6+
}
7+
8+
export class Row {
9+
label : S.DataSignal<string>;
10+
constructor (public id : number, label : string) {
11+
this.label = S.data(label);
12+
}
13+
}
14+
15+
export class Store {
16+
data = SArray<Row>([]);
17+
selected = S.data<number | undefined>(undefined);
18+
id = 1;
19+
20+
buildData(count = 1000) {
21+
var adjectives = ["pretty", "large", "big", "small", "tall", "short", "long", "handsome", "plain", "quaint", "clean", "elegant", "easy", "angry", "crazy", "helpful", "mushy", "odd", "unsightly", "adorable", "important", "inexpensive", "cheap", "expensive", "fancy"];
22+
var colours = ["red", "yellow", "blue", "green", "pink", "brown", "purple", "brown", "white", "black", "orange"];
23+
var nouns = ["table", "chair", "house", "bbq", "desk", "car", "pony", "cookie", "sandwich", "burger", "pizza", "mouse", "keyboard"];
24+
var data : Row[] = [];
25+
for (var i = 0; i < count; i++)
26+
data.push(new Row(this.id++, adjectives[_random(adjectives.length)] + " " + colours[_random(colours.length)] + " " + nouns[_random(nouns.length)]));
27+
return data;
28+
}
29+
updateData(mod = 10) {
30+
let data = this.data();
31+
S.freeze(() => {
32+
for (let i = 0; i < data.length; i += 10) {
33+
data[i].label(data[i].label() + ' !!!');
34+
}
35+
});
36+
}
37+
delete(id : number) {
38+
const idx = (this.data() as any).findIndex((d : Row) => d.id == id);
39+
this.data.splice(idx, 1);
40+
}
41+
run() {
42+
S.freeze(() => {
43+
this.data(this.buildData());
44+
this.selected(undefined);
45+
});
46+
}
47+
add() {
48+
this.data(this.data().concat(this.buildData(1000)));
49+
}
50+
update() {
51+
this.updateData();
52+
}
53+
select(id : number) {
54+
this.selected(id);
55+
}
56+
runLots() {
57+
S.freeze(() => {
58+
this.data(this.buildData(10000));
59+
this.selected(undefined);
60+
});
61+
}
62+
clear() {
63+
S.freeze(() => {
64+
this.data([]);
65+
this.selected(undefined);
66+
});
67+
}
68+
swapRows() {
69+
let data = this.data();
70+
if(data.length > 10) {
71+
var a = data[4];
72+
data[4] = data[9];
73+
data[9] = a;
74+
}
75+
this.data(data);
76+
}
77+
}

surplus-v0.4.0/src/view.tsx

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
import * as Surplus from 'surplus';
2+
import * as S from 's-js';
3+
import { App } from './controller';
4+
5+
Surplus;
6+
7+
const USE_NON_KEYED_TBODY = location.search.indexOf('keyed') === -1;
8+
9+
type RowTr = HTMLTableRowElement & { _id : HTMLTableCellElement, _label : HTMLAnchorElement };
10+
11+
export let AppView = (app : App) =>
12+
<div className="container">
13+
<div className="jumbotron">
14+
<div className="row">
15+
<div className="col-md-6">
16+
<h1>Surplus v0.4.0</h1>
17+
</div>
18+
<div className="col-md-6">
19+
<div className="row">
20+
<div className="col-sm-6 smallpad">
21+
<button type="button" className="btn btn-primary btn-block" id="run" onClick={e => app.run()}>Create 1,000 rows</button>
22+
</div>
23+
<div className="col-sm-6 smallpad">
24+
<button type="button" className="btn btn-primary btn-block" id="runlots" onClick={e => app.runLots()}>Create 10,000 rows</button>
25+
</div>
26+
<div className="col-sm-6 smallpad">
27+
<button type="button" className="btn btn-primary btn-block" id="add" onClick={e => app.add()}>Append 1,000 rows</button>
28+
</div>
29+
<div className="col-sm-6 smallpad">
30+
<button type="button" className="btn btn-primary btn-block" id="update" onClick={e => app.update()}>Update every 10th row</button>
31+
</div>
32+
<div className="col-sm-6 smallpad">
33+
<button type="button" className="btn btn-primary btn-block" id="clear" onClick={e => app.clear()}>Clear</button>
34+
</div>
35+
<div className="col-sm-6 smallpad">
36+
<button type="button" className="btn btn-primary btn-block" id="swaprows" onClick={e => app.swapRows()}>Swap Rows</button>
37+
</div>
38+
</div>
39+
</div>
40+
</div>
41+
</div>
42+
<table className="table table-hover table-striped test-data"
43+
onClick = {(e : any) => e.target.matches('.delete') ? app.delete(rowId(e)) : app.select(rowId(e))}>
44+
{ USE_NON_KEYED_TBODY ? TBodyNonKeyed(app) : TBodyKeyed(app) }
45+
</table>
46+
<span className="preloadicon glyphicon glyphicon-remove"></span>
47+
</div>,
48+
rowId = ({target: el} : {target : HTMLElement}) => {
49+
while (el.tagName !== 'TR') el = el.parentElement!;
50+
return +el.childNodes[0].textContent!;
51+
},
52+
TBodyKeyed = (app : App) =>
53+
<tbody>
54+
{app.store.data.mapSample(row =>
55+
<tr className={row.id === app.store.selected() ? 'danger' : ''}>
56+
<td className="col-md-1" innerText={row.id}></td>
57+
<td className="col-md-4">
58+
<a innerText={row.label()}></a>
59+
</td>
60+
<td className="col-md-1"><a><span className="glyphicon glyphicon-remove delete"></span></a></td>
61+
<td className="col-md-6"></td>
62+
</tr>
63+
)}
64+
</tbody>,
65+
TBodyNonKeyed = (app : App) => {
66+
var tbody = <tbody></tbody>,
67+
trs = [] as RowTr[];
68+
69+
S(() => { // keeps trs in sync with data
70+
let rows = app.store.data(),
71+
selectedId = app.store.selected();
72+
73+
if (rows.length === 0) {
74+
tbody.textContent = '';
75+
trs = [];
76+
} else for (let i = trs.length - 1; i >= rows.length; i--) {
77+
tbody.removeChild(trs[i]);
78+
trs.pop();
79+
}
80+
81+
for (let i = 0; i < rows.length; i++) {
82+
var row = rows[i],
83+
tr : RowTr | undefined = i < trs.length ? trs[i] : tbody.appendChild(
84+
(<tr ref={tr}>
85+
<td ref={tr!._id} className="col-md-1"></td>
86+
<td className="col-md-4">
87+
<a ref={tr!._label} className="select"></a>
88+
</td>
89+
<td className="col-md-1"><a className="delete"><span className="glyphicon glyphicon-remove delete"></span></a></td>
90+
<td className="col-md-6"></td>
91+
</tr> as RowTr,
92+
trs.push(tr!),
93+
tr!));
94+
95+
tr.className = row.id === selectedId ? 'danger' : '';
96+
tr._id.innerText = row.id + '';
97+
tr._label.innerText = row.label();
98+
}
99+
});
100+
101+
return tbody;
102+
};

surplus-v0.4.0/tsconfig.json

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"compilerOptions": {
3+
"outDir": "./dist/",
4+
"sourceMap": true,
5+
"noImplicitAny": true,
6+
"noImplicitThis": true,
7+
"strictNullChecks": true,
8+
"module": "commonjs",
9+
"target": "es5",
10+
"jsx": "preserve"
11+
},
12+
"files": [
13+
"src/main.ts"
14+
]
15+
}

surplus-v0.4.0/webpack.config.js

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
'use strict';
2+
3+
module.exports = {
4+
entry: './src/main.ts',
5+
output: {
6+
filename: './dist/main.js'
7+
},
8+
resolve: {
9+
extensions: ['.ts', '.tsx', '.js']
10+
},
11+
module: {
12+
rules: [
13+
{ test: /\.tsx?$/, loader: 'surplus-loader!ts-loader' },
14+
]
15+
},
16+
externals: [ { '@types/react' : 'this'} ]
17+
};

webdriver-ts/src/common.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,8 @@ export let frameworks = [
7373
f("riot-v3.0.7", true),
7474
f("simulacra-v1.5.5", true),
7575
f("stem-v0.2.60", true),
76+
f("surplus-v0.4.0-keyed", false, { uri: "surplus-v0.4.0?keyed" }),
77+
f("surplus-v0.4.0-nonkeyed", true, { uri: "surplus-v0.4.0" }),
7678
f("tsers-v1.0.0", true),
7779
f("vanillajs-non-keyed", true),
7880
f("vanillajs-keyed", false),

0 commit comments

Comments
 (0)