-
Notifications
You must be signed in to change notification settings - Fork 501
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Following #444, I bring perf improvements from @smooth-ui/system into styled-system. The goal is to make this library the best one and the universal one. What have changed? - I switched to the core of @smooth-ui/system, more performant especially with multiple compose. Composition is now flat, it means you can compose 10 times and it will not be slower. We are probably in O(n), where "n" is the number of props. - I switched to rollup in order to optimize build, provide umd and improve tree shaking What are the breaking changes? - We now rely on the order of props. ES2015 is here and we can rely on it, see this tweet for context: https://twitter.com/ianstormtaylor/status/1115680037875752963. - Object keys or array keys have now equivalent parsing
- Loading branch information
Showing
11 changed files
with
2,958 additions
and
383 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,14 +1,3 @@ | ||
.DS_Store | ||
.prettierrc | ||
.nyc_output | ||
.travis.yml | ||
coverage | ||
coverage.lcov | ||
bench | ||
docs | ||
src | ||
examples | ||
babel.config.js | ||
test | ||
CONTRIBUTING.md | ||
CODE_OF_CONDUCT.md | ||
/* | ||
!/dist/**/*.js | ||
!/props.js |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
{ | ||
"dist/styled-system.cjs.js": { | ||
"bundled": 18794, | ||
"minified": 11425, | ||
"gzipped": 3172 | ||
}, | ||
"dist/styled-system.esm.js": { | ||
"bundled": 16608, | ||
"minified": 9477, | ||
"gzipped": 2776, | ||
"treeshaked": { | ||
"rollup": { | ||
"code": 79, | ||
"import_statements": 44 | ||
}, | ||
"webpack": { | ||
"code": 1112 | ||
} | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,29 +1,7 @@ | ||
module.exports = { | ||
env: { | ||
test: { | ||
presets: [ | ||
[ '@babel/env', { loose: true } ], | ||
'@babel/react' | ||
], | ||
plugins: [ | ||
'@babel/transform-runtime' | ||
] | ||
presets: [['@babel/preset-env', { loose: true }], '@babel/react'], | ||
}, | ||
cjs: { | ||
presets: [ | ||
[ '@babel/env', { loose: true } ] | ||
], | ||
plugins: [ | ||
'@babel/transform-runtime' | ||
] | ||
}, | ||
esm: { | ||
presets: [ | ||
[ '@babel/env', { loose: true, modules: false } ] | ||
], | ||
plugins: [ | ||
['@babel/transform-runtime', { useESModules: true }] | ||
] | ||
}, | ||
} | ||
}, | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
/* eslint-disable no-console, import/no-unresolved */ | ||
const Benchmark = require('benchmark') | ||
|
||
const libs = [ | ||
{ | ||
name: 'actual', | ||
module: require('../dist/styled-system.cjs'), | ||
}, | ||
{ | ||
name: 'v4', | ||
module: require('./v4.1.0'), | ||
}, | ||
].map(({ name, module: { compose, fontSize, space } }) => { | ||
const system = compose( | ||
fontSize, | ||
space | ||
) | ||
const run = () => system({ p: [10, 20], mt: 10, m: '20px', fontSize: 10 }) | ||
return { name, run } | ||
}) | ||
|
||
const suite = new Benchmark.Suite() | ||
|
||
console.log('Initial run...') | ||
|
||
libs.forEach(lib => { | ||
console.log(lib.name, lib.run()) | ||
suite.add(lib.name, lib.run) | ||
}) | ||
|
||
console.log('Run suite...') | ||
|
||
suite | ||
.on('cycle', event => { | ||
console.log(String(event.target)) | ||
}) | ||
.on('complete', function onComplete() { | ||
console.log(`Fastest is ${this.filter('fastest').map('name')}`) | ||
}) | ||
.run({ async: true }) |
Oops, something went wrong.