Building a local-AI healthcare MVP in the browser (Chrome Prompt API) — MediReport Assist

I’ve had blood checkups frequently. The reports usually show raw numbers (Hb, RBC, WBC, etc.) and very little interpretation. To get clarity, I’d end up booking an appointment — and sometimes even then, different doctors would interpret the same report differently.

So I built a small MVP: MediReport Assist — a privacy-first, accessibility-friendly app that generates a human-readable summary and diet guidance from a few blood report values.

• Live app: https://medi-report-assist.vercel.app/
• GitHub: https://github.com/pavan-sh/medi-report-assist
• Devpost: https://devpost.com/software/medireport-assist

Disclaimer: This is an MVP demo and not medical advice. Always consult a qualified doctor for diagnosis and treatment.

Why “local AI” in a healthcare-style app

Healthcare data is sensitive. If your workflow depends on sending numbers to a cloud model, you immediately inherit:

• privacy/security risk (data leaving the device)
• latency + internet dependency
• operational cost (API usage)

Chrome’s built-in AI (Prompt API) lets you process data on-device, which improves:

• privacy: the input stays local to the browser
• speed: no network round-trips for inference
• reliability: works even on flaky connections

That tradeoff is exactly why this was a fun project: it’s a realistic use case for “local AI” that isn’t just a toy chatbot.

What the app does (MVP scope)

For this MVP, I intentionally kept the scope small and focused:

1. Collects numeric blood report inputs:
   • sex
   • age
   • hemoglobin (Hb)
   • RBC count
   • total WBC
2. Generates a summary + diet guidance
3. Shows a meaningful error if local AI isn’t available
4. Does not retain user data

UX: accessibility + safety

Two things I cared about from day one:

• Accessibility: clear labels, predictable layout, keyboard-friendly UI.
• Safety/expectations: explicit disclaimer and a privacy checkbox before submission.

The form enforces a privacy-policy agreement before it runs the analysis.

The core implementation (Prompt API)

The app is built with:

• Next.js 14
• TypeScript
• Tailwind
• shadcn/ui components

On the client, it checks for the Prompt API via the global ai object.

1
// if `ai` doesn't exist, the browser doesn't support it (or it's not enabled)
2
// @ts-expect-error
3
if (typeof ai === 'undefined') {
4
  setIsAIEnabled(false)
5
} else {
6
  // @ts-expect-error
7
  const session = await ai?.languageModel?.create()
8
  setAiSession(session)
9
}

Then it generates a prompt from the form values:

1
export function generatePromptInput(params) {
2
  return `Below is blood report for:
3
   Sex - ${params.sex},
4
   Age - ${params.age},
5
   Hemoglobin - ${params.hemoglobin} gm%,
6
   RBC count - ${params.rbcCount} millions/cumm,
7
   Total WBC - ${params.totalWbc} cumm.
8

9
Provide a summary of the report along with guidance on diet to address deficiencies.
10
Use tables to present the diet plan`
11
}

And uses streaming output for better UX:

1
const stream = await session.promptStreaming(prompt)
2
for await (const chunk of stream) {
3
  setResponseText(chunk.trim())
4
}

In early tests, promptStreaming() felt noticeably more responsive than waiting for a single long prompt() response.

Handling unsupported browsers (the “real-world” part)

If the user opens the app in a non-supported browser (or Chrome without Prompt API enabled), the app shows a dedicated error screen with steps.

It includes guidance to:

1. Join Chrome’s early preview program
2. Update Chrome
3. Enable any required AI/Prompt API flags (if the preview program instructs)
4. Restart Chrome

This matters because “local AI” on the web is still emerging — feature detection and graceful fallback are mandatory.

Challenges I hit

• Browser support / flags: getting Prompt API working required the right Chrome version and setup.
• Latency: prompt() could take a while for longer prompts; streaming improved the perceived performance.

What I learned

• How to integrate Chrome’s built-in Prompt API into a real UI flow
• Why privacy-first architecture matters more in healthcare-adjacent apps
• Why accessibility testing should happen early (not after the fact)

What’s next

If I extend this beyond the MVP, the next features would be:

• Support more test categories (lipid profile, urinalysis, imaging summaries, etc.)
• Download / print the generated analysis
• Better guardrails in the prompt (more “don’t diagnose” behavior)

Try it

• App: https://medi-report-assist.vercel.app/
• Repo: https://github.com/pavan-sh/medi-report-assist

If you’re building with Chrome built-in AI too, I’d love to compare notes — especially around reliability, performance, and what UX patterns work best for “on-device” inference.