The File System module provides comprehensive visualization of file system operations, block allocation methods, and disk management features.
This module simulates a block-based file system with support for multiple allocation methods, directory tree management, and advanced features like defragmentation and journaling.
- Files occupy consecutive blocks
- Pros: Fast sequential access, simple
- Cons: External fragmentation, file growth issues
- Each block points to the next block
- Pros: No external fragmentation, easy growth
- Cons: Slow random access, pointer overhead
- Index block contains pointers to data blocks
- Pros: Direct access, no fragmentation
- Cons: Index block overhead, size limits
- Hierarchical directory tree
- Create files and directories
- Navigate and select items
- Search functionality
- Create: Allocate blocks for new files
- Read: Highlight and simulate block access
- Write: Resize and reallocate blocks
- Delete: Free allocated blocks
- Copy/Move/Rename: File manipulation
- 100-block disk grid display
- Color-coded file blocks
- Free space visualization
- Animation for operations
- Allocation type indicators
- Edit actual file content
- Content-based size calculation
- Save with automatic resizing
- Animated consolidation process
- Progress indicator
- Converts to contiguous allocation
- Read/Write/Execute permissions (rwx)
- Per-file owner tracking
- Permission violation detection
- Operation logging
- Recovery simulation
- Transaction visualization
- User accounts with quotas
- Usage tracking per user
- Quota enforcement
| Option | Default | Description |
|---|---|---|
| Total Blocks | 100 | Disk size in blocks |
| Block Size | 4 KB | Size per block |
| Allocation | Linked | Allocation method |
| Journaling | Off | Enable journaling |
Pre-built scenarios demonstrating:
- Basic operations
- Fragmentation effects
- Allocation method comparisons
- Permission scenarios
POST /api/filesystem/create-file
POST /api/filesystem/read-file
POST /api/filesystem/write-file
DELETE /api/filesystem/delete
GET /api/filesystem/blocks
POST /api/filesystem/allocate
pages/FileSystem.jsx- Main component (2000+ lines)pages/FileSystem.css- Comprehensive styling
filesystem/filesystem.py- Core file system logicroutes/filesystem_routes.py- API endpoints
- Total/used/free blocks
- Fragmentation percentage
- Files and directories count
- Operation history (activity log)
- Compare allocation method trade-offs
- Understand disk fragmentation
- Visualize file block layout
- Learn permission systems
- Create files with different allocation methods
- Delete files and observe fragmentation
- Run defragmentation and compare before/after
- Test permission violations