# WhoRenderedThis

> WhoRenderedThis is a developer tool that bridges the gap between what you see in the browser and the React code that rendered it.

Canonical page: [https://chrome-stats.com/d/whorenderedthis](https://chrome-stats.com/d/whorenderedthis)

## Overview

- **ID:** `whorenderedthis`
- **Platform:** Firefox
- **Type:** Firefox add-on
- **Status:** Available
- **Publisher:** Avinash
- **Category:** web-development
- **Version:** 0.2.0
- **Last updated:** 2026-02-14
- **First published:** 2026-02-11
- **Size:** 105 KB
- **Data as of:** 2026-09-15
- **Store listing:** [Firefox Add-ons Store](https://addons.mozilla.org/firefox/addon/whorenderedthis/)
- **Website:** [https://whorenderedthis.vercel.app/](https://whorenderedthis.vercel.app/)

## Description

How it works:
Simply hover over any element on a React-powered website, and an overlay instantly shows you the component name, file path, and line number where that element was created. Click to pin the overlay and explore the full component hierarchy — see parent components all the way up the tree, complete with their source locations.

Key features:
- Instant component identification — No more guessing which component rendered what
- Source location mapping — Jump directly to the source file and line number
- Parent chain exploration — Understand the component hierarchy at a glance
- Version-aware detection — Works with React 16, 17, 18, and 19+
- Lightweight &amp; non-intrusive — Only activates when you need it

Perfect for:
- Debugging unfamiliar React codebases
- Understanding component boundaries in large applications
- Learning how other React apps are structured
- Quickly navigating to the right source file
Built for developers, by developers. Open source on GitHub.

## Rankings

- #137,248 — Overall

## Permissions and access

### Permissions

- `activeTab`
- `scripting`
- `<all_urls>`

## Safety

- **Risk impact:** Moderate risk impact
- **Risk likelihood:** Moderate risk likelihood

### Analysis details

- Allows access to all websites, posing a significant security risk as it can monitor and modify data from any visited site.
- This extension has low user count. Unpopular extensions may not be stable or safe.

> Some risk analysis details are omitted from this free response. [Upgrade to view the full analysis](https://chrome-stats.com/pricing).

## Similar extensions and apps

- [React Developer Tools Lite](https://chrome-stats.com/d/react-developer-tools-lite)
- [ComponentLocator](https://chrome-stats.com/d/componentlocator) — 1 users
- [Realize](https://chrome-stats.com/d/realizeforreact) — 43 users, 1.00 / 5
- [React Developer Tools](https://chrome-stats.com/d/reactdevelopertools) — 3 users
- [React Developer Tools](https://chrome-stats.com/d/react-devtools) — 162,608 users, 4.59 / 5
- [RenderDiff - SEO Rendering Diff Checker](https://chrome-stats.com/d/renderdiff) — 6 users
- [React Developer Tools CNC](https://chrome-stats.com/d/react-developer-tools-cnc) — 5 users
- [React1s](https://chrome-stats.com/d/react1s) — 2 users
- [Blazor Developer Tools](https://chrome-stats.com/d/blazor-developer-tools) — 8 users
- [React Developer Tools Lite](https://chrome-stats.com/d/lightweig-developer-tools) — 1 users
- [Async Render Toolbox](https://chrome-stats.com/d/async-render-toolbox) — 1 users
- [React Performance Devtool](https://chrome-stats.com/d/nitin-tulswani) — 113 users, 1.00 / 5

---

Source: [Chrome-Stats](https://chrome-stats.com/d/whorenderedthis)
