Archify
understand software
349 followers
understand software
349 followers
See components, APIs, libraries, understand application behavior directly inside your browser.
Free
Launch Team / Built With
Render Sandboxes: a computer for every agentRun untrusted code safely. Idle sandboxes cost nothing
Promoted
Hey everyone! 👋 I'm Salah, the maker of Archify.
I built Archify because I believe understanding software has become harder than writing it.
Instead of digging through DevTools, network requests, and source maps, Archify helps you see what's behind a web app its components, APIs, scripts, and architecture right from the browser. It runs entirely locally, so nothing leaves your machine.
I'd genuinely love your feedback, ideas, or even criticism. Thanks for checking it out! ❤️
@salahxd This is a really interesting direction.
I’ve always felt that DevTools are powerful but fragmented when it comes to understanding a full app structure end-to-end. The idea of surfacing components, APIs, and architecture in one local-first view feels like it could change how we debug and learn modern web apps.
Curious how you’re handling things like framework detection and dynamically loaded modules in real-world SPAs — what was the hardest technical challenge you ran into while building this?
@md_khayruzzaman Thanks! That fragmentation is exactly what pushed me to build Archify. Right now, the DOM is in one place, network requests in another, and components somewhere else and you’re the one trying to connect everything in your head.
For framework detection, Archify looks at the actual signals frameworks leave behind in the running page rather than guessing from file names. It also keeps re-checking as SPAs change routes and load new parts.
The hardest technical challenge was actually getting access to some of that information from a browser extension. React and Vue keep component details inside the page itself, but browser extensions run in a separate isolated environment. Figuring out how to safely bridge that gap was probably the biggest challenge.
And one thing I decided not to fake: if a production build has mangled the component names, Archify leaves them blank instead of confidently showing something wrong 😄
HI Mohd,
This is impressive. Good job. Is it possible to have the pop-up open in a side panel https://developer.chrome.com/docs/extensions/reference/api/sidePanel
So that i can keep it open as i visit different pages or sites ?
@zumilabs Thanks! And yes, a side panel would actually make a lot of sense for Archify, especially for keeping it open while moving between pages. Definitely something I’m going to explore. Appreciate the suggestion!
How does it handle authentication when inspecting components behind a login, do I have to paste in cookies or does it manage that for me?
@smailgelmibllf Great question !good news, there’s nothing to paste!
Archify runs directly inside your browser tab and uses your existing session. So if you’re logged in and can see the page, Archify can inspect it too ,no cookies, tokens, or extra setup needed.
It all happens locally as well. Archify reads the live DOM and the page’s own network activity right on your machine, so nothing about the page is sent to a server. Just navigate to the screen you want to inspect and you’re good 🙌
How does it handle larger apps with heavy traffic in terms of performance impact, and is there a notable spike in load times when using it?
@trkanzberi60zo Great question! In practice, the performance impact is very small.
Archify quietly observes what the page is already doing and keeps track of network activity without blocking or slowing down the requests themselves. I benchmarked it on a page firing thousands of requests, and the additional overhead was only a few milliseconds spread across the whole session.
It also doesn’t keep piling up over time, so even on dashboards or apps you leave open all day, it stays lightweight.
How does this actually work under the hood, does it inject something into the page or proxy requests through your servers? Trying to figure out if my proprietary code or sensitive data ever leaves the browser.
@lkersna4 Great question. Yes, Archify injects a script into the page, similar to how React DevTools works, but there’s no server and no proxying. Everything runs locally in your tab.
It only records metadata like request method, URL, and status, along with storage keys never request bodies or storage values. None of it leaves your browser, and there’s literally no backend for it to send anything to.
It’s open source too, so you can verify exactly how it works: github.com/Salah-XD/archify
Pretty handy being able to peek at component trees and API calls without leaving the tab, the in-browser view saved me from digging through source files. Wish the filtering was a bit faster on larger apps though.
@serhatviwz Glad the in-browser view helped! And yep, filtering on larger apps definitely needs some work ,already looking into making that faster. Appreciate the feedback 🙌
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?
@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.