ShopperCove
Menu
All writingBlogTopicsCategoriesAboutRSS
Blog
Categories
Observability & SRE62All categories
Topics
sre111localhost lab102performance70python58javascript47bundle size36benchmarking35node.js35web development21typescript19benchmark16content creation15All topics
About
Loading article…

ShopperCove

Hands-on notes on developer tools, written after the tool has actually been run.

All writingBlogCategoriesTopicsAboutPrivacyRSS

© 2026 ShopperCove

On this page

  1. What I tested
  2. How many imports did auto-import remove?
  3. Does auto-import slow the Vite build?
  4. Should you add unplugin-auto-import?
  5. Sources
  6. Related
  1. Blog

unplugin-auto-import: 360 Import Lines vs +267ms

unplugin-auto-import 20.3.0 + unplugin-vue-components 29.2.0 on Vue 3.5.43 / Vite 7.3.6: 40 components, 40 utils, 20 composables. Import lines 382 → 22 (−360). Warm production build medians (minify off, 7 rounds): manual 940 ms vs auto 1,207 ms (+267 ms); both 105 modules; JS 209.03 → 210.88 kB.

5 October 2026·5 min read

Hands-on
On this page
  1. What I tested
  2. How many imports did auto-import remove?
  3. Does auto-import slow the Vite build?
  4. Should you add unplugin-auto-import?
  5. Sources
  6. Related

I rebuilt the same Vue 3 + Vite 7 app two ways: with hand-written imports (382 import lines) and with unplugin-auto-import 20.3 plus unplugin-vue-components 29.2 (22 import lines left). That dropped 360 import statements. Warm production build medians were 940 ms manual versus 1,207 ms with the plugins (+267 ms), same 105 modules transformed.

Short answer: adopt auto-import on Vue apps where composables and shared utils are the noise, and accept a small build tax. Skip it on tiny apps or teams that want every dependency visible at the top of the file. No affiliate links in this post.

What I tested

  • Machine: 8 vCPU Intel Xeon / 15 GB RAM shared Linux cloud box, tested 6 Oct 2026 about 00:05–00:10 IST.
  • Versions: Vite 7.3.6, Vue 3.5.43, @vitejs/plugin-vue 6.0.9, unplugin-auto-import 20.3.0, unplugin-vue-components 29.2.0, Node 22.20.0. minify: false so transform cost stays visible.
  • Fixture: /workspace/bench-auto-import/. 40 utils, 20 composables, 40 single-file components, plus App and main. Manual tree keeps explicit imports; auto tree deletes utils/composables imports from components and all component imports from App.
  • AutoImport config: imports: ["vue"], dirs src/composables and src/utils, vueTemplate: true, dts off. Components plugin scans src/components.
  • Timing: wall clock around the local Vite binary. One warm-up each, then 7 interleaved rounds swapping the active src tree between manual and auto.
  • Findings: import lines 382 → 22 (−360). Warm medians 940 ms vs 1,207 ms (+267 ms, about 28%). Both builds reported 105 modules. Output JS grew from 209.03 kB to 210.88 kB.
  • One surprise: the remaining 22 imports were almost all import { ref, computed } from "vue" inside composables, plus createApp/App in main. AutoImport could erase those too; I left them to show a conservative cut.
  • Not tested: Nuxt built-in auto-imports, React/Solid presets, dts generation in CI, IDE go-to-definition edge cases, Windows or macOS.

How many imports did auto-import remove?

TreeImport linesComponentsUtilsComposables
Manual (explicit)382404020
Auto (plugins on)22404020
Removed360———

Most of the cut was repetitive import { uN } from '../utils/uN' and import { useThingN } from '../composables/...' inside components, plus 40 App-level component imports replaced by the Components plugin. That pairing matches how Vue teams usually adopt this stack; AutoImport alone would not resolve <CompN/> in the template.

For Vue typing and SFC tooling around the same stack, see the vue-tsc / Vue Language Tools 3.3.12 notes.

Does auto-import slow the Vite build?

Run (production, minify off)Wall median (7)ModulesJS size
Manual imports940 ms105209.03 kB
AutoImport + Components1,207 ms105210.88 kB
Delta+267 ms0+1.85 kB

Yes, on this fixture. The plugins scan dirs and rewrite unresolved identifiers, so the transform step pays a fixed cost even when the module graph width stays the same. 267 ms is noticeable in a tight local loop and usually fine in CI next to install and test time.

If your pain is bundler choice rather than imports, the Vite vs Parcel and Rolldown vs Rollup posts cover that axis. Unused-export cleanup after adopting auto-import pairs with Knip vs depcheck.

Should you add unplugin-auto-import?

SituationMy pick
Vue 3 app with many shared composables/utilsYes
Also tired of importing every SFC in App/layoutsPair with unplugin-vue-components
Tiny prototype under ~15 componentsSkip; explicit imports stay clearer
Team rule: every symbol shows its module pathSkip
Already on NuxtUse Nuxt auto-imports; do not double-stack
Need generated .d.ts committed for CI editorsTurn dts on and budget the extra file churn

Bottom line: 360 fewer import lines for +267 ms on a 40-component Vite build is a trade I would take on a mid-size Vue app, and refuse on a tiny one where the plugins obscure more than they save. For the broader Vite toolchain pitch, see Vite+ 1.0.

How this was made: I generated matching manual and auto-import Vue trees on the ShopperCove test box, timed interleaved Vite builds, counted import lines with a small script, and kept the JSON; the write-up was drafted with AI help and checked against that output.

Sources

  • 01github.com/unplugin/unplugin-auto-import
  • 02npmjs.com/package/unplugin-auto-import
  • 03github.com/unplugin/unplugin-vue-components
  • 04vite.dev/guide/
  • 05vuejs.org/guide/reusability/composables.html

Related

  • 01shoppercove.com/blog/swc-vs-esbuild-babel
  • 02shoppercove.com/blog/lightningcss-vs-postcss
  • 03shoppercove.com/blog/rspack-vs-webpack
unplugin-auto-importvitevueperformancebuild timecomposablesimport statements

Lab evidence

What I found running this

Hands-on on ShopperCove box 6 Oct 2026 ~00:05–00:10 IST (8 vCPU Intel Xeon / 15 GB shared Linux, Node 22.20.0). Vite 7.3.6, Vue 3.5.43, @vitejs/plugin-vue 6.0.9, unplugin-auto-import 20.3.0, unplugin-vue-components 29.2.0. Fixture /workspace/bench-auto-import/: matching manual (src-manual) and auto (src-auto) trees — AutoImport dirs composables+utils, imports:[vue], vueTemplate; Components dirs components; minify false. Counted import lines via script (382 vs 22). Local vite binary; 1 warm-up + 7 interleaved rounds swapping active src. Warm medians 940 ms vs 1207 ms. Raw: /workspace/bench-auto-import/res-auto-import.json. Not tested: Nuxt auto-imports, React/Solid presets, dts:true CI churn, IDE go-to-definition edge cases, Windows/macOS. No affiliate.

Notes when a lab post goes up

Occasional email for new hands-on reviews. No sequence and no sponsors.

Keep reading

  • magicast vs recast: 0.65 ms vs 0.42 ms per Vite Edit

    Hands-on6 Oct 20268 min read

  • Clsx vs classnames: 294 B vs 857 B Gzip

    Hands-on6 Oct 20264 min read

  • vite-plugin-checker: Plain Vite Shipped My TS Error

    vite-plugin-checker 0.10.3 with enableBuild on Vite 7.3.6 / TS 5.9.3 / React 19: clean wall medians plain 1,949 ms vs checker 2,018 ms (+69 ms) vs tsc --noEmit 985 ms. Injected TS error: plain vite exit 0 (ships dist) x3; checker exit 2 x3; tsc exit 2 x3. Fixture 122 modules.

    Hands-on6 Oct 20265 min read