babel-preset: huge perf slowdown on first babel transform invoction

[Hotell]

Repro

• checkout/pull https://github.com/Hotell/fluentui/tree/perf/repro/griffel-babel-plugin
• yarn
• yarn lage build --to react-combobox
• yarn workspace @fluentui/react-comboboxjust-scripts swc:compile`

Perf report

It seems that first file transform takes serious performance hit ( it doesn't matter much how many/big makeStyles calls are present in the source file

🐌 91% Slowdown

• With griffel plugin: 1556ms
• Without: 128ms

More detailed report:

With griffel plugin

transform:lib/components/Combobox/useComboboxStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 2107.136041879654,
  duration: 1112.6963331699371,
  detail: null
}
transform:lib/components/Dropdown/useDropdownStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 3223.4872920513153,
  duration: 234.26958298683167,
  detail: null
}
transform:lib/components/Listbox/useListboxStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 3462.451292037964,
  duration: 17.903625011444092,
  detail: null
}
transform:lib/components/Option/useOptionStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 3481.75075006485,
  duration: 126.34291696548462,
  detail: null
}
transform:lib/components/OptionGroup/useOptionGroupStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 3611.630917072296,
  duration: 41.18262481689453,
  detail: null
}
PerformanceMeasure {
  name: 'babel-loop',
  entryType: 'measure',
  startTime: 2106.3337919712067,
  duration: 1556.8601250648499,
  detail: null
}

Without

transform:lib/components/Combobox/useComboboxStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 2519.6634590625763,
  duration: 91.24920797348022,
  detail: null
}
transform:lib/components/Dropdown/useDropdownStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 2612.96950006485,
  duration: 12.754791975021362,
  detail: null
}
transform:lib/components/Listbox/useListboxStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 2632.2044999599457,
  duration: 2.8975839614868164,
  detail: null
}
transform:lib/components/Option/useOptionStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 2636.846209049225,
  duration: 5.132250070571899,
  detail: null
}
transform:lib/components/OptionGroup/useOptionGroupStyles.styles.js:
PerformanceMeasure {
  name: 'babel-transform',
  entryType: 'measure',
  startTime: 2643.8133749961853,
  duration: 2.6310839653015137,
  detail: null
}
PerformanceMeasure {
  name: 'babel-loop',
  entryType: 'measure',
  startTime: 2518.9735000133514,
  duration: 128.8410840034485,
  detail: null
}