A pure frontend toolkit β all computation happens locally in your browser.
Vue 3 TypeScript Vite 8 Element Plus ECharts 6 Pyodide ffmpeg.wasm
| Tool | Description |
|---|---|
| Python Runner | In-browser Python interpreter powered by Pyodide WASM. Supports stdlib and on-demand third-party library loading (numpy, pandas, opencv-python, etc). |
| Tree Visualizer | Render JSON as interactive ECharts tree diagrams. Customizable label/children field mapping, 4 layout directions, round/rect nodes. |
| List Tree Visualizer | Render indented tree text (β β) as D3 collapsible lists. Auto-detects file extensions for icons, supports inline comments. |
| Java DTO β TypeScript | Parse Java DTO/VO code and generate TypeScript type definitions. Maps Java types to TS (String β string, Integer β number, etc). |
| ZIP Tool | Multi-file archiver: compress to ZIP with drag-and-drop; extract ZIP / RAR / 7z / TAR / GZ / XZ / BZ2. Progress bar feedback. |
| Video to GIF | Browser-based MP4/WebM/MOV to GIF converter powered by ffmpeg.wasm. Two-pass palettegen quantization for quality output. Configurable FPS, resolution, time range. |
npm install # Install dependencies npm run dev # Start dev server npm run build # Production build npm run lint # Lint code
- Content caching β Editor state auto-saved (memory + localStorage), survives tool switches and page refreshes
- Lazy loading β Route-level code splitting, only current tool loaded on first visit
- Cross-tool communication β Data sharing via sessionStorage
| Category | Technology |
|---|---|
| Framework | Vue 3 (Composition API + <script setup>) |
| Language | TypeScript |
| Build | Vite 8 |
| UI | Element Plus |
| Editor | CodeMirror 6 |
| Charts | ECharts 6 Β· D3.js |
| Python | Pyodide (WebAssembly) |
| Archive | JSZip Β· libarchive.js |
| Video | ffmpeg.wasm (CDN lazy, ~24MB WASM) |
Built with Vue 3 + Vite + ECharts Β· GitHub