Web-LLM MCP Server

An MCP server that uses Playwright to load and interact with an HTML page containing @mlc-ai/web-llm for local LLM inference.

Features

• Browser-based LLM: Uses @mlc-ai/web-llm running in a Chromium browser instance

• Playwright Integration: Automates browser interactions for seamless LLM operations

• Multiple Tools: Generate text, chat, check status, change models, and take screenshots

• Model Management: Support for various Web-LLM models with dynamic switching

Related MCP server: Playwright MCP

Available Tools

playwright_llm_generate

Generate text using Web-LLM through the browser interface.

Parameters:

• prompt (string): The prompt to generate text from

• systemPrompt (string, optional): System prompt to set context

• maxTokens (number, optional): Maximum tokens to generate

• temperature (number, optional): Temperature for generation (0-1)

• model (string, optional): Model to use (will reinitialize if different)

playwright_llm_chat

Start an interactive chat session and return the response.

Parameters:

• message (string): Message to send in the chat

• clearHistory (boolean, optional): Clear chat history before sending

playwright_llm_status

Get the current status of the Web-LLM Playwright interface.

playwright_llm_set_model

Change the current Web-LLM model.

Parameters:

• model (string): Model ID to switch to

playwright_llm_screenshot

Take a screenshot of the Web-LLM interface.

Parameters:

• path (string, optional): Path to save screenshot

Supported Models

• Llama-3.2-1B-Instruct-q4f32_1-MLC (default)

• Llama-3.2-3B-Instruct-q4f32_1-MLC

• Phi-3.5-mini-instruct-q4f16_1-MLC

• gemma-2-2b-it-q4f32_1-MLC

• Mistral-7B-Instruct-v0.3-q4f16_1-MLC

• Qwen2.5-1.5B-Instruct-q4f32_1-MLC

Installation

1. Install dependencies:

pnpm install

2. Install Playwright browsers:

npx playwright install chromium

Usage

Start the MCP server:

node index.js

Or run the test:

node test.js

Technical Details

The server works by:

1. Launching a headless Chromium browser using Playwright

2. Loading the index.html file which contains the Web-LLM interface

3. Waiting for the Web-LLM model to initialize

4. Exposing browser functions through the window.webllmInterface object

5. Providing MCP tools that call these browser functions

The HTML interface provides a complete Web-LLM implementation with:

• Model initialization and loading progress

• Chat interface for testing

• JavaScript API for programmatic access

• Error handling and status reporting

Notes

• First run will be slower as it downloads and initializes the LLM model

• The browser runs in headless mode by default

• Screenshots can be taken for debugging the interface

• Model switching requires reinitialization which takes time

• The interface is fully self-contained in the HTML file# project

project