You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
phase 3 of 4: a devframe shell as good as Vue and Nuxt DevTools #312
Vue DevTools v9 and Nuxt DevTools v4 now run as docks inside Vite DevTools, which is built on devframe, our own base. They get a command palette, messages, terminals, settings and a plugin API from it. We use only docks.register, rpc, sharedState and agent, so most of this phase is wiring up what devframe already ships. Rough size: 4 to 6 weeks. Follows #310 and #311.
Shell
Command palette (Cmd/Ctrl+K) through ctx.commands, with a command for every tab and action (pick, record change detection, clear, dock mode). Use a local palette when there is no hub. Add a global popup shortcut, configurable through popup.hotkey.
Settings page: theme toggle, hide, pin and reorder tabs, and a passive mode where the popup stays hidden until the shortcut.
A splitter for the docked popup, and pop-out into its own window.
Deep links to an item, not just a tab (#tab=&id=&page=), plus an open-in-panel agent tool.
One timeline with toggleable layers for router, HTTP, NgRx, change detection, forms and signals, instead of five separate timelines.
Errors inspector: wrap ErrorHandler, error and unhandledrejection, parse NG0xxx codes with a doc link, and link the owning component. Replace the three console patches with one console tap. Add list-errors, explain-error and list-console agent tools.
A terminals dock (ctx.terminals) for ng build and ng test output.
Setup and distribution
An ng add schematic that patches main.ts and server.ts, plus a dev-server builder that mounts the hub middleware. This removes the CLI, proxy and one-time-code steps from the client-only setup.
Publish the extension to the Chrome Web Store and Edge Add-ons, and ship a Firefox build.
Docs: a one-path quick start, screenshots on every inspector page, and an "Angular DevTools vs Pangular Inspector" FAQ entry.
Performance and scale
Push deltas instead of full snapshots for the component tree, injectors, change detection and forms. Use MutationObserver dirty flags, throttle to about once a second, and add an activity lease so idle pages stop pushing.
Virtualize long lists and trees (2,000-row tables), starting with content-visibility.
Done when
The shell rows in the comparison match Nuxt DevTools v4.
Activity