STILL WORK IN PROGRESS

Inspect qwik application during development

Using crxjs for hot reload feature in development.

pnpm dev

1. open chrome://extensions in chrome browser.
2. ensure top right development switcher is on
3. drag dist folder into extension dashboard

To have more info, checkout https://crxjs.dev/vite-plugin/getting-started/vanilla-js/dev-basics

visit https://developer.chrome.com/docs/extensions/mv3/tut_debugging/ for more info

Builtin features

• Request logs, detailed contexts start from endpoint to render result tree
• Component tree, inspecting current state

Plugin ideas

• Sql info in timeline
• Custom logger
• SSG

• Chrome extension
• Inline, for devtools development or stackblitz, and other REPL

• CRXJS Vite Plugin
• How a DevTools Extension is Made