diff --git a/ivi-v0.7.0/gulpfile.js b/ivi-v0.7.0/gulpfile.js deleted file mode 100644 index 72e5f078e..000000000 --- a/ivi-v0.7.0/gulpfile.js +++ /dev/null @@ -1,47 +0,0 @@ -const gulp = require('gulp'); -const del = require('del'); -const rollup = require('rollup'); -const rollupReplace = require('rollup-plugin-replace'); -const rollupNodeResolve = require('rollup-plugin-node-resolve'); -const closureCompiler = require('google-closure-compiler-js').gulp(); - -gulp.task('clean', function () { - return del(['build', 'dist']); -}); - -gulp.task('bundle', ['clean'], function (done) { - return rollup.rollup({ - format: 'es6', - entry: 'src/main.js', - plugins: [ - rollupNodeResolve(), - rollupReplace({ - values: { - __IVI_DEV__: false, - __IVI_BROWSER__: true - } - }) - ] - }).then(function (bundle) { - return bundle.write({ - format: 'es', - dest: 'build/bundle.js' - }); - }); -}); - -gulp.task('build', ['bundle'], function () { - return gulp.src(['build/bundle.js']) - .pipe(closureCompiler({ - js_output_file: 'main.js', - compilation_level: 'ADVANCED', - language_in: 'ECMASCRIPT6_STRICT', - language_out: 'ECMASCRIPT5_STRICT', - use_types_for_optimization: true, - assume_function_wrapper: true, - output_wrapper: '(function(){%output%}).call(this);', - warning_level: 'QUIET', - rewrite_polyfills: false - })) - .pipe(gulp.dest('dist')); -}); diff --git a/ivi-v0.7.0/package.json b/ivi-v0.7.0/package.json deleted file mode 100644 index 5944b593b..000000000 --- a/ivi-v0.7.0/package.json +++ /dev/null @@ -1,26 +0,0 @@ -{ - "private": true, - "name": "js-framework-benchmark-ivi", - "version": "0.5.0", - "description": "Benchmark for ivi", - "author": "Stefan Krause", - "license": "Apache-2", - "homepage": "https://github.com/krausest/js-framework-benchmark", - "repository": "https://github.com/krausest/js-framework-benchmark", - "keywords": [], - "scripts": { - "build-dev": "gulp build", - "build-prod": "gulp build" - }, - "dependencies": { - "ivi": "0.7.0" - }, - "devDependencies": { - "del": "2.2.2", - "google-closure-compiler-js": "20170218.0.0", - "gulp": "3.9.1", - "rollup": "0.41.5", - "rollup-plugin-node-resolve": "2.0.0", - "rollup-plugin-replace": "1.1.1" - } -} diff --git a/ivi-v0.7.0/src/main.js b/ivi-v0.7.0/src/main.js deleted file mode 100644 index 0c53b3dca..000000000 --- a/ivi-v0.7.0/src/main.js +++ /dev/null @@ -1,189 +0,0 @@ -import { Component, connect, Events, $h, $c, selectorData, createStore, render, update, mut } from "ivi"; - -let startTime = 0; -let lastMeasure = null; - -function startMeasure(name) { - startTime = performance.now(); - lastMeasure = name; -} - -function stopMeasure() { - const last = lastMeasure; - if (lastMeasure) { - window.setTimeout(function () { - const now = performance.now(); - lastMeasure = null; - console.log(`${last} took ${now - startTime}`); - }, 0); - } -} - -function random(max) { - return Math.round(Math.random() * 1000) % max; -} - -const A = ["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"]; -const C = ["red", "yellow", "blue", "green", "pink", "brown", "purple", "brown", "white", "black", "orange"]; -const N = ["table", "chair", "house", "bbq", "desk", "car", "pony", "cookie", "sandwich", "burger", "pizza", - "mouse", "keyboard"]; - -let nextId = 1; - -function buildData(count = 1000) { - const data = new Array(count); - for (let i = 0; i < count; i++) { - data[i] = { - id: nextId++, - label: `${A[random(A.length)]} ${C[random(C.length)]} ${N[random(N.length)]}`, - }; - } - return data; -} - -const store = createStore( - { data: mut([]), selected: null }, - function (state, action) { - const data = state.data.ref; - switch (action.type) { - case "delete": - data.splice(data.indexOf(action.item), 1); - return Object.assign({}, state, { data: mut(data) }); - case "run": - return { data: mut(buildData(1000)), selected: null }; - case "add": - return Object.assign({}, state, { data: mut(state.data.ref.concat(buildData(1000))) }); - case "update": - for (let i = 0; i < data.length; i += 10) { - const r = data[i]; - data[i] = { id: r.id, label: r.label + " !!!" }; - } - return Object.assign({}, state); - case "select": - return Object.assign({}, state, { selected: action.item }); - case "runlots": - return { data: mut(buildData(10000)), selected: null }; - case "clear": - return { data: mut([]), selected: null }; - case "swaprows": - if (data.length > 10) { - const a = data[4]; - data[4] = data[9]; - data[9] = a; - } - return Object.assign({}, state, { data: mut(data) }); - } - return state; - }, - function () { - update(); - stopMeasure(); - } -); - -class Row extends Component { - constructor(props) { - super(props); - this.click = Events.onClick(this.click.bind(this)); - this.del = Events.onClick(this.del.bind(this)); - } - - click() { - startMeasure("select"); - store.dispatch({ type: "select", item: this.props.item }); - } - - del() { - startMeasure("delete"); - store.dispatch({ type: "delete", item: this.props.item }); - } - - render() { - const { selected, item } = this.props; - return $h("tr", selected ? "danger" : null) - .children([ - $h("td", "col-md-1").children(item.id), - $h("td", "col-md-4").children( - $h("a").events(this.click).children(item.label) - ), - $h("td", "col-md-1").children( - $h("a").events(this.del).children( - $h("span", "glyphicon glyphicon-remove").props({ "aria-hidden": "true" }) - ) - ), - $h("td", "col-md-6") - ]); - } -} - -const $Row = connect( - function (prev, id) { - const item = store.getState().data.ref[id]; - const selected = store.getState().selected === item; - if (prev && prev.in.item === item && prev.in.selected === selected) { - return prev; - } - return selectorData({ item, selected }); - }, - Row -); - -function RowList(rows) { - const children = new Array(rows.length); - for (let i = 0; i < children.length; i++) { - children[i] = $Row(i).key(rows[i].id); - } - return $h("tbody").children(children); -} - -const $RowList = connect( - function (prev) { - const rows = store.getState().data; - if (prev && prev.in === rows) { - return prev; - } - return selectorData(rows, rows.ref); - }, - RowList -); - -function $Button(text, id) { - return $h("div", "col-sm-6 smallpad").children( - $h("button", "btn btn-primary btn-block") - .events(Events.onClick(() => { - startMeasure(id); - store.dispatch({ type: id }); - })) - .props({ "type": "button", "id": id }) - .children(text) - ); -} - -function Controller() { - return $h("div", "container") - .children([ - $h("div", "jumbotron").children( - $h("div", "row").children([ - $h("div", "col-md-6").children( - $h("h1").children("ivi v0.7.0") - ), - $h("div", "col-md-6").children( - $h("div", "row").children([ - $Button("Create 1,000 rows", "run"), - $Button("Create 10,000 rows", "runlots"), - $Button("Append 1,000 rows", "add"), - $Button("Update every 10th row", "update"), - $Button("Clear", "clear"), - $Button("Swap Rows", "swaprows") - ]) - ) - ]) - ), - $h("table", "table table-hover table-striped test-data").children($RowList()), - $h("span", "preloadicon glyphicon glyphicon-remove").props({ "aria-hidden": "true" }) - ]); -} - -render($c(Controller), document.getElementById("main")); diff --git a/ivi-v0.7.0/.gitignore b/ivi-v0.8.0-keyed/.gitignore similarity index 100% rename from ivi-v0.7.0/.gitignore rename to ivi-v0.8.0-keyed/.gitignore diff --git a/ivi-v0.8.0-keyed/gulpfile.js b/ivi-v0.8.0-keyed/gulpfile.js new file mode 100644 index 000000000..ed206ebea --- /dev/null +++ b/ivi-v0.8.0-keyed/gulpfile.js @@ -0,0 +1,49 @@ +const gulp = require('gulp'); +const del = require('del'); +const rollup = require('rollup'); +const rollupReplace = require('rollup-plugin-replace'); +const rollupNodeResolve = require('rollup-plugin-node-resolve'); +const closureCompiler = require('google-closure-compiler-js').gulp(); + +gulp.task('clean', function () { + return del(['build', 'dist']); +}); + +gulp.task('bundle', ['clean'], function (done) { + return rollup.rollup({ + format: 'es6', + entry: 'src/main.js', + plugins: [ + rollupNodeResolve({ + module: true, + }), + rollupReplace({ + values: { + __IVI_DEV__: false, + __IVI_BROWSER__: true + } + }) + ] + }).then(function (bundle) { + return bundle.write({ + format: 'es', + dest: 'build/bundle.js' + }); + }); +}); + +gulp.task('build', ['bundle'], function () { + return gulp.src(['build/bundle.js']) + .pipe(closureCompiler({ + js_output_file: 'main.js', + compilation_level: 'ADVANCED', + language_in: 'ECMASCRIPT6_STRICT', + language_out: 'ECMASCRIPT5_STRICT', + use_types_for_optimization: true, + assume_function_wrapper: true, + output_wrapper: '(function(){%output%}).call(this);', + warning_level: 'QUIET', + rewrite_polyfills: false + })) + .pipe(gulp.dest('dist')); +}); diff --git a/ivi-v0.7.0/index.html b/ivi-v0.8.0-keyed/index.html similarity index 61% rename from ivi-v0.7.0/index.html rename to ivi-v0.8.0-keyed/index.html index 91c0cecbc..1e408b21f 100644 --- a/ivi-v0.7.0/index.html +++ b/ivi-v0.8.0-keyed/index.html @@ -1,12 +1,15 @@ +
-