Rewrite all functions to arrow to optimize ESM size #208
Conversation
|
@erykpiast You never cease to amaze 👏 🚀 |
| ? a.join('.') | ||
| : typeof a === 'string' || typeof a === 'number' ? '' + a : '' | ||
| } | ||
| export default (a) => Array.isArray(a) |
There was a problem hiding this comment.
With often used static methods imported from separate module, in this case export const { isArray } = Array, the whole thing should minify even better.
There was a problem hiding this comment.
You're completely right! If only @Beraliv likes that, I'd love to implement it!
There was a problem hiding this comment.
With often used static methods imported from separate module, in this case
export const { isArray } = Array, the whole thing should minify even better.
@plesiecki This is good for functions which have the same number of arguments as our implementation (and the same order)
You're completely right! If only @Beraliv likes that, I'd love to implement it!
@erykpiast so yeah, you should change that for sure! 🚀
| @@ -12,6 +12,7 @@ | |||
| "@babel/plugin-transform-arrow-functions", | |||
| "@babel/plugin-transform-function-name", | |||
| "@babel/plugin-transform-spread", | |||
| "@babel/plugin-transform-parameters" | |||
| "@babel/plugin-transform-parameters", | |||
| "@babel/plugin-transform-shorthand-properties" | |||
There was a problem hiding this comment.
Are you okay with that? I think this transform produces code of reasonable size. It's no bigger than handwritten ES5. And ES6+ version is much more concise :)
There was a problem hiding this comment.
✅ No, this is right because cjs cannot support it right now but definitely should
| @@ -1,4 +1,4 @@ | |||
| function reduceIterable(cb, acc, gen) { | |||
| const reduceIterable = (cb, acc, gen) => { | |||
There was a problem hiding this comment.
👌 this is good helpers still have names, because stack trace will be readable
There was a problem hiding this comment.
Yeah, I try to care about it as much as about a bundle size! :)
erykpiast
force-pushed
the
enhance/arrow-function
branch
from
c15cfad
to
416215d
Compare
|
@Beraliv do you have any issues with |
| @@ -1,6 +1,6 @@ | |||
| import mean from '../mean' | |||
|
|
|||
| export default (list) => { | |||
| const median = (list) => { | |||
erykpiast
force-pushed
the
enhance/arrow-function
branch
from
c9d39e7
to
7c15883
Compare
erykpiast
force-pushed
the
enhance/arrow-function
branch
from
5f81dc8
to
49034b4
Compare
|
@erykpiast do you have the public project where I can see Terser minification? Or is it private? I have an idea to follow changes with the custom project which will tell us how much it costs with Terser |
I've handwritten a bash script for that :) If you wish, I could add it to const sizeLimit = name => {
const index = getIndex(name);
const ramda = getSize(getRamda(name));
return Promise.all([
getSize(index),
getSize(index, { terser: true }),
getSize(ramda).catch(() => 'n/a'),
getSize(ramda, { terser: true }).catch(() => 'n/a'),
]).then(([size, minifiedSize, ramdaSize, ramdaMinifiedSize]) => ({
name,
size,
minifiedSize,
ramdaSize,
ramdaMinifiedSize
}));
};What do you think? |
|
I've added an issue to ai/size-limit#178. Support will be appreciated! :) |
I think we should first create an issue in Here I created an issue #212 UPDATE:
Sure! |
|
@Beraliv I've added one more thing - marked the package as side-effects-free. As far as I understand it's completely safe for nanoutils. What do you think? One of the non-obvious benefits of this would be the exports analysis section available at bundlephobia. See one for ramda. |
Yeah, I've had a look at it recently, good you've already added it 🎉 Also, there's a plugin for babel babel-plugin-annotate-pure-calls, which adds That can also decrease the size of the modules Check out the issue - #215 |
|
@erykpiast you can resolve conflicts here and we can finally merge this to master 🔥 |
- median is used internally in script calculating sizes - toString is recursive
It'll help Webpack with [tree-shaking](https://webpack.js.org/guides/tree-shaking/#mark-the-file-as-side-effect-free)
erykpiast
force-pushed
the
enhance/arrow-function
branch
from
0fec5ea
to
c6b35a9
Compare
|
Done! I'll go with that pure plugin stuff with the next PR. If we just add it to |
|
@Beraliv I've written an article where I recommend nanoutils as a replacement for lodash (along other stuff). If you like it, please share :) Here is the link: https://dev.to/erykpiast/the-story-about-a-few-imports-40jm |
Thanks, really interesting article, followed the details till the end 😊 Btw did you find any inconvenience in library usage except for tree-shaking? |
|
I'm glad to hear 😊 No, so far no issues! I used The only thing you probably noticed in the article - I recommended more generic Babel plugin than |
Yeah, I've seen that |
It resolves #205.
Difference for concatenated size of ES6 code minified with Terser is -3,85 kB (-9,53%) 🎉
Details