Skip to content

Two devtools surfaces implement one feature: the iframe overlay costs ~1,626 lines and a 250 ms polling fallback to duplicate the Vue DevTools inspector #664

Open

Description

@ozzyfromspace

Attaform ships two independent devtools surfaces for one feature.

src/runtime/core/devtools.ts (284 lines) wires @vue/devtools-api's setupDevtoolsPlugin. It works in bare Vue and in Nuxt, because Nuxt DevTools embeds Vue DevTools, and it never touches window.

The iframe overlay is roughly 1,626 lines across AttaformDevtoolsPanel.vue and its tree component, plus 131 of the 352 lines of src/vite.ts (the /_attaform_devtools middleware, 37% of the Vite plugin), plus about 32 lines of src/nuxt.ts (addCustomTab, the runtimeConfig.public.attaform.version slot, AttaformRuntimeConfig) and 14 lines of the Nuxt runtime plugin.

The overlay does not fight a bug, it fights the framework. AttaformDevtoolsPanel.vue:20-35 documents that Vue reactivity is module-scoped and does not cross the iframe boundary, so the panel carries a manual tick ref plus a 250 ms polling fallback. That is a standing architectural tax with no fix available.

Measured cost of removing the overlay and its core seam: 60 B gz eager, all of it onReset (create-form-store.ts:739), whose only consumers are devtools.ts:167 and AttaformDevtoolsPanel.vue:353. The overlay itself is absent from the prod eager closure already.

Also retired: 2 optional peerDeps, the ./devtools-panel export entry (raw .vue, no types), a dedicated mkdist block in build.config.ts:216-230 that exists solely to resolve it, and the dev-only window[DEVTOOLS_WINDOW_KEY] write at src/runtime/plugins/attaform.ts:81.

The argument against. The overlay needs no browser extension; the inspector requires one. In a locked-down environment where a Chrome extension cannot be installed, the overlay is the only surface that works. That is worth weighing before cutting, since it is exactly the environment the downstream consumer operates in.


Found in the 2026-09-18 feature audit (main@b4a64ef9, eager baseline 33,204 B gz). Every byte figure is a measured ablation, not an estimate.

🤖 Generated with Claude Code

https://claude.ai/code/session_01PnAVwFjpvKQNppAMkSvoiH

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions