fix: mangle with destructuring

[ahabhgk]

fix #18278

What kind of change does this PR introduce?

introduce DestructuringAssignmentPropertyKeyDependency to replace the key in destructuring instead of bailout the mangleExports in some condition.

for example in #18095, we will bailout the mangleExports (canMangle: false) when the module is a reexport of another module, but in this PR, we will no longer bailout:

// module1.js
export * as module2 from "./module2"

// index.js
import { module2 } from "./module1"
const { aaa } = module2

index.js will generate:

/* harmony import */ var _module1__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./module1 */ "./module1.js");
const { /* aaa */ "q": aaa } = _module1__WEBPACK_IMPORTED_MODULE_0__/* .module2 */ .h
//      ------------------
//      replaced by DestructuringAssignmentPropertyKeyDependency, aaa -> /* aaa */ "q": aaa

and since the reexport no longer bailout the mangleExports, this should make the output size smaller in some cases.

Did you add tests for your changes?

added

Does this PR introduce a breaking change?

no

What needs to be documented once your changes are merged?

none

[webpack-bot]

For maintainers only:

• This needs to be documented (issue in webpack/webpack.js.org will be filed when merged)
• This needs to be backported to webpack 4 (issue will be created when merged)

[alexander-akait]

/cc @vankop

[vankop]

here is better to use "webpack" design. we should introduce new hook for destructuring assignment in JavascriptParser
e.g. this.hooks.destructuringAssignment, this will allow to use "webpack" power in any plugin =)

then just add handler in HarmonyParser like:

parser.hooks.destructuringAssignment
  .for(harmonySpecifierTag)
  .tap("HarmonyImportDependencyParserPlugin", handler);

also we should not touch dependencies here.. just mark usage ( not sure here )

[vankop]

btw we dont need to bail out mangling ( only when we can't compute properties ), in dependencies we can pass range that we will change to something like "mangledExportHere": variable ( this will be next improvement with new dependency )

[ahabhgk]

@vankop I tried to refactor this but failed, I'm not very familiar with the code related to the JavascriptParser, can you give me more suggestions (add comments to specific lines under the changed files would be better :P), or you can just edit on this PR, feel free to take over this.

[webpack-bot]

@ahabhgk Thanks for your update.

I labeled the Pull Request so reviewers will review it again.

@alexander-akait Please review the new changes.

[ahabhgk]

Figured out why before failed, made a refactor, now the logic of replacing the destructuring assignment an import specifier is handled by HarmonyDestructuredImportSpecifierDependency:

import * as module from "./module"
const { a, b } = module
//--------------------- will be replaced by HarmonyDestructuredImportSpecifierDependency
//                      and `"mangledExportHere": a` will also be done by this dependency

But I am still confused about why we need to introduce the new this.hooks.destructuringAssignment hook, is it used to replace parser.destructuringAssignmentPropertiesFor? so plugins can use this hook to get some data and create dependencies from these data, instead of using parser.destructuringAssignmentPropertiesFor to get these data?

[alexander-akait]

/cc @vankop

[vankop]

so.. based on #16941 pull request. what we need to do here:

1. improve parser part ( as I see it is already there )
2. adjust all DestructuringAssignmentProperty references with new data structure ( also done as I see )
3. improve current dependencies ( only lib/dependencies/HarmonyImportSpecifierDependency.js I guess )
   • in this improvement we should I guess revert this part or fix this to allow mangling
   • then fix render part with rendering mangled version

[vankop]

in render part we just need to add ( dont change existing code ) something like:

if (dep. referencedPropertiesInDestructuring)
  for (const property of dep. referencedPropertiesInDestructuring) source.replace(...)

[vankop]

if you want I can finish this PR @ahabhgk

[ahabhgk]

@vankop Yes, feel free to change on this PR