Wispr Flow: Dictation That Works EverywhereStop typing. Start speaking. 4x faster.
Archify
understand software
351 followers
understand software
351 followers
See components, APIs, libraries, understand application behavior directly inside your browser.
How does Archify actually get visibility into the components and APIs inside a live app, does it require installing a script or does it hook into the network tab somehow?
Archify
@aryaarkayaulwb No code changes needed , you just install the extension and Archify injects a small script into the page at runtime.
From there, it reads the framework to identify components and watches the app’s own API calls as they happen. The cool part is that it can link an API call back to the component or interaction that triggered it ,something you don’t really get from just staring at the Network tab.
@salahxd If Archify reads the live DOM and network activity locally, how does it identify components and API boundaries across different frontend frameworks? is detection framework-specific?
Archify
@clement_avq Great question! It’s a mix of both.
For frameworks, Archify looks for the signals each one leaves behind in the page , so React, Vue, Angular, Svelte, Astro, and others are detected in slightly different ways.
But things like buttons, dialogs, menus, and API calls are handled more generally. Archify looks at normal browser and web standards, so that part works regardless of which framework the site uses.
For APIs, it watches the same browser features that tools like Axios, React Query, Apollo, and plain fetch eventually use underneath. That’s why it can trace calls across different stacks.
One honest limitation: on heavily minified production apps, component names can sometimes be impossible to recover. When that happens, Archify just leaves the name out instead of guessing.
@salahxd thanks for the feedback!
Does this work as a browser extension or a standalone app, and is there a free tier or is it subscription-only from the start?
Archify
@serhatmant9b7b It works as a browser extension, and it’s completely free and opensource! No subscription or paid tier just install it and start exploring 🙌
does the extension need any permissions beyond the active tab, and can I audit that?
Archify
@saman_balochNo extra permissions or setup needed after installation .just install Archify and it works.
And yes, it’s fully auditable. You can check the permissions in Chrome’s extension settings, and since Archify is open source, you can inspect exactly how everything works in the code too 🙌
You can check it here: github.com/Salah-XD/archify
Being able to peek into a running app's components right in the browser without setting up a separate debugger feels like a huge time-saver, especially for onboarding to a new codebase.
Archify
@devranzerezune Absolutely! Onboarding to an unfamiliar codebase is one of the use cases I’m really excited about. Being able to explore how the app behaves before digging through the code can save a lot of time 🙌
One product detail I would make very explicit in the UI: mark the evidence source for each finding, e.g. DOM observation, network request, framework bridge, source map, or inferred. For a tool that maps components/APIs/architecture, that distinction prevents people from treating an inferred graph as ground truth. A route-by-route diff after SPA navigation would also help on auth-heavy dashboards.
The way Archify surfaces component behavior right in the browser is genuinely clever, saves a ton of tab-switching when debugging. Clean execution on something that could've easily turned into another cluttered dev tool.
Archify
@cafertrf7 This is exactly what I was hoping Archify would feel like. I really wanted to keep it useful without turning it into another overloaded dev tool 😄 Glad that came through!