Дата публикации
ai_products

LiteParse в браузере: как выжать текст из любого PDF без сервера и без ИИ

Что нового

Появилась веб‑версия LiteParse — инструмента от LlamaIndex для извлечения текста из PDF, который раньше работал только как Node.js‑CLI.

Ключевые изменения:

  • Полностью в браузере. Теперь не нужен сервер, Node.js и установка CLI. Достаточно зайти на страницу:

    • Демо: https://simonw.github.io/liteparse/

  • Тот же стек, что и у CLI. Веб‑версия использует те же ядра, что и Node‑вариант:

    • PDF.js для работы с PDF;
    • Tesseract.js для OCR.

  • Два режима работы:

    • без OCR — для «нормальных» PDF, где текст не зашит в картинку;
    • с OCR — для сканов, где текст только на изображениях.

  • Простая визуализация результата:

    • текст, собранный в логичном порядке (с учётом колонок и сложной вёрстки);
    • JSON с координатами блоков (bounding boxes) для визуальных цитат;
    • опциональный вывод изображений страниц PDF прямо на странице.

  • Никакого бэкенда и передачи файлов. Весь разбор PDF и OCR выполняется в браузере, без загрузки документа на сервер. Это критично для чувствительных документов.

  • Автоматический деплой. Репозиторий настроен так, что каждый push прогоняет тесты и, если всё зелёное, деплоит сборку Vite на GitHub Pages.

CLI‑версия никуда не делась — веб‑интерфейс идёт как отдельный фронтенд поверх существующей логики.

Как это работает

Базовая идея

LiteParse решает не задачу «красиво отрендерить PDF», а задачу пространственного парсинга текста:

  • PDF хранит текст как набор фрагментов, разбросанных по странице.
  • LiteParse собирает эти фрагменты в правильном порядке, учитывая:
    • много колоночную вёрстку,
    • заголовки и подзаголовки,
    • блоки с разными шрифтами и размерами,
    • расположение текста на странице.

В результате вы получаете не просто «сырой дамп текста», а линейный поток, который можно отдавать в RAG‑системы, использовать для поиска, цитирования и т.д.

Под капотом веб‑версии

Веб‑реализация почти полностью повторяет Node‑версию по библиотекам:

  • PDF.js — парсит PDF в браузере, даёт доступ к текстовым объектам и их координатам.
  • Tesseract.js — применяет OCR, если в PDF только сканы.
  • LiteParse‑логика — поверх этого работает слой эвристик, который:
    • группирует текстовые фрагменты по колонкам и строкам;
    • сортирует блоки по координатам;
    • формирует линейный текст и JSON‑структуру с bounding boxes.

Веб‑приложение собрано на Vite. Интерфейс — статический index.html с TypeScript‑логикой, которая:

  1. Принимает PDF через drag‑and‑drop или выбор файла.
  2. Даёт переключатель «Run OCR» (по умолчанию выключен).
  3. Запускает LiteParse в браузере с выбранными настройками.
  4. Показывает:
    • текст в textarea с кнопкой «Copy»;
    • JSON в отдельной textarea с такой же кнопкой;
    • опционально — изображения страниц.

CLI‑версия (Node.js)

Оригинальный LiteParse — это CLI‑утилита для Node.js. Установка и запуск:

npm i -g @llamaindex/liteparse
lit parse document.pdf

CLI использует тот же стек (PDF.js, Tesseract.js), но работает в Node‑среде и ориентирован на агентов и бэкенд‑скрипты.

Пространственный парсинг и визуальные цитаты

Документация LiteParse описывает шаблон для Visual Citations with Bounding Boxes:

  • парсер возвращает не только текст, но и координаты каждого блока на странице;
  • по этим координатам можно:
    • нарисовать выделение на скриншоте страницы;
    • вырезать фрагмент изображения с цитатой;
    • показать пользователю ответ + маленький «скриншот‑доказательство».

В веб‑версии автор настоял на реализации «canvas‑encode swap»: страницы рендерятся через canvas PDF.js, а затем кодируются в изображения. Это позволяет строить такие визуальные цитаты прямо в браузере.

Что это значит для вас

Когда LiteParse в браузере полезен

  1. RAG по PDF прямо с рабочего ноутбука.

    • Нужно быстро прогнать PDF через парсер и отдать текст в вашу систему вопросов‑ответов.
    • Не хотите поднимать сервер, писать отдельный бэкенд или гонять документы через сторонние API.

  2. Документы с чувствительными данными.

    • Контракты, отчёты, внутренние презентации.
    • Веб‑версия не отправляет файл никуда — всё крутится в браузере. Это снижает риски утечек.

  3. Сложная вёрстка: научные статьи, отчёты, журналы.

    • Много колонок, таблицы, сложные шапки.
    • LiteParse использует эвристики для пространственного парсинга, поэтому текст получается более читабельным, чем при наивном извлечении.

  4. Подготовка визуальных цитат.

    • Нужно отвечать на вопросы по PDF и сразу показывать «откуда это в документе».
    • JSON с bounding boxes + скриншоты страниц позволяют собрать интерфейс с подсветкой источников.

  5. Быстрая проверка LiteParse без установки.

    • Можно просто открыть демо и проверить, как парсер справится с вашим PDF.

Когда инструмент не подойдёт

  • Нужен массовый бэкенд‑парсинг тысяч файлов.

    • Веб‑версия не предназначена для батч‑обработки и автоматизации.
    • В этом случае логичнее использовать CLI‑версию в пайплайне или обёртку вокруг неё.

  • Требуется полнотекстовый поиск и хранение.

    • LiteParse даёт текст и структуру, но не индексирует документы и не строит поиск.
    • Это кирпичик для вашей системы, а не готовый сервис.

  • Нужна идеальная верстка и восстановление таблиц.

    • Инструмент ориентирован на текст и координаты.
    • Сложные таблицы и графики он не превращает в структурированные таблицы.

  • Нет доступа к современному браузеру.

    • Проект тестировали в Chrome, Firefox и Safari на macOS.
    • Старые браузеры могут не потянуть PDF.js, Tesseract.js или современные API потоков.

Доступность в России

  • Демо размещено на GitHub Pages: https://simonw.github.io/liteparse/
  • GitHub Pages в России иногда открывается нестабильно и может требовать VPN — это зависит от провайдера.
  • Сам код можно форкнуть с GitHub и развернуть локально или на своём хостинге, если доступ к Pages затруднён.

Место на рынке

LiteParse — это не ещё один «ИИ‑читалка PDF», а аккуратный слой между сырым PDF и вашими LLM‑ или поисковыми системами.

По сравнению с простым PDF‑текст‑экстрактором

Большинство библиотек, которые «достаёт текст из PDF», делают одно:

  • идут по объектам PDF в порядке, в котором они лежат в файле;
  • склеивают их в строку.

Результат:

  • колонки перемешаны,
  • подписи и сноски влетают в середину текста,
  • цитировать и класть в RAG трудно.

LiteParse добавляет поверх этого слой пространственных эвристик, поэтому:

  • текст идёт в логичном порядке;
  • есть координаты блоков для визуальных ссылок;
  • можно строить доверие к ответам ИИ за счёт картинок‑доказательств.

По сравнению с «PDF‑в‑LLM»‑сервисами

Есть много сервисов, которые принимают PDF, гоняют его через GPT‑5 или Claude 4 и выдают чат‑интерфейс.

LiteParse решает другую задачу:

  • он не использует ИИ для парсинга;
  • он не общается с внешними API;
  • он даёт вам чистый текст + структуру, чтобы вы сами решали, как и с какой LLM работать.

Это особенно удобно, если вы уже строите свою RAG‑систему и вам нужен контролируемый, воспроизводимый парсер.

Веб против CLI

  • CLI‑версия лучше подходит для:

    • серверных пайплайнов;
    • интеграции с агентами;
    • массовой обработки.

  • Веб‑версия лучше для:

    • ручного анализа отдельных PDF;
    • быстрого прототипирования интерфейсов с визуальными цитатами;
    • работы с документами, которые нельзя отправлять на сервер.

Точными цифрами скорости или сравнениями с другими парсерами автор не делится, но архитектурно веб‑версия повторяет CLI: те же библиотеки, та же логика, только другая среда исполнения.

Установка

CLI‑версия LiteParse (Node.js)

Если вы хотите встроить LiteParse в свои пайплайны или использовать его из терминала, ставьте оригинальную CLI‑версию:

npm i -g @llamaindex/liteparse

lit parse document.pdf

Команда lit parse document.pdf:

  • парсит файл document.pdf;
  • извлекает текст с учётом структуры и координат;
  • использует OCR, если PDF содержит только изображения текста (через Tesseract или другой подключенный движок).

Веб‑версия LiteParse

Готовое демо:

  • Открыть в браузере: https://simonw.github.io/liteparse/

Что можно сделать без установки:

  1. Перейти по ссылке.
  2. Перетащить PDF в дроп‑зону или выбрать файл через диалог.
  3. При необходимости включить «Run OCR» (по умолчанию выключено).
  4. Нажать кнопку парсинга и дождаться результата.
  5. Скопировать текст или JSON через встроенные кнопки «Copy».

Если хотите развернуть у себя:

  1. Форкнуть репозиторий liteparse с GitHub (форк автора с папкой web/).

  2. В корне проекта установить зависимости и запустить Vite:

    npx vite

  3. Открыть локальный адрес (обычно http://localhost:5173) и протестировать.

В репозитории настроен GitHub Actions, который:

  • при каждом push запускает тесты;
  • при успешном прохождении деплоит Vite‑сборку на GitHub Pages;
  • в качестве корневой страницы использует web/index.html.

Как это делали: агентный воркфлоу с Claude Code

Интересная часть истории LiteParse для веба — процесс разработки.

Старт с телефона

Автор начал с обычного чата с Claude на iPhone:

  1. Загрузил случайный PDF с телефона.

  2. Дал промпт:

    Clone https://github.com/run-llama/liteparse and try it against this file

  3. Claude клонировал репозиторий с GitHub и прогнал PDF через CLI‑версию прямо в контейнере.

  4. После нескольких вопросов о том, как всё устроено, автор спросил:

    Does this library run in a browser? Could it?

Ответ убедил его, что браузерная версия реалистична.

Переход к Claude Code и планирование

Дальше автор:

  1. Форкнул репозиторий LiteParse на GitHub.

  2. Клонировал его локально, создал ветку web.

  3. Создал файл notes.md и вставил туда ответ Claude с исследованием.

  4. Дал Claude Code задачу:

    Get this working as a web app. index.html, when loaded, should render an app that lets users open a PDF in their browser and select OCR or non-OCR mode and have this run. Read notes.md for initial research on this problem, then write out plan.md with your detailed implementation plan

Claude Code написал plan.md. Автор несколько раз правил план через промпты, в том числе заставил реализовать «canvas‑encode swap», чтобы скриншоты страниц работали уже в первой версии.

После того как план его устроил, он написал лаконичное:

build it.

И оставил агента работать примерно на 59 минут, иногда добавляя уточняющие промпты.

Промпты по ходу разработки

Автор просил:

  • использовать Playwright и red/green TDD;
  • перейти на рендерер PDF.js вместо pdfium;
  • сделать финальный UI с:
    • текстом и pretty‑printed JSON,
    • двумя textarea и кнопками копирования,
    • мобильной вёрсткой;
  • делать «маленькие коммиты» по пути;
  • добавить ссылку на оригинальный LiteParse‑репозиторий в index.html без формулировки «View on GitHub →», чтобы не путать, какой именно репозиторий открыт;
  • по умолчанию отключить «Run OCR»;
  • чинить баги в Safari, связанные с readableStream;
  • изменить текст кнопки «Copy» на «Copied!» на 1,5 секунды после нажатия;
  • аккуратно стилизовать дроп‑зону, чтобы длинные имена файлов не ломали вёрстку в Firefox, и выровнять текст по вертикали.

Для отладки он запускал npx vite и смотрел, как меняется интерфейс при каждом коммите агента.

Автодеплой на GitHub Pages

Под конец он запустил ещё один сеанс Claude Code и дал задачу:

Look at the web/ folder - set up GitHub actions for this repo such that any push runs the tests, and if the tests pass it then does a GitHub Pages deploy of the built vite app such that the web/index.html page is the index.html page for the thing that is deployed and it works on GitHub Pages

Claude настроил workflow, который:

  • собирает приложение через Vite;
  • прогоняет тесты;
  • деплоит сборку на GitHub Pages по адресу:
    • https://simonw.github.io/liteparse/

Проверка, что агент не «считерил»

Автор не планировал вручную ревьюить весь код. Чтобы убедиться, что агент не оставил критичные TODO и не выкинул важные части логики, он:

  1. Запустил OpenAI Codex с GPT‑5.5 (у него был превью‑доступ).

  2. Спросил:

    Describe the difference between how the node.js CLI tool runs and how the web/ version runs

Ответ показал, что веб‑версия действительно повторяет архитектуру CLI, а не является заглушкой.

Vibe‑coding: насколько это «без контроля»

Автор придерживается строгого определения vibe‑coding: это когда вы используете ИИ для написания кода и вообще не смотрите на результат.

LiteParse для веба подпадает под это определение почти полностью:

  • он не открыл ни одной строки HTML или TypeScript, написанной агентом;
  • только проверял поведение приложения и давал дополнительные промпты;
  • пока писал статью, ему пришлось специально проверить, на чём всё написано — JavaScript или TypeScript.

При этом проект ощущается менее рискованным, чем другие vibe‑coded‑эксперименты, по нескольким причинам:

  • это статическое браузерное приложение на GitHub Pages;
  • оно либо работает с вашим PDF, либо нет — «радиус поражения» ошибок невелик;
  • все данные обрабатываются локально, без отправки на сервер;
  • он один раз заглянул в network‑панель и убедился, что при парсинге не уходит никаких дополнительных запросов.

Автор не открывал PR в основной репозиторий LiteParse, а завёл issue. Если команда LiteParse захочет, она сможет использовать его веб‑реализацию как стартовую точку для официальной версии.

Теги: javascript, ocr, pdf, projects, ai, generative-ai, llms, vibe-coding, coding-agents, Claude Code, agentic-engineering

Читайте также

#llama#javascript#nodejs#open-source
🔗 Источник: https://simonwillison.net/2026/Apr/23/liteparse-for-the-web/
← Все новости