Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: improved tree-shaking when importing individual components #3462

Merged
merged 402 commits into from
Jun 11, 2019

Conversation

tmorehouse
Copy link
Member

@tmorehouse tmorehouse commented Jun 6, 2019

Describe the PR

Create simple plugin object factory function, which can be marked as /*#__PURE__*/ when exporting a plugin (safe for exclusion with no side effects). Rollup and Webpack/Terser will sometimes not exclude exports that are results of function calls, as they are unsure if the function call has any side effects, so whenever we call Vue.extend(..), pluginFactory(...), or installFactory(...), we prefix it with a /*#__PURE__*/ comment. For better tree shaking and dead code elimination (DCE) of dist/bootstrap-vue.esm.js bundle (if anyone uses it, and is doing selective imports). Based on https://iamakulov.com/notes/polished-webpack/

Also includes a tweak for component and directive top level exports for even better individual component/directive import tree-shaking (until Webpack v5 is released: webpack/webpack#9203, webpack/webpack#8057)

PR checklist

What kind of change does this PR introduce? (check at least one)

  • Bugfix
  • Feature
  • Enhancement
  • ARIA accessibility
  • Documentation update
  • Other (please describe) code refactor for improved tree shaking

Does this PR introduce a breaking change? (check one)

  • No
  • Yes (please describe)

The PR fulfills these requirements:

  • It's submitted to the dev branch, not the master branch
  • When resolving a specific issue, it's referenced in the PR's title (i.e. [...] (fixes #xxx[,#xxx]), where "xxx" is the issue number)
  • It should address only one issue or feature. If adding multiple features or fixing a bug and adding a new feature, break them into separate PRs if at all possible.
  • The title should follow the Conventional Commits naming convention (i.e. fix(alert): not alerting during SSR render, docs(badge): update pill examples, fix typos, chore: fix typo in README, etc). This is very important, as the CHANGELOG is generated from these messages.

If new features/enhancement/fixes are added or changed:

  • Includes documentation updates (including updating the component's package.json for slot and event changes)
  • New/updated tests are included and passing (if required)
  • Existing test suites are passing
  • The changes have not impacted the functionality of other components or directives
  • ARIA Accessibility has been taken into consideration (Does it affect screen reader users or keyboard only users? Clickable items should be in the tab index, etc.)

If adding a new feature, or changing the functionality of an existing feature, the PR's
description above includes:

  • A convincing reason for adding this feature (to avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it)

@codecov
Copy link

codecov bot commented Jun 6, 2019

Codecov Report

Merging #3462 into dev will increase coverage by 0.01%.
The diff coverage is 100%.

Impacted file tree graph

@@            Coverage Diff             @@
##              dev    #3462      +/-   ##
==========================================
+ Coverage   99.24%   99.25%   +0.01%     
==========================================
  Files         222      224       +2     
  Lines        4213     4300      +87     
  Branches     1225     1226       +1     
==========================================
+ Hits         4181     4268      +87     
  Misses         26       26              
  Partials        6        6
Impacted Files Coverage Δ
src/mixins/pagination.js 100% <ø> (ø) ⬆️
src/mixins/form-radio-check-group.js 100% <ø> (ø) ⬆️
src/components/nav/index.js 100% <100%> (ø) ⬆️
src/components/alert/index.js 100% <100%> (ø) ⬆️
src/directives/modal/modal.js 100% <100%> (ø) ⬆️
src/components/spinner/index.js 100% <100%> (ø) ⬆️
src/components/breadcrumb/breadcrumb.js 100% <100%> (ø) ⬆️
src/components/modal/index.js 100% <100%> (ø) ⬆️
src/components/image/img.js 100% <100%> (ø) ⬆️
src/components/table/index.js 100% <100%> (ø) ⬆️
... and 138 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 2b431b9...2dfffc0. Read the comment docs.

@tmorehouse tmorehouse changed the title chore: create plugin object factory function chore: create plugin object factory function and improve tree-shaking of larger components Jun 7, 2019
@tmorehouse tmorehouse marked this pull request as ready for review June 8, 2019 03:04
@tmorehouse tmorehouse requested review from pi0 and jacobmllr95 June 8, 2019 03:04
@tmorehouse tmorehouse changed the title chore: create plugin object factory function and improve tree-shaking of larger components chore: create plugin object factory function and improve tree-shaking of larger component groups Jun 8, 2019
@tmorehouse tmorehouse changed the title chore: create plugin object factory function and improve tree-shaking of larger component groups chore: create plugin object factory function and improve tree-shaking of component groups Jun 9, 2019
@tmorehouse tmorehouse changed the title chore: create plugin object factory function and improve tree-shaking when importing individual components feat: improved tree-shaking when importing individual components Jun 10, 2019
alphebetize plugins
@tmorehouse tmorehouse merged commit 2df1ab9 into dev Jun 11, 2019
@tmorehouse tmorehouse deleted the tmorehouse/plugins branch June 11, 2019 01:01
@TrumanGu TrumanGu mentioned this pull request Aug 12, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants