Future plans for matrices #2702
Replies: 8 comments 23 replies
-
|
Oh btw, I was wondering a bit why this uses python style matrix format, rather than the matlab matrix format when defining matricies? |
Beta Was this translation helpful? Give feedback.
-
|
The expression parser of math.js supports both these styles, but when defining a matrix in plain JavaScript you will have to use nested arrays. |
Beta Was this translation helpful? Give feedback.
-
|
😂 so many plans so little time. How would closing this issue and opening it again in a new issue help? |
Beta Was this translation helpful? Give feedback.
-
|
hm yeah. Anyway I prefer keeping the current issue open, and keep the discussion in a single thread. |
Beta Was this translation helpful? Give feedback.
-
|
Relevant to this discussion is whether it's worth continuing to (re-)implement matrix/linear algebra algorithms directly in mathjs anyway. This question came up for me in the fix to #2879 which surfaced the new issue #3036. Seems to me that all this has done before, and mathjs would be better off leveraging existing solutions than rolling its own. One specific possibility seems to be https://github.com/mateogianolio/vectorious, which seems to also afford the possibility of using BLAS/LAPACK under the hood. |
Beta Was this translation helpful? Give feedback.
-
|
Good point. The ndarray library mentioned on top is not actively developed as far as I can see. We can also look into using |
Beta Was this translation helpful? Give feedback.
-
|
👋 Happy to help out with coordinating to help make building atop stdlib happen. A first step would be to do a bit of requirements gathering, as |
Beta Was this translation helpful? Give feedback.
-
|
Thanks Athan! We're currently focusing on a refactor of the core of mathjs, but after that I definitely want to look into this. |
Beta Was this translation helpful? Give feedback.
-
|
Sounds like a plan! |
Beta Was this translation helpful? Give feedback.
-
|
Another area of improvement would be related to matrix broadcasting. It currently grows the size of the involved matrices but maybe by modifying index it could do the broadcasting operations without growing the matrices. |
Beta Was this translation helpful? Give feedback.
-
|
We've written several lower-level utilities for working with nested arrays in stdlib which can handle this exact use case. Namely, broadcasting without growing matrices. I've done some POCs locally and am fairly confident that this can be used in a relatively straightforward manner in Math.js. Some care needs to be taken with regard to sparse array iteration, but I believe that this can largely be handled via standardized protocols for lazy/deferred element access. |
Beta Was this translation helpful? Give feedback.
-
|
Nice, at some point I did look into stdlib and tensorflow js that have this capability for broadcasting matrices in javascript. The current implementation is something that fits with other mathjs functions but I think it's very promising to also benefit from stdlib. |
Beta Was this translation helpful? Give feedback.
-
|
I'm working on an improvement on the map of multiple rectangular arrays / matrices without the need to broadcast each matrix individually with some promising results. I'm still working on the details. https://github.com/josdejong/mathjs/tree/faster-map-mulitple These solution works in a similar fashion some of the other iteration algorithms. |
Beta Was this translation helpful? Give feedback.
-
|
See also the thoughts/remarks in #1788. |
Beta Was this translation helpful? Give feedback.
-
|
And those in #1709. |
Beta Was this translation helpful? Give feedback.
-
|
And #1134 is also a good read ;-) |
Beta Was this translation helpful? Give feedback.
-
|
Regarding
I see a lot of benefits of this. There might be risks when I've given this idea some thought while working on |
Beta Was this translation helpful? Give feedback.
-
|
Hi @kgryte and @josdejong I'm doing some benchmarks, it is much faster to create <script type="module">
import ndarray from 'https://cdn.jsdelivr.net/gh/stdlib-js/ndarray-ctor@esm/index.mjs';
// import broadcastArray from 'https://cdn.jsdelivr.net/gh/stdlib-js/ndarray-base-broadcast-array@esm/index.mjs';
//import {create, all} from 'https://esm.run/mathjs'
import { create, all } from 'https://cdn.jsdelivr.net/npm/[email protected]/+esm'
import map from 'https://cdn.jsdelivr.net/gh/stdlib-js/ndarray-base-map@esm/index.mjs';
import { Bench } from 'https://esm.run/tinybench';
const math = create(all)
// make a random matrix
const N = 100
const shape = [N, N]
const size = N * N
const A = math.random(shape)
const time = 100
const bench = new Bench({ name: 'create matrix vs create ndarray', time: time })
bench.add('mathjs create matrix', () => {
math.matrix(A, 'dense', 'number')
})
const bufferA = new Float64Array(math.flatten(A))
const bufferY = new Float64Array(size)
const strides = [N, 1]
const order = 'row-major';
const offset = 0;
bench.add('ndarray create matrix', () => {
ndarray('float64', bufferA, shape, strides, offset, order)
})
const fn = Math.sqrt
const AM = math.matrix(A, 'dense', 'number')
bench.add('mathjs map', () => {
AM.map(fn)
})
const x = {
'dtype': 'float64',
'data': bufferA,
'shape': shape,
'strides': strides,
'offset': offset,
'order': 'row-major'
}
const y = {
'dtype': 'float64',
'data': bufferY,
'shape': shape,
'strides': strides,
'offset': offset,
'order': 'row-major'
};
bench.add('ndarray map', () => {
map([x, y], fn)
})
await bench.run()
console.log(bench.name)
console.table(bench.table())
console.log('Same result : ',
math.equal(
math.flatten(AM.map(fn).valueOf()),
Array.from(ndarray('generic', bufferY, shape, strides, offset, order).data)
).every(x => x)
)
</script> |
Beta Was this translation helpful? Give feedback.
-
|
@dvd101x Thanks for sharing. I was able to reproduce your results, both in Node.js and in Chrome/Safari. I created a couple of additional benchmark files in the stdlib repo:
The results are not terribly surprising. For the latter benchmark, a better comparison would be using When compared to Included in the results are a couple of alternative APIs which operate on nested arrays, similar to Math.js. That they are slightly faster than (aside: in case you are wondering why Compared to ndarray iteration, 2d nested arrays can achieve a slight perf advantage (~10-15%) depending on the element data type, array creation strategy, and array size. However, this advantage can vanish relatively quickly for larger array sizes and for arrays having higher rank. This also omits that nested arrays cannot readily support view semantics. Lastly, the above benchmarks do not compare what happens when using ndarrays with stdlib's C APIs via native add-ons. Typically, leveraging native add-ons can increase throughout by 1.5-2x, at minimum. Unfortunately, one cannot leverage native add-ons with nested arrays without jumping through a number of hoops in C. This is a decisive advantage of using ndarrays and linear memory, as memory can be shared using zero-copy semantics with a native layer. And that native layer subsequently has access to further optimizations, including SIMD, which are not available to JS application code. |
Beta Was this translation helpful? Give feedback.
-
|
Hi @kgryte , thanks for the detailed review. I will include a new benchmark using unary. I encountered an un expected behavior and I will take a while to validate. |
Beta Was this translation helpful? Give feedback.
-
|
On the following weeks I will include the new benchmark using unary. The unexpected behavior was addressed at #3546 |
Beta Was this translation helpful? Give feedback.
-
|
Hi @josdejong and @kgryte Here is an updated set of benchmarks, trying to take into account:
Conclusions
Future work
Appendix<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JS Matrix Benchmark</title>
<style>
body {
font-family: sans-serif;
padding: 20px;
max-width: 1000px;
margin: 0 auto;
}
.status {
padding: 10px;
margin-bottom: 10px;
border-radius: 4px;
}
.pass {
background-color: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.fail {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
#chart-container {
position: relative;
height: 500px;
width: 100%;
margin-top: 30px;
}
</style>
</head>
<body>
<h2>Matrix Library Benchmark (CPU)</h2>
<div id="status" class="status">Initializing...</div>
<div id="chart-container">
<canvas id="benchmarkChart"></canvas>
</div>
<pre id="logs" style="background: #f4f4f4; padding: 10px; overflow-x: auto;"></pre>
<script type="importmap">
{
"imports": {
"mathjs": "https://cdn.jsdelivr.net/npm/[email protected]/+esm",
"ndarray": "https://cdn.jsdelivr.net/gh/stdlib-js/ndarray-ctor@esm/index.mjs",
"ndarray-map": "https://cdn.jsdelivr.net/gh/stdlib-js/ndarray-base-map@esm/index.mjs",
"ndarray-unary": "https://cdn.jsdelivr.net/gh/stdlib-js/ndarray-base-unary@esm/index.mjs",
"ndarray-to-array": "https://cdn.jsdelivr.net/gh/stdlib-js/ndarray-to-array@esm/index.mjs",
"tfjs": "https://cdn.jsdelivr.net/npm/@tensorflow/[email protected]/+esm",
"tinybench": "https://esm.run/tinybench",
"chartjs": "https://cdn.jsdelivr.net/npm/[email protected]/+esm"
}
}
</script>
<script type="module">
import ndarray from 'ndarray';
import { create, all } from 'mathjs';
import map from 'ndarray-map';
import unary from 'ndarray-unary';
import * as tf from 'tfjs';
import { Bench } from 'tinybench';
import ndarray2array from 'ndarray-to-array';
import { Chart, registerables } from 'chartjs';
Chart.register(...registerables);
const logEl = document.getElementById('logs');
const statusEl = document.getElementById('status');
const log = (msg) => {
console.log(msg);
logEl.textContent += msg + '\n';
};
const math = create(all);
math.config({ relTol: 1e-5, absTol: 1e-8 });
// Force webgl backend as requested
await tf.setBackend('webgl'); // could be swapped for 'cpu' if desired
await tf.ready();
log(`TensorFlow.js Backend: ${tf.getBackend()}`);
// --- SETUP DATA ---
const N = 200;
const shape = [N, N];
const size = N * N;
const A = math.random(shape);
const Aflat = math.flatten(A);
const time = 100; // Increased time for more accurate CPU profiling
// Helper: Optimized MathJS Matrix creation
function mathMatrixNoValidation(A, size, datatype, skipClone = false) {
const M = new math.matrix([], 'dense', datatype);
M._data = skipClone ? A : math.clone(A);
M._datatype = datatype;
M._size = size;
return M;
}
function getStrides(shape) {
const strides = new Array(shape.length);
let stride = 1;
for (let i = shape.length - 1; i >= 0; i--) {
strides[i] = stride;
stride *= shape[i];
}
return strides;
}
// Reference Function
const fn = (x) => Math.sqrt(x);
const fnIndex = (x, index) => Math.sqrt(x);
// --- DEFINE BENCHMARK ---
const bench = new Bench({ name: 'Matrix Operations', time: time });
// 1. Math.js Standard
bench.add('mathjs: create', () => {
math.matrix(A, 'dense', 'number');
});
const AM = math.matrix(A, 'dense', 'number');
bench.add('mathjs: map (number)', () => {
AM.map(fn);
});
const AMgeneric = math.matrix(A, 'dense');
bench.add('mathjs: map (generic)', () => {
AMgeneric.map(fn);
});
bench.add('mathjs: map (index)', () => {
AM.map(fnIndex);
});
bench.add('mathjs: map skip index', () => {
AM.map(fnIndex, false, true);
});
// 2. Math.js Optimized (Hacks)
bench.add('mathjs (opt): create (no valid)', () => {
mathMatrixNoValidation(Aflat, shape, 'number', false);
});
bench.add('mathjs (opt): create (no clone)', () => {
mathMatrixNoValidation(Aflat, shape, 'number', true);
});
// 3. ndarray (stdlib)
const bufferA = new Float64Array(Aflat);
const strides = getStrides(shape);
const offset = 0;
const order = 'row-major';
bench.add('ndarray: create (view)', () => {
ndarray('float64', bufferA, shape, strides, offset, order);
});
const AflatCopy = Aflat.slice();
bench.add('ndarray: create (view generic)', () => {
ndarray('generic', AflatCopy, shape, strides, offset, order);
});
bench.add('ndarray: create (alloc)', () => {
const b = new Float64Array(Aflat);
ndarray('float64', b, shape, strides, offset, order);
});
bench.add('ndarray: create (alloc generic)', () => {
const b = Aflat.slice();
ndarray('generic', b, shape, strides, offset, order);
});
const x = ndarray('float64', bufferA, shape, strides, offset, order);
const xGeneric = ndarray(
'generic', Aflat.slice(), shape, strides, offset, order)
const bufferY = new Float64Array(size);
const y = ndarray('float64', bufferY, shape, strides, offset, order);
const yGeneric = ndarray(
'generic', new Array(size), shape, strides, offset, order);
bench.add('ndarray: map', () => {
map([x, y], fn);
});
bench.add('ndarray: unary', () => {
unary([x, y], fn);
});
bench.add('ndarray: map (generic)', () => {
map([xGeneric, yGeneric], fn);
});
bench.add('ndarray: unary (generic)', () => {
unary([xGeneric, yGeneric], fn);
});
// 4. ndarray (Hacks/Manual Objects)
bench.add('ndarray (opt): map (POJO)', () => {
// Construct Plain Old JS Objects to skip class overhead
const yRaw = {
'dtype': 'float64',
'data': new Float64Array(size),
'shape': shape,
'strides': strides,
'offset': offset,
'order': 'row-major'
};
map([x, yRaw], fn);
});
// 5. TensorFlow.js (WebGL)
// NOTE: tf.tensor2d is technically both creation + data upload.
bench.add('tfjs: create (flat array, shape)', () => {
const t = tf.tensor2d(Aflat, shape);
t.dispose(); // IMPORTANT: Must dispose even on WebGL
});
bench.add('tfjs: create (nested array)', () => {
const t = tf.tensor2d(A);
t.dispose(); // IMPORTANT: Must dispose even on WebGL
});
const tfData = tf.tensor2d(Aflat, shape);
bench.add('tfjs: map (sqrt)', () => {
const res = tf.sqrt(tfData);
res.dispose(); // IMPORTANT: Prevent memory leak
});
// --- AUTOMATED VALIDATION ---
log('=== STARTING VALIDATION ===');
const referenceResult = AM.map(fn).toArray(); // Golden standard
let allValid = true;
// We manually run every benchmark function once and check outputs
// Note: 'create' tasks return objects, 'map' tasks perform side effects or return objects
// Validate Creation of MathJS Optimized
const mOpt = mathMatrixNoValidation(Aflat, shape, 'number', true);
// For flat array input, we need to ensure the mathjs matrix handles it or we reshape validation
// Since math.matrix(flat) creates a vector, but our shape is N,N.
// The "hack" assumes internal mathjs structure. Let's validate data integrity.
if (mOpt._data.length !== size) {
log(`✗ mathjs (opt): create - Size Mismatch`);
allValid = false;
} else {
log(`✓ mathjs (opt): create`);
}
// Validate ndarray map
const valBufferY = new Float64Array(size);
const valY = ndarray('float64', valBufferY, shape, strides, offset, order);
map([x, valY], fn);
const valYArr = ndarray2array(valY);
if (math.deepEqual(referenceResult, valYArr)) {
log(`✓ ndarray: map`);
} else {
log(`✗ ndarray: map - Result mismatch`);
allValid = false;
}
// Validate TFJS map
const tfVal = tf.sqrt(tfData);
const tfValData = await tfVal.array();
tfVal.dispose();
if (math.deepEqual(referenceResult, tfValData)) {
log(`✓ tfjs: map`);
} else {
log(`✗ tfjs: map - Result mismatch`);
allValid = false;
}
if (allValid) {
statusEl.textContent = "All Validations Passed. Running Benchmark...";
statusEl.className = "status pass";
} else {
statusEl.textContent = "Validations Failed. Check logs.";
statusEl.className = "status fail";
}
// --- RUN BENCHMARK ---
log('\n=== RUNNING BENCHMARKS ===');
await bench.run();
log('Benchmark complete.');
console.table(bench.table());
// --- PLOTTING ---
const results = bench.table();
const labels = results.map(r => r['Task name']);
const ops = results.map(r => Number(r['Throughput avg (ops/s)'].split('±')[0]));
const colors = labels.map(l => {
if (l.includes('mathjs')) return 'rgba(255, 99, 132, 0.7)';
if (l.includes('ndarray')) return 'rgba(54, 162, 235, 0.7)';
if (l.includes('tfjs')) return 'rgba(255, 206, 86, 0.7)';
return 'gray';
});
const ctx = document.getElementById('benchmarkChart').getContext('2d');
new Chart(ctx, {
type: 'bar',
data: {
labels: labels,
datasets: [{
label: 'Operations per Second (Higher is Better)',
data: ops,
backgroundColor: colors,
borderColor: colors.map(c => c.replace('0.7', '1')),
borderWidth: 1
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
scales: {
y: {
beginAtZero: true,
title: { display: true, text: 'Ops/Sec [log]' },
type: 'logarithmic'
}
}
}
});
</script>
</body>
</html> |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
-
Math.js currently supports three types of matrics: nested Arrays, DenseMatrix, and SparseMatrix. DenseMatrix and SparseMatrix both have the same super class Matrix.
DenseMatrix supports 1 to n dimensions and stores data in nested arrays. SparseMatrix is 2 dimensional. Both matrices can hold any type of value, also mixed types. @rjbaucells has spend a lot of effort in working out SparseMatrix support and optimizing for matrices containing values of a single data type.
One longstanding wish has been to rework DenseMatrix to a format where data is stored in a flat Array. That way we could utilize JavaScript typed arrays which will speed up things and make many algorithms easier. Also, this should make many matrix algorithms easier. We could look into into integrating libraries like ndarray for this.
math.js is also moving into becoming an integrator for different data types, powered by external libraries. Currently it builds upon three external libraries (decimal.js, fraction.js, complex.js). I think we should aim for the same construction for matrices and units. Having such a structure, it will become easy to strip out for example bignumber support or matrix support from code bundled for the browser if you don't need it, which becomes more and more relevant since the library is large.
Related discussions:
What are your thoughts?
Beta Was this translation helpful? Give feedback.
All reactions