https://github.com/SparrowVic/ngx-genie
https://github.com/SparrowVic/ngx-genie
Last synced: 6 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/SparrowVic/ngx-genie
- Owner: SparrowVic
- License: other
- Created: 2025-12-13T14:00:34.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2025-12-14T01:37:21.000Z (6 months ago)
- Last Synced: 2025-12-15T08:12:37.700Z (6 months ago)
- Language: TypeScript
- Size: 235 KB
- Stars: 11
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-angular - ngx-genie - A tool to visualize the dependency injection tree, analyze service states, track component relationships, and identify memory or architectural issues. (Development Utilities / Code Analysis)
- fucking-awesome-angular - ngx-genie - A tool to visualize the dependency injection tree, analyze service states, track component relationships, and identify memory or architectural issues. (Development Utilities / Code Analysis)
- awesome-starred - SparrowVic/ngx-genie - (TypeScript)
README
# 🧞♂️ GenieOS – Angular Dependency Inspector
> **Note:** This project is licensed under the **Apache License 2.0**.
**GenieOS** (`ngx-genie`) is an advanced developer tool for the **Angular** framework, designed for visualizing, analyzing, and diagnosing the **Dependency Injection (DI)** system.
It works as an intelligent overlay on top of your application, allowing you to:
* inspect the dependency injection tree structure in real time,
* analyze the state of services,
* observe relationships between components,
* detect potential memory leaks and architectural issues.
---
## ✨ Key features
* **Tree View**
A hierarchical view of the component tree and their Injectors (Element, Environment).
* **Org Chart**
Visualization of the application structure as a classic organizational chart, making parent–child relationships easier to understand.
* **Matrix View**
A powerful dependency matrix generated by a **Web Worker**.
* **Constellation View**
An interactive force-directed graph presenting the dependency network as a constellation of nodes and connections.
* **Diagnostics**
Automatic detection of anomalies (e.g. circular dependencies, singleton violations, heavy state).
* **Live Inspector**
Real-time inspection of service state, including **Signals** and **Observable** values.
* **Deep Focus**
A mode that isolates a single branch of the tree for easier analysis in large applications.
---
## ⚙️ Angular version compatibility
GenieOS is currently **implemented against Angular 20**.
### Current support
* ✅ **Angular 20** – fully supported and recommended
### Planned compatibility
Support for **earlier Angular versions** (e.g. Angular 17–19) is **planned**, but not yet available.
---
## 🚀 Quick start
### Installation
Using **npm**:
```bash
npm install ngx-genie --save-dev
```
Using **yarn**:
```bash
yarn add ngx-genie --dev
```
---
### Configuration
Add the provider to your application configuration (`app.config.ts`):
```ts
import {ApplicationConfig} from '@angular/core';
import {provideGenie} from 'genie';
export const appConfig: ApplicationConfig = {
providers: [
provideGenie({
hotkey: 'F1', // default: F1
enabled: true, // default: true
visibleOnStart: false // default: true
})
]
};
```
Run the application and press **F1** (or another configured hotkey).
---
## 📚 Documentation
Detailed documentation is available in the **[`/docs`](./docs)** directory:
* 📥 [Installation and configuration](./docs/installation.md)
* 🛠️ [Feature overview](./docs/features.md)
* 🧠 [Technical library overview](./docs/library.md)
---
## 🧪 Project status
GenieOS is currently in an **experimental / early-stage** phase.
This is the **first public version** of the library and should be treated as a **proof of concept and evolving developer tool**, not a production-hardened framework.
### Important notes
* ❗ **No unit tests yet** – the library/plugin does **not currently include unit or integration tests**. Test coverage is planned for future releases.
* 🧭 APIs and internal behavior may change between versions as the project stabilizes.
* 🧠 The focus of the current version is **architecture exploration, UX experimentation, and real-world validation**.
---
## 🤖 AI disclaimer
This project was developed with the assistance of **Generative AI** tools.
The code, architecture, and documentation are the result of collaboration between the author and AI assistants.
While best efforts were made to ensure quality and correctness, some patterns characteristic of AI-generated code may be present.
*This project was developed with the assistance of AI tools. While human oversight was applied, some code patterns may reflect AI generation.*
---
## ⚖️ License
This project is licensed under the **Apache License 2.0**.
You are free to use GenieOS in **commercial and non-commercial projects**, including internal tooling, development workflows, and enterprise applications.
The license:
* ✅ allows commercial use
* ✅ allows modification and redistribution
* ✅ includes an explicit patent grant
* ❌ does not grant rights to use the GenieOS name or branding
The software is provided **"AS IS"**, without warranties or conditions of any kind.
See the **LICENSE** file for the full license text.
---
## 👤 Author
Wiktor Wróbel
[@SparrowVic](https://github.com/SparrowVic)