Comparing
12-26-feat_transformer_class-properties_transform_static_instance_accessor_methods
(ad77ad5
) with12-26-feat_transformer_class-properties_transform_static_private_method_invoking
(e405f79
)0%
- Improvements
- 0
- Regressions
- 0
- Untouched
- 29
- New
- 0
- Dropped
- 0
- Ignored
- 0
Benchmarks
Passed
transformer[RadixUIAdoptionSection.jsx]
tasks/benchmark/benches/transformer.rs::transformer::bench_transformer::transformer[RadixUIAdoptionSection.jsx]+1%
145.4 µs
144.5 µs
parser[RadixUIAdoptionSection.jsx]
tasks/benchmark/benches/parser.rs::parser::bench_parser::parser[RadixUIAdoptionSection.jsx]0%
87.4 µs
87.2 µs
lexer[RadixUIAdoptionSection.jsx]
tasks/benchmark/benches/lexer.rs::lexer::bench_lexer::lexer[RadixUIAdoptionSection.jsx]0%
24 µs
23.9 µs
transformer[cal.com.tsx]
tasks/benchmark/benches/transformer.rs::transformer::bench_transformer::transformer[cal.com.tsx]0%
35.1 ms
35.1 ms
transformer[checker.ts]
tasks/benchmark/benches/transformer.rs::transformer::bench_transformer::transformer[checker.ts]0%
25.4 ms
25.3 ms
minifier[react.development.js]
tasks/benchmark/benches/minifier.rs::minifier::bench_minifier::minifier[react.development.js]0%
1.2 ms
1.2 ms
semantic[checker.ts]
tasks/benchmark/benches/semantic.rs::semantic::bench_semantic::semantic[checker.ts]0%
65.8 ms
65.8 ms
parser[cal.com.tsx]
tasks/benchmark/benches/parser.rs::parser::bench_parser::parser[cal.com.tsx]0%
29.6 ms
29.6 ms
lexer[antd.js]
tasks/benchmark/benches/lexer.rs::lexer::bench_lexer::lexer[antd.js]0%
22.3 ms
22.3 ms
parser[antd.js]
tasks/benchmark/benches/parser.rs::parser::bench_parser::parser[antd.js]0%
107.2 ms
107.1 ms
linter[cal.com.tsx]
tasks/benchmark/benches/linter.rs::linter::bench_linter::linter[cal.com.tsx]0%
1.1 s
1.1 s
lexer[pdf.mjs]
tasks/benchmark/benches/lexer.rs::lexer::bench_lexer::lexer[pdf.mjs]0%
3.6 ms
3.6 ms
lexer[cal.com.tsx]
tasks/benchmark/benches/lexer.rs::lexer::bench_lexer::lexer[cal.com.tsx]0%
5.5 ms
5.5 ms
parser[checker.ts]
tasks/benchmark/benches/parser.rs::parser::bench_parser::parser[checker.ts]0%
54 ms
54 ms
minifier[antd.js]
tasks/benchmark/benches/minifier.rs::minifier::bench_minifier::minifier[antd.js]0%
164.4 ms
164.4 ms
linter[checker.ts]
tasks/benchmark/benches/linter.rs::linter::bench_linter::linter[checker.ts]0%
2.7 s
2.7 s
lexer[checker.ts]
tasks/benchmark/benches/lexer.rs::lexer::bench_lexer::lexer[checker.ts]0%
13.2 ms
13.2 ms
isolated-declarations[vue-id.ts]
tasks/benchmark/benches/isolated_declarations.rs::transformer::bench_isolated_declarations::isolated-declarations[vue-id.ts]0%
725.4 ms
725.4 ms
minifier[typescript.js]
tasks/benchmark/benches/minifier.rs::minifier::bench_minifier::minifier[typescript.js]0%
275.9 ms
275.9 ms
transformer[antd.js]
tasks/benchmark/benches/transformer.rs::transformer::bench_transformer::transformer[antd.js]0%
55.8 ms
55.8 ms
parser[pdf.mjs]
tasks/benchmark/benches/parser.rs::parser::bench_parser::parser[pdf.mjs]0%
17.5 ms
17.5 ms
semantic[antd.js]
tasks/benchmark/benches/semantic.rs::semantic::bench_semantic::semantic[antd.js]0%
107.1 ms
107.1 ms
linter[RadixUIAdoptionSection.jsx]
tasks/benchmark/benches/linter.rs::linter::bench_linter::linter[RadixUIAdoptionSection.jsx]0%
2.5 ms
2.5 ms
codegen_sourcemap[checker.ts]
tasks/benchmark/benches/codegen.rs::codegen::bench_codegen::codegen_sourcemap[checker.ts]0%
68.4 ms
68.5 ms
codegen[checker.ts]
tasks/benchmark/benches/codegen.rs::codegen::bench_codegen::codegen[checker.ts]0%
25 ms
25.1 ms
transformer[pdf.mjs]
tasks/benchmark/benches/transformer.rs::transformer::bench_transformer::transformer[pdf.mjs]0%
11 ms
11.1 ms
semantic[pdf.mjs]
tasks/benchmark/benches/semantic.rs::semantic::bench_semantic::semantic[pdf.mjs]0%
17.6 ms
17.7 ms
semantic[RadixUIAdoptionSection.jsx]
tasks/benchmark/benches/semantic.rs::semantic::bench_semantic::semantic[RadixUIAdoptionSection.jsx]-1%
73.7 µs
74.5 µs
semantic[cal.com.tsx]
tasks/benchmark/benches/semantic.rs::semantic::bench_semantic::semantic[cal.com.tsx]-1%
26.5 ms
26.9 ms
Commits
Click on a commit to change the comparison rangeBase
12-26-feat_transformer_class-properties_transform_static_private_method_invoking
e405f79
0%
feat(transformer/class-properties): transform static/instance accessor methods (#8132)
This PR supports transforming private `getter` or `setter` methods, and the output is a little different from Babel's output, For example:
Input:
```js
class Cls {
#prop = 0;
get #accessor() {
return this.#prop;
}
set #accessor(v) {
console.log(arguments);
this.#prop = v;
}
constructor() {
console.log(this.#accessor)
[this.#accessor] = [1];
}
}
```
[Babel's output](https://babeljs.io/repl#?browsers=defaults%2C%20not%20ie%2011%2C%20not%20ie_mob%2011&build=&builtIns=false&corejs=3.21&spec=false&loose=false&code_lz=MYGwhgzhAEDCIwN4ChrQMQAcBOB7T0AvNAAwDcyq0A5gKYAuGYwwtUu2AFAJTQpppsDAK7YAdtHoALAJYQAdFjyYKaAL5UIDJizYQOnAG69-A4LjH6QteSFzVOYbNWEBbWmPoRuqgdLmKOPhE0Ia-GlTmlvTYwsD0BiZUaFFWNnYO_grozKzs2NzJ0ADaWYq5ehwAuiHFAIxV4cgaQA&debug=false&forceAllTransforms=false&modules=false&shippedProposals=false&evaluate=false&fileSize=false&timeTravel=false&sourceType=script&lineWrap=true&presets=&prettier=false&targets=&version=7.26.4&externalPlugins=%40babel%2Fplugin-transform-class-properties%407.25.9%2C%40babel%2Fplugin-transform-private-methods%407.25.9%2C%40babel%2Fplugin-external-helpers%407.25.9&assumptions=%7B%7D):
```js
var _prop = new WeakMap();
var _Cls_brand = new WeakSet();
class Cls {
constructor() {
babelHelpers.classPrivateMethodInitSpec(this, _Cls_brand);
babelHelpers.classPrivateFieldInitSpec(this, _prop, 0);
console.log(babelHelpers.classPrivateGetter(_Cls_brand, this, _get_accessor));
[babelHelpers.classPrivateGetter(_Cls_brand, this, _get_accessor)] = [1];
}
}
function _get_accessor(_this) {
return babelHelpers.classPrivateFieldGet(_prop, _this);
}
function _set_accessor(_this2, v) {
var _arguments = [].slice.call(arguments, 1);
console.log(_arguments);
babelHelpers.classPrivateFieldSet(_prop, _this2, v);
}
```
Oxc's output:
```js
var _prop = new WeakMap();
var _Cls_brand = new WeakSet();
class Cls {
constructor() {
babelHelpers.classPrivateMethodInitSpec(this, _Cls_brand);
babelHelpers.classPrivateFieldInitSpec(this, _prop, 0);
console.log(_get_accessor.call(babelHelpers.assertClassBrand(_Cls_brand, this)));
[babelHelpers.toSetter(_set_accessor.bind(babelHelpers.assertClassBrand(_Cls_brand, this)), [])._] = [1];
}
}
function _get_accessor() {
return babelHelpers.classPrivateFieldGet2(_prop, this);
}
function _set_accessor(v) {
console.log(arguments);
babelHelpers.classPrivateFieldSet2(_prop, this, v);
}
```
### Main difference
```diff
// Babel
+ console.log(babelHelpers.classPrivateGetter(_Cls_brand, this, _get_accessor));
+ [babelHelpers.classPrivateGetter(_Cls_brand, this, _get_accessor)] = [1];
+ function _get_accessor(_this) {
+ return babelHelpers.classPrivateFieldGet(_prop, _this);
+ }
+ function _set_accessor(_this2, v) {
+ var _arguments = [].slice.call(arguments, 1);
+ console.log(_arguments);
+ babelHelpers.classPrivateFieldSet(_prop, _this2, v);
+ }
// Oxc
- console.log(_get_accessor.call(babelHelpers.assertClassBrand(_Cls_brand, this)));- -
- [babelHelpers.toSetter(_set_accessor.bind(babelHelpers.assertClassBrand(_Cls_brand, this)), [])._] = [1];
- function _get_accessor() {
- return babelHelpers.classPrivateFieldGet2(_prop, this);
- }
- function _set_accessor(v) {
- console.log(arguments);
- babelHelpers.classPrivateFieldSet2(_prop, this, v);
- }
```
From the main differences, we can see that Babel handles `getter` and `setter` methods using `classPrivateGetter` and `classPrivateSetter` helper functions, which causes all use `this` and `arguments` needs to rewrite to use a temp var instead in `getter` and `setter` methods. This is unnecessary and is not an efficient transformation for us.
Instead, I adapt binding a `this` instead of passing in `this`, this way we don't need to rewrite anything. We can't control the `helper` library for now, so I just transformed the AST to bind `this`, in the future, we can create a helper function to do the same thing.
ad77ad5
2 days ago
by Dunqing