refactor: 📦 smaller bundlesize limit #20356

afc163 · 2019-12-20T02:38:31Z

@zombieJ 看看能不能努力一下。

这个 PR 修改的地方有：

最终体积优化效果：

js 减小 6.25kb。

- 302.98kb
+ 296.73kb

css 减小 0.66kb。

- 54.11kb
+ 53.45kb

css 里 50kb 目标还有 3kb，可能需要等 Grid 的 flex 优化才能做到。@zombieJ

移除掉这部分循环生成的样式代码后的结果点此查看。

- 53.45kb
+ 48.33kb

close #19871

netlify · 2019-12-20T02:38:40Z

Deploy preview for ant-design failed.

Built with commit e08153d69fe3c013c4aca590e86ce14b983b14e3

https://app.netlify.com/sites/ant-design/deploys/5e008f1945f3f40007880479

codesandbox-ci · 2019-12-20T02:49:17Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit e08f5ff:

Sandbox	Source
antd reproduction template	Configuration

codecov · 2019-12-20T02:49:22Z

Codecov Report

Merging #20356 into 4.0-prepare will increase coverage by 0.01%.
The diff coverage is 100%.

@@               Coverage Diff               @@
##           4.0-prepare   #20356      +/-   ##
===============================================
+ Coverage        97.56%   97.57%   +0.01%     
===============================================
  Files              295      295              
  Lines             6849     6754      -95     
  Branches          1878     1822      -56     
===============================================
- Hits              6682     6590      -92     
+ Misses             167      164       -3

Impacted Files	Coverage Δ
components/mentions/index.tsx	`100% <ø> (ø)`	⬆️
components/input/ResizableTextArea.tsx	`95% <ø> (-0.13%)`	⬇️
components/typography/Base.tsx	`100% <ø> (ø)`	⬆️
components/progress/progress.tsx	`100% <ø> (ø)`	⬆️
components/tree/DirectoryTree.tsx	`97.84% <ø> (-0.03%)`	⬇️
components/button/button.tsx	`100% <ø> (ø)`	⬆️
components/affix/index.tsx	`97.29% <ø> (-0.03%)`	⬇️
components/statistic/Countdown.tsx	`100% <ø> (ø)`	⬆️
components/input/Input.tsx	`100% <ø> (ø)`	⬆️
components/badge/ScrollNumber.tsx	`98.68% <ø> (-0.02%)`	⬇️
... and 35 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 97f9cba...e08f5ff. Read the comment docs.

zombieJ · 2019-12-20T05:52:11Z

这个是 gzip 的 size，感觉略有挑战：

V3

V4

afc163 · 2019-12-20T05:59:17Z

有挑战才有意义。

这个先放在这里，跟踪一下大小。

第三方依赖的严格管理。
无效样式的清理。

afc163 · 2019-12-20T09:38:47Z

下降了 2.22k！

shaodahong · 2019-12-20T12:37:03Z

底层组件还是有优化的空间，但属于重构的方面了

zombieJ · 2019-12-20T14:36:07Z

dist 换 rollup 会不会有帮助？
https://github.com/ant-design/antd-tools/blob/master/lib/gulpfile.js#L46

shaodahong · 2019-12-20T15:08:28Z

不会，我是觉得底层这些组件颗粒度还不够细，尤其现在 IE11 最低兼容后比如 Upload 就可以再重构下， animation 也是

shaodahong · 2019-12-20T15:10:51Z

browserslist 现在有设置么

afc163 · 2019-12-20T15:28:17Z

dist 换 rollup 会不会有帮助？

应该有，可以试试。

afc163 · 2019-12-23T05:59:54Z

🌈  ant-design@4.0.0-beta.0 git:❨4.0-bundlesize❩ ✗ npm ls rc-trigger
antd@4.0.0-beta.0 /Users/afc163/Projects/ant-design
├─┬ @ant-design/bisheng-plugin@2.0.1
│ └─┬ antd@4.0.0-beta.0
│   ├─┬ rc-calendar@9.15.8
│   │ └── rc-trigger@2.6.5 
│   └── rc-trigger@4.0.0-alpha.8  deduped
├─┬ rc-cascader@1.0.0-alpha.0
│ └── rc-trigger@4.0.0-alpha.8  deduped
├─┬ rc-dropdown@3.0.0-alpha.0
│ └── rc-trigger@4.0.0-alpha.8  deduped
├─┬ rc-mentions@1.0.0-alpha.0
│ └── rc-trigger@4.0.0-alpha.8  deduped
├─┬ rc-menu@8.0.0-alpha.5
│ └── rc-trigger@4.0.0-alpha.8  deduped
├─┬ rc-picker@0.0.1-alpha.62
│ └── rc-trigger@4.0.0-alpha.8  deduped
├─┬ rc-select@10.0.0-alpha.32
│ └── rc-trigger@4.0.0-alpha.8  deduped
├─┬ rc-slider@8.7.1
│ └─┬ rc-tooltip@3.7.3
│   └── rc-trigger@2.6.5 
├─┬ rc-time-picker@4.0.0-alpha.2
│ └── rc-trigger@4.0.0-alpha.8  deduped
├─┬ rc-tooltip@4.0.0-alpha.3
│ └── rc-trigger@4.0.0-alpha.8  deduped
└── rc-trigger@4.0.0-alpha.8

afc163 · 2019-12-23T09:25:17Z

最终效果。

- 302.98kb
+ 296.73kb

- 54.11kb
+ 53.45kb

afc163 · 2019-12-23T10:10:44Z

移除掉 Grid 里这部分循环生成的样式代码后的结果点此查看。

- 53.45kb
+ 48.33kb

afc163 · 2019-12-23T10:14:03Z

两个 action 留给 @zombieJ 尝试。

替换 webpack 为 rollup。
Grid 里的 loop 样式移除。

zombieJ · 2019-12-23T10:19:43Z

这个是不是也可以关了？ #19871

afc163 · 2019-12-23T10:21:31Z

好像没什么关系，#19871 是优化了 defaultProps 的定义，不是 propTypes。

zombieJ · 2019-12-23T10:25:04Z

propTypes 定义和 component props 不同导致的 defaultProps 问题，没有 propTypes 了应该就不会冲突了：

afc163 · 2019-12-23T10:30:52Z

propTypes 定义和 component props 不同导致的 defaultProps 问题，没有 propTypes 了应该就不会冲突了：

嗯，如果是这个问题那就解决了。

zombieJ · 2019-12-25T06:15:07Z

修了几个 bug，又过 300 了。我再调调……

re-thc · 2020-01-10T09:49:13Z

不要使用momentjs好吗？58kb!

afc163 · 2020-01-11T15:22:05Z

@hc-codersatlas https://next.ant.design/docs/react/replace-moment-cn

pr-triage bot added the PR: unreviewed label Dec 20, 2019

afc163 assigned zombieJ Dec 20, 2019

afc163 changed the title ~~📦 samller bundlesize limit~~ refactor: 📦 samller bundlesize limit Dec 20, 2019

auto-add-label bot added the refactor label Dec 20, 2019

afc163 requested a review from zombieJ as a code owner December 20, 2019 09:24

afc163 force-pushed the 4.0-bundlesize branch from c6e6ef3 to 36d1ef9 Compare December 20, 2019 09:47

afc163 changed the title ~~refactor: 📦 samller bundlesize limit~~ refactor: 📦 smaller bundlesize limit Dec 20, 2019

afc163 force-pushed the 4.0-bundlesize branch 2 times, most recently from f94c890 to d096c57 Compare December 20, 2019 11:03

afc163 changed the title ~~refactor: 📦 smaller bundlesize limit~~ [WIP] refactor: 📦 smaller bundlesize limit Dec 20, 2019

pr-triage bot removed the PR: unreviewed label Dec 20, 2019

weekly-digest bot mentioned this pull request Dec 22, 2019

Weekly Digest (15 December, 2019 - 22 December, 2019) #20377

Closed

afc163 force-pushed the 4.0-bundlesize branch 2 times, most recently from 400e78f to 9ee2274 Compare December 23, 2019 08:45

afc163 added 4 commits December 23, 2019 17:07

📦 samller bundlesize limit

380dc23

🗑️ remove React static PropTypes

133ba38

🗑️ remove react-lifecycles-compat

0ffc67e

🗑️ remove matchMedia polyfill

d623c1d

afc163 added 3 commits December 23, 2019 17:07

🆙 upgrade rc-upload

d92cbbb

🗑️ drop unused swing motion css

d7aaa8c

✅ update upload snapshots

75e95ba

afc163 changed the title ~~[WIP] refactor: 📦 smaller bundlesize limit~~ refactor: 📦 smaller bundlesize limit Dec 23, 2019

pr-triage bot added the PR: unreviewed label Dec 23, 2019

afc163 force-pushed the 4.0-bundlesize branch from 9ee2274 to 75e95ba Compare December 23, 2019 09:08

📦 lift css bundlesize limit to 55kb

e08f5ff

afc163 force-pushed the 4.0-bundlesize branch 2 times, most recently from e08153d to f6207e0 Compare December 23, 2019 10:03

afc163 force-pushed the 4.0-bundlesize branch from f6207e0 to e08f5ff Compare December 23, 2019 10:11

zombieJ mentioned this pull request Dec 23, 2019

4.0 smaller bundle size #20392

Closed

2 tasks

zombieJ approved these changes Dec 23, 2019

View reviewed changes

pr-triage bot added PR: reviewed-approved and removed PR: unreviewed labels Dec 23, 2019

zombieJ merged commit 8501b70 into 4.0-prepare Dec 23, 2019

zombieJ deleted the 4.0-bundlesize branch December 23, 2019 10:33

pr-triage bot added PR: merged and removed PR: reviewed-approved labels Dec 23, 2019

This was referenced Dec 23, 2019

feat(typings): props and defaultProps consistency #19995

Closed

fix: responsiveObserve init miss sizing #20400

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

refactor: 📦 smaller bundlesize limit #20356

refactor: 📦 smaller bundlesize limit #20356

afc163 commented Dec 20, 2019 •

edited

Loading

netlify bot commented Dec 20, 2019 •

edited

Loading

codesandbox-ci bot commented Dec 20, 2019 •

edited

Loading

codecov bot commented Dec 20, 2019 •

edited

Loading

zombieJ commented Dec 20, 2019

afc163 commented Dec 20, 2019 •

edited

Loading

afc163 commented Dec 20, 2019 •

edited

Loading

shaodahong commented Dec 20, 2019

zombieJ commented Dec 20, 2019

shaodahong commented Dec 20, 2019

shaodahong commented Dec 20, 2019

afc163 commented Dec 20, 2019

afc163 commented Dec 23, 2019

afc163 commented Dec 23, 2019 •

edited

Loading

afc163 commented Dec 23, 2019 •

edited

Loading

afc163 commented Dec 23, 2019 •

edited

Loading

zombieJ commented Dec 23, 2019

afc163 commented Dec 23, 2019 •

edited

Loading

zombieJ commented Dec 23, 2019 •

edited

Loading

afc163 commented Dec 23, 2019

zombieJ commented Dec 25, 2019

re-thc commented Jan 10, 2020

afc163 commented Jan 11, 2020

refactor: 📦 smaller bundlesize limit #20356

refactor: 📦 smaller bundlesize limit #20356

Conversation

afc163 commented Dec 20, 2019 • edited Loading

netlify bot commented Dec 20, 2019 • edited Loading

codesandbox-ci bot commented Dec 20, 2019 • edited Loading

codecov bot commented Dec 20, 2019 • edited Loading

Codecov Report

zombieJ commented Dec 20, 2019

V3

V4

afc163 commented Dec 20, 2019 • edited Loading

afc163 commented Dec 20, 2019 • edited Loading

shaodahong commented Dec 20, 2019

zombieJ commented Dec 20, 2019

shaodahong commented Dec 20, 2019

shaodahong commented Dec 20, 2019

afc163 commented Dec 20, 2019

afc163 commented Dec 23, 2019

afc163 commented Dec 23, 2019 • edited Loading

afc163 commented Dec 23, 2019 • edited Loading

afc163 commented Dec 23, 2019 • edited Loading

zombieJ commented Dec 23, 2019

afc163 commented Dec 23, 2019 • edited Loading

zombieJ commented Dec 23, 2019 • edited Loading

afc163 commented Dec 23, 2019

zombieJ commented Dec 25, 2019

re-thc commented Jan 10, 2020

afc163 commented Jan 11, 2020

afc163 commented Dec 20, 2019 •

edited

Loading

netlify bot commented Dec 20, 2019 •

edited

Loading

codesandbox-ci bot commented Dec 20, 2019 •

edited

Loading

codecov bot commented Dec 20, 2019 •

edited

Loading

afc163 commented Dec 20, 2019 •

edited

Loading

afc163 commented Dec 20, 2019 •

edited

Loading

afc163 commented Dec 23, 2019 •

edited

Loading

afc163 commented Dec 23, 2019 •

edited

Loading

afc163 commented Dec 23, 2019 •

edited

Loading

afc163 commented Dec 23, 2019 •

edited

Loading

zombieJ commented Dec 23, 2019 •

edited

Loading