Skip to content

Commit 69d045a

Browse files
committed
actually keyed impl
1 parent 81872f2 commit 69d045a

File tree

5 files changed

+100
-91
lines changed

5 files changed

+100
-91
lines changed

frameworks/keyed/fntags/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,4 +8,4 @@
88
<body>
99
<script type="module" src="dist/Main.js"></script>
1010
</body>
11-
</html>
11+
</html>

frameworks/keyed/fntags/package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,18 +4,18 @@
44
"description": "fntags demo",
55
"main": "index.js",
66
"js-framework-benchmark": {
7-
"frameworkVersion": "0.1.6"
7+
"frameworkVersionFromPackage": "fntags"
88
},
99
"scripts": {
1010
"build-dev": "node build.js dev",
1111
"build-prod": "node build.js"
1212
},
1313
"author": "Robert Kempton",
1414
"dependencies": {
15-
"fntags": "^0.1.6"
15+
"fntags": "0.1.7"
1616
},
1717
"devDependencies": {
18-
"fs-extra": "^8.1.0",
19-
"terser": "^4.3.8"
18+
"fs-extra": "8.1.0",
19+
"terser": "4.3.8"
2020
}
2121
}
Lines changed: 82 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
import { fnapp, fnbind, fnstate, h, resetState } from '../node_modules/fntags/src/fntags.js'
1+
import { findElement, fnapp, fnbind, fnstate, h, resetState } from '../node_modules/fntags/src/fntags.js'
22

3-
const data = fnstate( { current: [] } )
4-
const selected = fnstate( { id: 0 } )
3+
let data = fnstate( { current: [] } )
54

65
function random( max ) { return Math.round( Math.random() * 1000 ) % max }
76

@@ -13,85 +12,63 @@ const N = [ 'table', 'chair', 'house', 'bbq', 'desk', 'car', 'pony', 'cookie', '
1312
'keyboard' ]
1413

1514
let nextId = 1
16-
1715
function buildData( count ) {
18-
const data = new Array( count )
16+
const newData = new Array( count )
1917
for( let i = 0; i < count; i++ ) {
20-
data[ i ] = fnstate( {
18+
newData[ i ] = fnstate( {
2119
id: nextId++,
2220
label: `${A[ random( A.length ) ]} ${C[ random( C.length ) ]} ${N[ random( N.length ) ]}`
2321
} )
2422
}
25-
return data
26-
}
27-
28-
const createOneThousand = () => {
29-
resetState( selected, true )
30-
data.current = buildData( 1000 )
31-
}
32-
33-
const createTenThousand = () => {
34-
resetState( selected, true )
35-
data.current = buildData( 10000 )
36-
}
37-
38-
const appendOneThousand = () =>
39-
data.current = data.current.concat( buildData( 1000 ) )
40-
41-
const updateEveryTenth = () => {
42-
for( let i = 0; i < data.current.length; i += 10 ) {
43-
data.current[ i ].label += ' !!!'
44-
}
23+
return newData
4524
}
4625

47-
const swapRows = () => {
48-
const theData = data.current
49-
if( theData.length > 998 ) {
50-
const a = Object.assign( {}, theData[ 1 ] )
51-
Object.assign( theData[ 1 ], theData[ 998 ] )
52-
Object.assign( theData[ 998 ], a )
53-
}
54-
}
55-
56-
const clear = () => {
57-
resetState( selected, true )
58-
59-
data.current = []
60-
}
61-
62-
const Button = ( id, title, onclick ) => (
26+
const Button = ( id, title, onclick ) =>
6327
h( 'div', { class: 'col-sm-6 smallpad' },
6428
h( 'button', { id, type: 'button', class: 'btn btn-primary btn-block', onclick: onclick }, title )
6529
)
66-
)
67-
68-
const row = ( item, idx ) => {
69-
let tr = h( 'tr', { id: item.id },
70-
h( 'td', { class: 'col-md-1' }, fnbind( item, () => item.id )),
71-
h( 'td', { class: 'col-md-4' }, h( 'a', { onclick: () => selected.id = item.id }, fnbind( item, () => item.label ) ) ),
72-
h( 'td', {
73-
class: 'col-md-1',
74-
onclick: ( e ) => {
75-
tr.replaceWith( '' )
76-
resetState( item )
77-
data.current.splice( idx, 1 )
78-
}
79-
},
80-
h( 'a',
81-
h( 'span', { class: 'glyphicon glyphicon-remove', 'aria-hidden': 'true' } )
82-
)
83-
),
84-
h( 'td', { class: 'col-md-6' } )
85-
)
86-
return fnbind( selected, tr, ( el, st ) => {
87-
if( st.id === item.id )
88-
el.className = 'danger'
89-
else
90-
el.className = ''
9130

92-
} )
31+
let selectedId= 0
32+
const row = ( item ) => {
33+
let label = h( 'a', {
34+
onclick: () => {
35+
let currentSelection = data.current.find( i => i && i.id == selectedId )
36+
if( currentSelection ) findElement( currentSelection ).className = ''
37+
findElement( item ).className = 'danger'
38+
selectedId = item.id
39+
}
40+
}, item.label )
41+
let id = h( 'td', { class: 'col-md-1' }, item.id )
42+
let tr = h( 'tr', { id: item.id.toString(), class: selectedId === item.id ? 'danger' : '' },
43+
id,
44+
h( 'td', { class: 'col-md-4' }, label ),
45+
h( 'td', {
46+
class: 'col-md-1',
47+
onclick: ( e ) => {
48+
e.preventDefault()
49+
tr.replaceWith( '' )
50+
resetState( item )
51+
data.current[ data.current.findIndex( i => i && i.id === item.id ) ] = null
52+
tr = null
53+
}
54+
},
55+
h( 'a',
56+
h( 'span', { class: 'glyphicon glyphicon-remove', 'aria-hidden': 'true' } )
57+
)
58+
),
59+
h( 'td', { class: 'col-md-6' } )
60+
)
61+
return fnbind(
62+
item,
63+
tr,
64+
() => {
65+
label.innerText = item.label
66+
id.innerText = item.id
67+
}
68+
)
9369
}
9470

71+
const dataTable = h( 'tbody' )
9572
fnapp( document.body,
9673
h( 'div', { class: 'container' },
9774
h( 'div', { class: 'jumbotron' },
@@ -101,22 +78,48 @@ fnapp( document.body,
10178
),
10279
h( 'div', { class: 'col-md-6' },
10380
h( 'div', { class: 'row' },
104-
Button( 'run', 'Create 1,000 rows', createOneThousand ),
105-
Button( 'runlots', 'Create 10,000 rows', createTenThousand ),
106-
Button( 'add', 'Append 1,000 rows', appendOneThousand ),
107-
Button( 'update', 'Update every 10th row', updateEveryTenth ),
108-
Button( 'clear', 'Clear', clear ),
109-
Button( 'swaprows', 'Swap Rows', swapRows )
81+
Button( 'run', 'Create 1,000 rows', () => data.current = buildData( 1000 ) ),
82+
Button( 'runlots', 'Create 10,000 rows', () => data.current = buildData( 10000 ) ),
83+
Button( 'add', 'Append 1,000 rows', () => {
84+
let newData = buildData( 1000 )
85+
data.current.push( ...data.current.concat( newData ) )
86+
dataTable.append( ...newData.map( row ) )
87+
} ),
88+
Button( 'update', 'Update every 10th row', () => {
89+
for( let i = 0; i < data.current.length; i += 10 ) {
90+
data.current[ i ].label += ' !!!'
91+
}
92+
} ),
93+
Button( 'clear', 'Clear', () => data.current = [] ),
94+
Button( 'swaprows', 'Swap Rows', ( ) => {
95+
const theData = data.current
96+
if( theData.length > 998 ) {
97+
98+
let rowa = findElement( theData[ 1 ], el => el.getAttribute( 'id' ) == theData[ 1 ].id )
99+
let rowb = findElement( theData[ 998 ], el => el.getAttribute( 'id' ) == theData[ 998 ].id )
100+
101+
const a = theData[ 1 ]
102+
theData[ 1 ] = theData[ 998 ]
103+
theData[ 998 ] = a
104+
let sib = rowa.nextSibling
105+
let parent = rowa.parentNode
106+
parent.insertBefore( rowa, rowb )
107+
parent.insertBefore( rowb, sib )
108+
109+
}
110+
} )
110111
)
111112
)
112113
)
113114
)
114115
),
115116
h( 'table', { class: 'table table-hover table-striped test-data' },
116-
fnbind( data, () =>
117-
h( 'tbody', ...data.current.map( row ) )
118-
)
117+
fnbind( data, dataTable, ( el, st ) => {
118+
while( el.firstChild ) {
119+
el.removeChild( el.firstChild )
120+
}
121+
el.append( ...st.current.filter( r => r ).map( row ) )
122+
} )
119123
),
120124
h( 'span', { class: 'preloadicon glyphicon glyphicon-remove', 'aria-hidden': 'true' } )
121-
)
122-
125+
)

webdriver-ts/results.json

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

webdriver-ts/src/benchmarkRunner.ts

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { BenchmarkType, Benchmark, benchmarks, fileName, LighthouseData } from './benchmarks'
22
import * as fs from 'fs';
33
import * as yargs from 'yargs';
4+
import * as path from 'path'
45
import { JSONResult, config, FrameworkData, initializeFrameworks, ErrorAndWarning, BenchmarkOptions } from './common'
56
import * as R from 'ramda';
67
import { fork } from 'child_process';
@@ -59,7 +60,7 @@ async function performRetryableRun(runFrameworks: FrameworkData[], framework: Fr
5960
if (benchMsg.failure) {
6061
console.log(`Executing ${framework.uri} and benchmark ${benchmark.id} failed with a technical error: ${benchMsg.failure}`);
6162
errors.push(`Executing ${framework.uri} and benchmark ${benchmark.id} failed with a technical error: ${benchMsg.failure}`);
62-
if (config.EXIT_ON_ERROR) throw "Exiting because of an technical error and config.EXIT_ON_ERROR = true";
63+
if (config.EXIT_ON_ERROR) throw "Exiting because of an technical error and config.EXIT_ON_ERROR = true";
6364
} else {
6465
let errorsAndWarnings = benchMsg as ErrorAndWarning;
6566
if (errorsAndWarnings.error) errors.push(`Executing ${framework.uri} and benchmark ${benchmark.id} failed: ` + errorsAndWarnings.error);
@@ -82,7 +83,7 @@ async function runBench(runFrameworks: FrameworkData[], benchmarkNames: string[]
8283

8384
let runBenchmarks = benchmarks.filter(b => benchmarkNames.some(name => b.id.toLowerCase().indexOf(name) > -1));
8485

85-
let restart: string = undefined;
86+
let restart: string = undefined;
8687
let index = runFrameworks.findIndex(f => f.fullNameWithKeyedAndVersion===restart);
8788
if (index>-1) {
8889
runFrameworks = runFrameworks.slice(index);
@@ -133,7 +134,7 @@ async function runBench(runFrameworks: FrameworkData[], benchmarkNames: string[]
133134
// What doesn't work (keyed/react becomes an element of argument benchmark): npm run bench -- --count 1 --benchmark 01_ keyed/react
134135

135136
let args = yargs(process.argv)
136-
.usage("$0 [--framework Framework1 Framework2 ...] [--benchmark Benchmark1 Benchmark2 ...] [--count n] [--exitOnError] \n or: $0 [directory1] [directory2] .. [directory3]")
137+
.usage("$0 [--framework Framework1 Framework2 ...] [--benchmark Benchmark1 Benchmark2 ...] [--count n] [--exitOnError] \n or: $0 [directory1] [directory2] .. [directory3] \n or: $0 installed")
137138
.help('help')
138139
.default('check', 'false')
139140
.default('fork', 'true')
@@ -144,6 +145,7 @@ let args = yargs(process.argv)
144145
.string('chromeBinary')
145146
.string('chromeDriver')
146147
.boolean('headless')
148+
.boolean('installed')
147149
.array("framework").array("benchmark")
148150
.argv;
149151

@@ -152,11 +154,15 @@ let allArgs = args._.length<=2 ? [] : args._.slice(2,args._.length);
152154
let runBenchmarksFromDirectoryNamesArgs = !args.framework;
153155

154156
async function main() {
155-
156-
157+
157158
let runBenchmarks = (args.benchmark && args.benchmark.length > 0 ? args.benchmark : [""]).map(v => v.toString());
158159
let runFrameworks: FrameworkData[];
159-
if (runBenchmarksFromDirectoryNamesArgs) {
160+
if(args.installed){
161+
console.log("MODE: Installed frameworks.");
162+
const hasPackageLock = (directoryName: string)=>
163+
!!fs.existsSync(path.join(path.resolve('..','frameworks'), directoryName, 'package-lock.json'))
164+
runFrameworks = await initializeFrameworks(hasPackageLock)
165+
} else if (runBenchmarksFromDirectoryNamesArgs) {
160166
console.log("MODE: Directory names. Using arguments as the directory names to be re-run: ", allArgs);
161167
let matchesDirectoryArg = (directoryName: string) => allArgs.length==0 || allArgs.some(arg => arg==directoryName)
162168
runFrameworks = await initializeFrameworks(matchesDirectoryArg);

0 commit comments

Comments
 (0)