# leongkaixiang/test3 architecture

> Architecture diagram of the GitHub repository leongkaixiang/test3, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/leongkaixiang/test3
- Repository: https://github.com/leongkaixiang/test3

## Overview

This is a minimal Create React App page: the browser loads the React entry point, which renders a static “BYE BYE” page and invokes optional performance reporting. The sampled code shows no domain workflow or broader product capabilities; styling and metrics are the only distinct supporting layers.

Main entry points: [`src/index.js`](https://github.com/leongkaixiang/test3/blob/master/src/index.js) (React entry), [`src/App.js`](https://github.com/leongkaixiang/test3/blob/master/src/App.js) (Static page), [`src/reportWebVitals.js`](https://github.com/leongkaixiang/test3/blob/master/src/reportWebVitals.js) (Vitals reporter), [`src/index.css`](https://github.com/leongkaixiang/test3/blob/master/src/index.css) (Global styles)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_application["Page rendering"]
  node_entry["React entry<br/>[index.js]"]
  node_page["Static page<br/>[App.js]"]
  node_global_styles["Global styles<br/>[index.css]"]
  node_page_styles["Page styles<br/>[App.css]"]
end

subgraph group_instrumentation["Performance reporting"]
  node_vitals_reporter["Vitals reporter<br/>[reportWebVitals.js]"]
  node_web_vitals["Web Vitals"]
end

node_browser(("Browser"))

node_browser -->|"loads app"| node_entry
node_entry -->|"renders"| node_page
node_entry -->|"imports styles"| node_global_styles
node_page -->|"imports styles"| node_page_styles
node_entry -->|"calls reporter"| node_vitals_reporter
node_vitals_reporter -->|"loads metrics"| node_web_vitals

click node_entry "https://github.com/leongkaixiang/test3/blob/master/src/index.js"
click node_page "https://github.com/leongkaixiang/test3/blob/master/src/App.js"
click node_global_styles "https://github.com/leongkaixiang/test3/blob/master/src/index.css"
click node_page_styles "https://github.com/leongkaixiang/test3/blob/master/src/App.css"
click node_vitals_reporter "https://github.com/leongkaixiang/test3/blob/master/src/reportWebVitals.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_entry,node_page,node_global_styles,node_page_styles,node_browser toneBlue
class node_vitals_reporter,node_web_vitals toneAmber
```

## Components

### Page rendering

- [React entry](https://github.com/leongkaixiang/test3/blob/master/src/index.js): `src/index.js`
- [Static page](https://github.com/leongkaixiang/test3/blob/master/src/App.js): `src/App.js`
- [Global styles](https://github.com/leongkaixiang/test3/blob/master/src/index.css): `src/index.css`
- [Page styles](https://github.com/leongkaixiang/test3/blob/master/src/App.css): `src/App.css`

### Performance reporting

- [Vitals reporter](https://github.com/leongkaixiang/test3/blob/master/src/reportWebVitals.js): `src/reportWebVitals.js`
- **Web Vitals**

### Other components

- **Browser**

## Connections

- Browser → React entry: loads app (evidence: `src/index.js`)
- React entry → Static page: renders (evidence: `src/index.js`)
- React entry → Global styles: imports styles (evidence: `src/index.js`)
- Static page → Page styles: imports styles (evidence: `src/App.js`)
- React entry → Vitals reporter: calls reporter (evidence: `src/index.js`)
- Vitals reporter → Web Vitals: loads metrics (evidence: `src/reportWebVitals.js`)