PocketResume is a modern, privacy-first resume builder PWA powered by client-side WebGPU and Transformers.js. It features an agentic AI chatbot that can modify, improve, and format your resume in real time using ultra-fast local models like the Liquid Foundation Model (LFM-350M) or OpenAI-compatible APIs. Through a robust Text-to-Action Bridge, the AI performs complex updates like section rearrangement, template switching, page-break insertion, and font styling directly on the browser. Additionally, an on-device AI PDF parser reads and imports existing resumes, converting them into structured layouts in seconds with complete offline capability and zero data leakage.
The project is built using Preact for high performance and a small bundle size. It follows a modular architecture where data management, layout logic, and UI components are strictly separated.
- Data-Driven UI: The entire resume is represented by a single JSON object.
- On-Device AI: All AI features (parsing, chat) run locally via WebGPU/Transformers.js for total privacy.
- Style Isolation: Modular CSS ensures that templates can coexist without style leakage.
PocketResume features a state-of-the-art client-side AI architecture that operates with complete privacy, speed, and versatility.
All local inference runs directly on your GPU using WebGPU through @huggingface/transformers (v4.x).
- Dual-Backend Execution: The app tries WebGPU initialization (
q4orq4f16precision) first. If WebGPU is unsupported by the browser or hardware, it automatically falls back to WASM / CPU execution. - Context Summarization: A built-in summarization loop runs every 3 messages to condense conversation history, ensuring the chat assistant fits comfortably within the context window of lightweight local models.
By default, the assistant utilizes the ultra-compact LFM-350M (onnx-community/LFM2-350M-ONNX). Despite its tiny size (~350MB), it performs rapid reasoning, text improvements, and tool execution in real-time, making it perfect for running entirely on-device, including on mobile browsers.
The chatbot isn't just a text assistant; it's an agent capable of modifying and formatting the document. Because standard tool calling schemas can be heavy for local models, PocketResume uses a custom Text-to-Action Bridge:
- Tool Parsing: A regex-based streaming parser in AIContainer.jsx detects patterns in the LLM's text output like
[tool_name(param="value")]and executes them immediately. - Supported Agent Actions:
edit_field(path, value): Updates any resume text field using dot-notation (e.g.,experience.0.company).add_item(section)&delete_item(section, index): Manages list items.move_section(oldIndex, newIndex)&delete_section(index): Reorders or hides sections.change_template(template): Switches between visual layouts (e.g.,classicormodern).add_page_break(index)&delete_page_break(index): Inserts/removes print page breaks.set_font_style(fontName),set_font_size(size), &set_font_scale(scale): Controls visual typography.print_resume(): Opens the system print/PDF export dialog.
If you have an existing resume, you can import it instantly:
- Extraction: The app extracts raw text from your uploaded PDF locally using
pdf.js. - Structuring: The text is sent to the LLM (local LFM or remote API) with a strict JSON-enforcing system prompt.
- Hydration: The structured JSON is loaded directly into the app state, populating the entire resume in one click.
- Remote Fallback: Switch to OpenAI, Groq, or any OpenAI-compatible custom API endpoint.
- Config Sync: API keys, local model selections, and fallback settings are globally managed by aiConfigManager.js. This guarantees that the PDF parser and the chat assistant always use the same configuration, preventing redundant resource downloads.
- On-Device Hybrid AI Engine: WebGPU-powered AI with automatic WASM/CPU fallback for maximum compatibility.
- Agentic AI Chatbot: Interact with an intelligent assistant to write, refactor, and format your resume.
- Text-to-Action Bridge: Real-time layout and style updates (template, font, scale, page breaks) powered by regex tool-calling parsing.
- AI Resume Parsing: Extract data directly from existing PDF resumes locally using the LFM-350M model.
- Remote AI Fallback: Support for OpenAI-compatible APIs (OpenAI, Groq, local LLMs) as a high-performance alternative.
- PWA & Offline: Works without an internet connection and can be installed as a native app.
- Live Templates: Instantly switch between "Classic" and "Modern" layouts.
- Interactive Drag & Drop: Rearrange sections on the fly using native HTML5 drag events.
- Smart Content Editing: Markdown-style bolding support and automatic field hiding for empty data.
- Dynamic Scaling: Mobile-first design that auto-scales the resume to fit any screen size.
- Privacy First: All data is stored locally in your browser's
localStorage. No accounts required.
App.jsx: The main entry point. Orchestrates global state, handles PWA lifecycle, and implements global error/OOM detection for mobile stability./components/AI:AIContainer.jsx: Orchestrates state between the UI, the Web Worker, and Remote API fallbacks.AIChatWindow.jsx: Feature-rich chat interface with a dedicated Settings panel for custom model IDs and Remote API keys.
/utils:aiWorker.js: Web Worker handling local AI inference. Supports automatic WebGPU-to-WASM fallback.aiConfigManager.js: Centralized manager to sync AI settings (Model IDs, API keys) between the chat assistant and resume parser.resumeParser.js: Logic for AI-powered resume extraction, now optimized to use the unified AI settings.aiUtils.js: Utilities for markdown formatting and Remote API streaming.pdfParser.js: Client-side PDF text extraction engine.
Data is automatically synced to localStorage on every change via useResumeData.
Disables Edit Mode, applies specialized scaling for mobile, and injects a mobile-print class for pixel-perfect PDF generation.
This project uses bun as its primary package manager and vite for building.
# Install dependencies
bun install
# Start development server
bun run dev
# Build for production
bun run build- Destination: Save as PDF
- Margins: Set to Default (The app handles its own 15mm margins).
- Options: Ensure Background Graphics is checked.
Developed with ❤️ by MasterKN48