3px vs 5px blur

JavaScript performance comparison

Revision 2 of this test case created

Preparation code

 <script src="http://fabricjs.com/lib/fabric.js"></script>
<script>
Benchmark.prototype.setup = function() {
    var matrix5 = [1/1048576,10/1048576,45/1048576,120/1048576,210/1048576,252/1048576,210/1048576,120/1048576,45/1048576,10/1048576,1/1048576,10/1048576,100/1048576,450/1048576,1200/1048576,2100/1048576,2520/1048576,2100/1048576,1200/1048576,450/1048576,100/1048576,10/1048576,45/1048576,450/1048576,2025/1048576,5400/1048576,9450/1048576,11340/1048576,9450/1048576,5400/1048576,2025/1048576,450/1048576,45/1048576,120/1048576,1200/1048576,5400/1048576,14400/1048576,25200/1048576,30240/1048576,25200/1048576,14400/1048576,5400/1048576,1200/1048576,120/1048576,210/1048576,2100/1048576,9450/1048576,25200/1048576,44100/1048576,52920/1048576,44100/1048576,25200/1048576,9450/1048576,2100/1048576,210/1048576,252/1048576,2520/1048576,11340/1048576,30240/1048576,52920/1048576,63504/1048576,52920/1048576,30240/1048576,11340/1048576,2520/1048576,252/1048576,210/1048576,2100/1048576,9450/1048576,25200/1048576,44100/1048576,52920/1048576,44100/1048576,25200/1048576,9450/1048576,2100/1048576,210/1048576,120/1048576,1200/1048576,5400/1048576,14400/1048576,25200/1048576,30240/1048576,25200/1048576,14400/1048576,5400/1048576,1200/1048576,120/1048576,45/1048576,450/1048576,2025/1048576,5400/1048576,9450/1048576,11340/1048576,9450/1048576,5400/1048576,2025/1048576,450/1048576,45/1048576,10/1048576,100/1048576,450/1048576,1200/1048576,2100/1048576,2520/1048576,2100/1048576,1200/1048576,450/1048576,100/1048576,10/1048576,1/1048576,10/1048576,45/1048576,120/1048576,210/1048576,252/1048576,210/1048576,120/1048576,45/1048576,10/1048576,1/1048576],
    matrix3 = [1/84, 1/84, 1/84, 2/84, 1/84, 1/84, 1/84,
                                        1/84, 1/84, 2/84, 2/84, 2/84, 1/84, 1/84,
                                        1/84, 2/84, 3/84, 3/84, 3/84, 2/84, 1/84,
                                        2/84, 2/84, 3/84, 4/84, 3/84, 2/84, 2/84,
                                        1/84, 2/84, 3/84, 3/84, 3/84, 1/84, 1/84,
                                        1/84, 1/84, 2/84, 2/84, 2/84, 1/84, 1/84,
                                        1/84, 1/84, 1/84, 2/84, 1/84, 1/84, 1/84
                                ];
};
</script>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
3px
fabric.Image.fromURL("url(data:image/gif;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPg0KCTxkZWZzPg0KCQk8cmFkaWFsR3JhZGllbnQgaWQ9InN1biIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNDUlIj4NCgkJCTxzdG9wIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6aHNsKDIxMCwxMDAlLDUwJSk7Ii8+DQoJCQk8c3RvcCBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOmhzbGEoMjEwLDEwMCUsNTAlLDApOyIvPg0KCQk8L3JhZGlhbEdyYWRpZW50Pg0KCTwvZGVmcz4NCgk8Y2lyY2xlIGN4PSI1MCUiIGN5PSIxNTBweCIgcj0iNzAwIiBzdHJva2UtZGFzaGFycmF5PSIxMDAiIHN0cm9rZT0idXJsKCNzdW4pIiBmaWxsPSJub25lIiBzdHJva2Utd2lkdGg9IjE0MDAiLz4NCjwvc3ZnPg==)", function(image){var filter = new fabric.Image.filters.Convolute(matrix3);

image.filters.push(filter);
image.applyFilters();
});



 
pending…
5px
fabric.Image.fromURL("url(data:image/gif;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPg0KCTxkZWZzPg0KCQk8cmFkaWFsR3JhZGllbnQgaWQ9InN1biIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNDUlIj4NCgkJCTxzdG9wIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6aHNsKDIxMCwxMDAlLDUwJSk7Ii8+DQoJCQk8c3RvcCBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOmhzbGEoMjEwLDEwMCUsNTAlLDApOyIvPg0KCQk8L3JhZGlhbEdyYWRpZW50Pg0KCTwvZGVmcz4NCgk8Y2lyY2xlIGN4PSI1MCUiIGN5PSIxNTBweCIgcj0iNzAwIiBzdHJva2UtZGFzaGFycmF5PSIxMDAiIHN0cm9rZT0idXJsKCNzdW4pIiBmaWxsPSJub25lIiBzdHJva2Utd2lkdGg9IjE0MDAiLz4NCjwvc3ZnPg==)", function(image){var filter = new fabric.Image.filters.Convolute(matrix5);

image.filters.push(filter);
image.applyFilters();
});
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment