30:T43b,tests = [ {desc: 'Read pre-parsed data', test: testReadObjects}, {desc: 'Read data from JSON string', test: testReadJSON}, {desc: 'Read data from CSV string', test: testReadCSV}, {desc: 'Aggregate data, grouped by category', test: testAggregate}, {desc: 'Aggregate filtered data, grouped by category', test: testAggregateFilter}, {desc: 'Render aggregated data in a bar chart _(canvas)_', test: testBars('canvas')}, {desc: 'Render aggregated data in a bar chart _(svg-string)_', test: testBars('svg')}, {desc: 'Update bar chart filter and re-render _(canvas)_', test: testBarsFilter('canvas')}, {desc: 'Update bar chart filter and re-render _(svg-dom)_', test: testBarsFilter('svg')}, {desc: 'Render all data in a scatter plot _(canvas)_', test: testScatter('canvas')}, {desc: 'Render all data in a scatter plot _(svg-string)_', test: testScatter('svg')}, {desc: 'Update scatter plot highlights and re-render _(canvas)_', test: testScatterBrush('canvas')}, {desc: 'Update scatter plot highlights and re-render _(svg-dom)_', test: testScatterBrush('svg')} ];31:T4ae,function specBars(values) { return { width: 500, height: 200, autosize: 'pad', padding: 5, data: [ { name: 'table', values: values, transform: [ { type: 'aggregate', groupby: ['category'], fields: ['u', 'v', 'f', 'x', null], ops: ['mean', 'stdev', 'max', 'sum', 'count'] } ] } ], scales: [ { name: 'x', type: 'band', domain: {data: 'table', field: 'category', sort: true}, range: 'width' }, { name: 'y', domain: {data: 'table', field: 'mean_u'}, range: 'height' } ], axes: [ {orient: 'left', scale: 'y'}, {orient: 'bottom', scale: 'x'}, ], marks: [ { type: 'rect', from: {data: 'table'}, encode: { enter: { x: {scale: 'x', field: 'category'}, width: {scale: 'x', band: 1, offset: -1}, fill: {value: 'steelblue'} }, update: { y: {scale: 'y', field: 'mean_u'}, y2: {scale: 'y', value: 0} } } } ] }; }32:[] 2e:{"title":"Vega Performance Tests","cells":[{"id":0,"value":"md`# Vega Performance Tests\n\nThis notebook runs a series of performance tests for data loading, transformation, visualization, and incremental updates. All tests include the overhead of parsing a Vega specification and instantiating the runtime dataflow graph. Except for the JSON and CSV loading tests, all tests take a pre-parsed set of data objects as input.\n\nAdjust the _Dataset Size_ option to change the number of generated input data objects. Adjust the _Iterations_ option to change the number of times each test is run. Note that using larger datasets and more iterations may cause this page to hang for a while — the tests should complete within a minute or two!\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":75,"value":"viewof size = menu('Dataset Size', [\n 100,\n 500,\n [1000, '1,000'],\n [5000, '5,000', true],\n [10000, '10,000'],\n [50000, '50,000'],\n [100000, '100,000']\n])","pinned":false,"hidden":false,"mode":"ojs"},{"id":79,"value":"viewof iter = menu('Iterations', [1, 2, [5, 5, true], 10])","pinned":false,"hidden":false,"mode":"ojs"},{"id":81,"value":"results = {\n let table = `\n| Test | Average (ms) | Max (ms) |\n|------|-------------:|---------:|\n`;\n \n const max = a => a.reduce((v, x) => Math.max(v, x), -Infinity);\n const sum = a => a.reduce((v, x) => v + x, 0);\n const avg = a => Math.round(sum(a) / a.length);\n \n const t = Date.now();\n await run(tests, size, iter, (test, results) => {\n table += `|${test.desc}|${avg(results)}|${max(results)}|\\n`;\n });\n \n table += `|_Total test running time_||_${Date.now() - t}_|`;\n return md`${table}`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":65,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":69,"value":"async function run(tests, size, iter, callback) {\n const data = generateData(size, [\n sampleCounter('key'),\n sampleNominal('category', 'abcdefghij'),\n sampleNormal('u', 0, 2),\n sampleNormal('v', 10, 5),\n sampleUniform('f', -1, 1),\n sampleInteger('x', 1, 100)\n ]);\n\n for (let i=0; i 0'\n });\n\n return spec;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":33,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":35,"value":"function specBarsFilter(values) {\n const spec = specBars(values);\n\n spec.signals = [\n {name: 'lo', value: -10},\n {name: 'hi', value: 10}\n ];\n\n spec.data[0].transform.unshift({\n type: 'filter',\n expr: 'lo < datum.u && datum.u < hi'\n });\n\n return spec;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":37,"value":"function specScatter(values) {\n return {\n width: 500,\n height: 500,\n autosize: 'pad',\n padding: 5,\n data: [\n {\n name: 'table',\n values: values\n }\n ],\n scales: [\n {\n name: 'x',\n domain: {data: 'table', field: 'u'},\n padding: 5,\n range: 'width'\n },\n {\n name: 'y',\n domain: {data: 'table', field: 'v'},\n padding: 5,\n range: 'height'\n }\n ],\n axes: [\n {orient: 'left', scale: 'y'},\n {orient: 'bottom', scale: 'x'},\n ],\n marks: [\n {\n type: 'symbol',\n from: {data: 'table'},\n encode: {\n enter: {\n x: {scale: 'x', field: 'u'},\n y: {scale: 'y', field: 'v'},\n size: {value: 64},\n fill: {value: 'steelblue'},\n fillOpacity: {value: 0.25}\n }\n }\n }\n ]\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":39,"value":"function specScatterBrush(values) {\n const spec = specScatter(values);\n\n spec.signals = [\n {name: 'lo', value: -10},\n {name: 'hi', value: 10}\n ];\n\n spec.marks[0].encode.update = {\n fill: {signal: 'lo < datum.u && datum.u < hi ? \"steelblue\" : \"gray\"'}\n };\n\n return spec;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":22,"value":"md`## Data Generation Utilities`","pinned":false,"hidden":false,"mode":"ojs"},{"id":20,"value":"function generateData(n, samplers) {\n const data = Array(n);\n for (let i=0; i ++count\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":14,"value":"function sampleNormal(name, mean, stdev) {\n return {\n name: name,\n sample: vega.randomNormal(mean, stdev).sample\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"function sampleUniform(name, min, max) {\n return {\n name: name,\n sample: vega.randomUniform(min, max).sample\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"function sampleInteger(name, min, max) {\n return {\n name: name,\n sample: vega.randomInteger(min, max).sample\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"function sampleNominal(name, values) {\n const sample = vega.randomInteger(0, values.length).sample;\n return {\n name: name,\n sample: () => values[sample()]\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"function toCSV(data) {\n const headers = Object.keys(data[0]);\n let csv = headers.join(',') + '\\n';\n for (let i=0, n=data.length; i data[i][h]).join(',') + '\\n';\n }\n return csv;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":41,"value":"md`## Imports`","pinned":false,"hidden":false,"mode":"ojs"},{"id":106,"value":"md`By default, we use the latest version of Vega. Include a specific version number to test the performance of a different version, like so: \\`require('vega@5.3.0')\\`. Note that timing will be inaccurate for versions of Vega prior to v5.0.0 due to dataflow implementation changes.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"vega = require('vega@5')","pinned":false,"hidden":false,"mode":"ojs"},{"id":72,"value":"import {slider, menu} from '@jheer/dom-utilities'","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}