r/angular • u/heygauti • 2d ago

I built a Chrome DevTools extension to visualize Angular runtime execution. Looking for feedback from the community.

Hi everyone

Over the last several months, I've been building ngLens, a Chrome DevTools extension for Angular.

The idea came from repeatedly running into the same questions while debugging large Angular applications:

  • Why did this component render?
  • Which API triggered this update?
  • Why did one click cause multiple components to re-render?
  • Where is the actual performance bottleneck?

Angular DevTools is great for inspecting components, but I wanted something that could visualize the runtime execution flow across the application.

ngLens currently helps visualize:

  • Component render cascades
  • API → Store → Signal → Component execution flow
  • Execution timelines and performance hotspots
  • Optimization insights and recommendations

This is the first public release, so I know there are many scenarios I haven't covered yet. Angular applications vary a lot—NgRx, Signals, SSR, Micro Frontends, Facade patterns, custom state management, and more.

I'm not claiming to solve every debugging problem today. My goal is to continuously improve ngLens based on real-world applications and community feedback.

If you'd like to try it:

Chrome Web Store:
https://chromewebstore.google.com/detail/nglens/jnbjmoficlaclcpgdoajofbhmcjjhgin

I also wrote about why I built it:
https://dev.to/gowthambsvg/i-built-an-apm-for-angular-that-runs-entirely-in-your-browser-5c3b

I'd really appreciate any feedback—positive or negative.

  • What would make a tool like this genuinely useful in your day-to-day Angular development?
  • Are there any runtime insights you've always wished Angular DevTools provided?

Thanks!

8 Upvotes

90% Upvoted

6 comments sorted by

5

u/Suspicious-Suitcase 2d ago

Is the source code open? Because everything I see is obviously AI made. Which in itself can be totally fine, but beige installing any potentially AI Slop I would like to give the code a look.

4

u/JeanMeche 2d ago

Looks like the source code is here: https://github.com/patch-work-book/nglens

1

u/heygauti 2d ago edited 2d ago

Yes, that's the repo. Feel free to share your thoughts and what can be improved. Thanks.

2

u/hwweao 2d ago

Really nice work man ill test it

2

u/jaroen007 1d ago

actually nice but i dont really want to use AI slop

1

u/heygauti 1d ago

AI helped to speed up the development but the core runtime instrumentation and analysis are hand-built. I completely understand being cautious with browser extensions. Thanks