https://github.com/codebyashuu/dynamic-memory-management-visualizer
A visualization tool for dynamic memory management techniques like paging, segmentation, and page replacement algorithms
https://github.com/codebyashuu/dynamic-memory-management-visualizer
graph npm reactjs recharts simulation tailwindcss
Last synced: 2 months ago
JSON representation
A visualization tool for dynamic memory management techniques like paging, segmentation, and page replacement algorithms
- Host: GitHub
- URL: https://github.com/codebyashuu/dynamic-memory-management-visualizer
- Owner: CodeByAshuu
- Created: 2025-03-05T04:56:19.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-27T14:30:17.000Z (about 1 year ago)
- Last Synced: 2025-03-27T14:50:48.759Z (about 1 year ago)
- Topics: graph, npm, reactjs, recharts, simulation, tailwindcss
- Language: CSS
- Homepage:
- Size: 122 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Dynamic Memory Management Visualizer
A web-based interactive visualization tool for simulating different memory management techniques, including Paging, Segmentation, and Virtual Memory.
## Features
- **Paging Simulation**: Visualizes memory frames and page replacements using FIFO and LRU algorithms.
- **Segmentation Simulation**: Demonstrates memory allocation based on segments like Code, Stack, Heap, and Data.
- **Virtual Memory Simulation**: Simulates page loading into RAM.
- **Interactive Graphs**: Uses `recharts` for graphical representation.
- **User Configurable**: Allows setting total memory, page size, and replacement algorithms.
## Folder Structure
```
DynamicMemoryManagementVisualizer/
│-- assets/
│ │-- 1st.png
│ │-- 2nd.png
│-- node_modules/
│-- public/
│ ├── index.html
│-- src/
│ │-- components/ui/
│ │ │-- button.js
│ │ │-- card.js
│ │-- input.css
│ │-- output.css
│ │-- simulation.js # Main simulation logic
│ │-- App.js # Main entry component
│ │-- index.js # React entry point
│-- package.json
│-- README.md
```
## Screenshot
## Installation
1. Clone the repository:
```bash
git clone https://github.com/your-username/DynamicMMVisualizer.git
cd DynamicMMVisualizer
```
2. Install dependencies:
```bash
npm install
```
```bash
npm install react-router-dom recharts tailwindcss postcss autoprefixer
```
```bash
npm install react-scripts --save
```
```bash
npx @tailwindcss/cli -i ./src/input.css -o ./src/output.css --watch
```
3. Start the development server:
```bash
npm start
```
## Langauges Used
- JavaScript
- HTML
- CSS
## Framework & Library Used
- React.js
- Tailwind CSS
- Recharts
## Usage
1. Set memory configuration (total memory, page size, replacement algorithm).
2. Click on **Start Paging**, **Start Segmentation**, or **Start Virtual Memory**.
3. View the visualized memory management process.
4. Click **Run All Simulations** to execute all at once.
## Contributing
Feel free to fork this project and submit pull requests with improvements!
## License
This project is open-source and available under the MIT License.
---
💻 **Developed by CodeByAshuu**