{"id":24582765,"url":"https://github.com/sasoder/use-why-rerender","last_synced_at":"2026-03-07T01:02:24.531Z","repository":{"id":268539381,"uuid":"904682379","full_name":"sasoder/use-why-rerender","owner":"sasoder","description":"A lightweight drop-in React hook for finding out which props cause a component to re-render","archived":false,"fork":false,"pushed_at":"2025-02-08T17:10:52.000Z","size":19,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-09-16T15:44:28.698Z","etag":null,"topics":["hooks","npm","npm-package","react"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/use-why-rerender","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sasoder.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2024-12-17T11:01:39.000Z","updated_at":"2025-02-08T17:10:56.000Z","dependencies_parsed_at":null,"dependency_job_id":"12685eb2-9fb1-4451-8dc9-ad239c630922","html_url":"https://github.com/sasoder/use-why-rerender","commit_stats":null,"previous_names":["sasoder/use-why-rerender"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/sasoder/use-why-rerender","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sasoder%2Fuse-why-rerender","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sasoder%2Fuse-why-rerender/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sasoder%2Fuse-why-rerender/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sasoder%2Fuse-why-rerender/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sasoder","download_url":"https://codeload.github.com/sasoder/use-why-rerender/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sasoder%2Fuse-why-rerender/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30204452,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-06T19:07:06.838Z","status":"ssl_error","status_checked_at":"2026-03-06T18:57:34.882Z","response_time":250,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hooks","npm","npm-package","react"],"created_at":"2025-01-24T03:57:33.639Z","updated_at":"2026-03-07T01:02:24.501Z","avatar_url":"https://github.com/sasoder.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# use-why-rerender\n\nA lightweight drop-in React hook for finding out which props cause a component to re-render. Supports nested data structures and object reference changes.\n\n![npm](https://img.shields.io/npm/v/use-why-rerender)\n![npm bundle size](https://img.shields.io/bundlephobia/minzip/use-why-rerender)\n![TypeScript](https://img.shields.io/badge/TypeScript-Ready-blue)\n![React](https://img.shields.io/badge/React-18%2B-blue)\n![License](https://img.shields.io/npm/l/use-why-rerender)\n\n## Installation\n\n```bash\nnpm install -D use-why-rerender\n```\n\n## Usage\n\n```typescript\nimport useWhyRerender from 'use-why-rerender';\n\nfunction MyComponent({ user, items, onUpdate }) {\n  const [count, setCount] = useState(0);\n  useWhyRerender({ user, items, onUpdate, count }, { caller: 'MyComponent' });\n  \n  return (\n    // your component\n  );\n}\n```\n\nThis will produce console output like:\n```\n🔁 Render #1 - MyComponent\n  user:\n    prev: { id: 1, name: \"John\" }\n    next: { id: 1, name: \"Jane\" }\n  items: Object reference changed but shallowly equal\n\n🔁 Render #2 - MyComponent\n  count:\n    prev: 0\n    next: 1\n```\n\n### Configuration Options\n\n```typescript\nuseWhyRerender(props, {\n  deep: true,                   // enable deep equality comparison\n  enabled: true,                // enable/disable logging\n  debounceMs: 100,              // debounce logs\n  caller: 'MyComponent'         // name of caller for logging\n});\n```\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `deep` | boolean | `false` | Enable deep equality comparison |\n| `enabled` | boolean | `true` | Enable/disable logging |\n| `debounceMs` | number | `0` | Logging delay in milliseconds |\n| `caller` | string | - | Calling component identifier |\n\n## License\n\nMIT","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsasoder%2Fuse-why-rerender","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsasoder%2Fuse-why-rerender","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsasoder%2Fuse-why-rerender/lists"}