stylex
stylex copied to clipboard
facebook
feat: Add new stylex.positionTry for @property-try declarations
What changed / motivation ?
Adds a new stylex.positionTry API that lets you create @position-try rules.
It works pretty much just like stylex.keyframes.
Linked PR/Issues
Fixes #1003
Additional Context
New test file is included which shows the new feature working.
workflow: benchmarks/perf
Comparison of performance test results, measured in operations per second. Larger is better.
[email protected] compare node ./compare.js /tmp/tmp.QiDPpfHoZ6 /tmp/tmp.mPfYmnMEmQ
| Results | Base | Patch | Ratio | |
|---|---|---|---|---|
| babel-plugin: stylex.create | ||||
| · basic create | 534 | 536 | 1.00 | + |
| · complex create | 181 | 196 | 1.08 | !! |
| babel-plugin: stylex.createTheme | ||||
| · basic themes | 454 | 462 | 1.02 | + |
| · complex themes | 42 | 42 | 1.00 |
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
workflow: benchmarks/size
Comparison of minified (terser) and compressed (brotli) size results, measured in bytes. Smaller is better.
[email protected] compare node ./compare.js /tmp/tmp.vxfN9PRt63 /tmp/tmp.vWI3GbCzHp
| Results | Base | Patch | Ratio | |
|---|---|---|---|---|
| @stylexjs/stylex/lib/cjs/stylex.js | ||||
| · compressed | 1,172 | 1,200 | 1.02 | + |
| · minified | 3,395 | 3,513 | 1.03 | + |
| @stylexjs/stylex/lib/cjs/inject.js | ||||
| · compressed | 1,227 | 1,227 | 1.00 | |
| · minified | 3,224 | 3,224 | 1.00 | |
| benchmarks/size/.build/bundle.js | ||||
| · compressed | 537,611 | 537,611 | 1.00 | |
| · minified | 7,435,904 | 7,435,904 | 1.00 | |
| benchmarks/size/.build/stylex.css | ||||
| · compressed | 100,509 | 100,509 | 1.00 | |
| · minified | 754,513 | 754,513 | 1.00 |