Osama Ansar

Retrieval Playground

Lexical vs neural vs fused, scored in-browser

Paste a document, ask a question, mark the relevant chunks, and watch BM25, dense embeddings and Reciprocal Rank Fusion each rank the results — with recall@k, precision@k, MRR, hit@k and nDCG@k for all three. BM25, RRF and the metrics are hand-written; the embeddings run all-MiniLM-L6-v2 in your browser via Transformers.js. No backend, no API key.

TypeScript

Transformers.js

In-browser AI

BM25

Reciprocal Rank Fusion

Retrieval Metrics

$Refract logo$

Refract

Hybrid RAG that shows its work

BM25 (lexical) and HNSW (vector) retrieval run in parallel and get fused with Reciprocal Rank Fusion, with multi-hop agentic decomposition for genuinely cross-topic questions. The UI visualizes every retrieval score, fusion rank, and sub-question live as it runs.

TypeScript

RAG

BM25

HNSW

Reciprocal Rank Fusion

Agentic

DevSignal

A quieter way to read the developer internet

Collects public signals from ~10 developer sources — Hacker News, GitHub Trending, npm, arXiv, Stack Overflow, YouTube and more — and turns them into an editorial dashboard: topic momentum, trending languages, and cross-source clusters on an interactive radar. Ships on-device AI via Transformers.js: "Ask DevSignal" answers natural-language questions with ranked, clickable evidence, entirely in the browser.

TypeScript

Transformers.js

On-device AI

Semantic Search

Data Viz

GitHub Actions

generative-ui-chat

Chat that streams back real React components

Ask about revenue and get a live animated chart; ask to compare plans and get a real comparison table; ask to book a demo and get a working confirmation card. Built on the Vercel AI SDK tool-calling pattern, with the exact same streamText pipeline as a real deployment.

TypeScript

Next.js

Vercel AI SDK

Generative UI

Tool Calling

doc-chat-citations

Every claim cited, every citation clickable

A documentation chat assistant where clicking a citation jumps straight to the exact retrieved passage. From-scratch BM25 retrieval (no vector DB), a two-pane UI with a live-updating source panel, and streamed answers grounded in a demo knowledge base.

TypeScript

RAG

BM25

Vercel AI SDK

Citations

MELAI Engineering Lab

Sep 2026

Independent Project

A workbench that makes AI systems measurable and reproducible instead of black boxes. Three labs shipped so far: run one prompt across several models and compare latency, tokens and cost side by side; chunk a document and compare BM25, vector and hybrid (Reciprocal Rank Fusion) retrieval with the per-method rank behind every hybrid hit; then score a retrieval config against a dataset — recall@k, precision@k, MRR, nDCG, hit-rate — streamed case by case. BM25, RRF, cosine search and the eval metrics are all from scratch. Provider SDKs (Anthropic, OpenAI, Ollama) sit behind one interface, pricing lives in a single calculator, and every experiment persists the fully-resolved request so it replays exactly. pnpm + Turborepo monorepo, Fastify + SSE, Drizzle + pgvector, runs with zero keys and zero Docker via built-in mocks.

TypeScript

RAG

LLM Evaluation

LLM-as-judge

pgvector

Fastify

Monorepo

SSE

View Code View repo

Neural Atlas

Sep 2026

Independent Project

An interactive guide to how machine learning actually works — 35 lessons across seven tracks, each with a live widget you change and re-run: a feed-forward network you push signals through, attention weights that re-mix as you drag a query, a bottom-up merge sort, Dijkstra settling a weighted graph, PageRank converging. The Retrieval & RAG track and the LLM-decoding lesson port the from-scratch chunking, BM25, hybrid fusion and eval metrics from MELAI into browser visualizations. Next.js, no build-time content pipeline, deployed on Netlify.

TypeScript

Next.js

RAG

Interactive Visualization

Transformers

Inference Atlas

Sep 2026

Independent Project

A self-hosted LLM inference playground that shows what usually stays hidden. The playground streams responses over SSE with sampling presets, stop/regenerate, and per-request timing — time-to-first-token, latency, tokens/sec and an estimated infrastructure cost, all labelled as gateway measurements, not GPU kernel timings. A GPU page polls utilization, VRAM and throughput; a CPU gateway reports those as unavailable rather than inventing them. The stack is a Next.js App Router frontend behind a same-origin proxy, a FastAPI gateway, Redis for fixed-window rate limiting, expiring request records and optional response caching, and a vLLM server that pulls Hugging Face weights at startup — with a documented path from a fully simulated demo (no Python, Redis or GPU) to a real GPU deployment. No hosted model API is used, and no cloud GPU has been provisioned yet, so demo readings are explicitly not benchmarks; the vLLM adapter is covered by a mocked upstream contract test.

TypeScript

Python

FastAPI

vLLM

SSE Streaming

GPU Telemetry

Redis

Live demo

rag-eval-harness

Aug 2026

Independent Project

An LLM-judge evaluation harness for RAG pipelines: faithfulness, answer relevance, context precision, and context recall, with a CI regression gate. Correctly catches planted hallucinations in the sample dataset. Pluggable Judge interface (real OpenAI judge + a dependency-free FakeJudge for tests/CI), 9 unit tests with no API key required, auto-deployed live report on every push.

TypeScript

RAG

LLM Evaluation

Vitest

GitHub Actions

agentic-rag

Aug 2026

Independent Project

A multi-hop agentic RAG pipeline: decomposes complex questions into sub-questions, retrieves evidence per sub-question with a from-scratch BM25 implementation, checks answer sufficiency, and synthesizes a cited final answer. Zero framework dependency for the core BM25 ranking math. 7 unit tests, including hand-written mock LLMs exercising the sufficiency-loop and max-hop cutoff logic.

TypeScript

Agents

BM25

Multi-hop Retrieval

Vitest

HNSW Visualized

Sep 2026

Independent Project

HNSW (Hierarchical Navigable Small World) — the approximate nearest-neighbor graph production vector databases use internally — built from scratch in ~240 lines of dependency-free JavaScript: exponential level assignment, greedy descent, per-layer beam search, the Algorithm-4 neighbor heuristic, bidirectional linking with symmetric pruning. Vectors are d-dimensional and the canvas is a fixed 2-D random projection; every parameter change re-runs a 40-query held-out evaluation and shows mean recall@k against a brute-force baseline, mean distance calls, and the speed-up. Widen efSearch and recall climbs toward 100% as the distance-call count climbs with it — the whole approximate-vs-exact trade-off on one slider. 10 tests (node --test), static page with no backend, deployed as a Hugging Face Space. The metrics are the same hand-written ones from MELAI.

JavaScript

HNSW

Vector Search

Interactive Visualization

Retrieval Metrics

In-browser

ride-fare-advisor

Aug 2026

Independent Project

A natural-language trip advisor for Lahore: tell it a pickup and drop-off, and it calls a real tool that resolves both locations, estimates distance/time with a from-scratch Haversine + road-factor model, and quotes Uber, Yango, and InDrive fares through a rush-hour surge model — then the AI grounds its recommendation in those actual computed numbers, not canned copy. Installable as a mobile-first PWA.

TypeScript

Next.js

Vercel AI SDK

Tool Calling

PWA

View Code View pull request

Open Source: Vector-DB & Agent SDKs

Aug–Sep 2026

Open Source Contributor

Scoped bug fixes and feature work across the official TypeScript SDKs for Weaviate, Qdrant, Turso (libSQL) and Google's Agent2Agent protocol. Highlights: a maintainer-approved generative-module config builder and a silent data-loss fix in Weaviate's client; a dropped reverse-proxy path prefix in Qdrant's URL parsing; a UTF-8 vs UTF-16 byte-limit mismatch in libSQL's SQL cache; and pagination that the A2A REST transport was silently ignoring. Each PR mirrors the repo's existing patterns and ships with regression tests.

Open Source

TypeScript

Weaviate

Qdrant

Turso

Agent2Agent

Professional Experience

MenuLogic K12

Jan 2026 - Present

Senior Software Engineer

MenuLogic K12

A SaaS platform for K-12 school nutrition programs: real-time profit/loss per menu item, labor and overhead analytics, and recipe/menu management for school districts.

Full-stack development (Angular 21 + .NET 10) on a school-nutrition SaaS used by school districts to manage menus, recipes, and pricing. Built the product's Model Context Protocol (MCP) server, exposing recipe/ingredient/district tools to AI agents (Claude in Chat/Cowork) with a custom OAuth 2.1 + PKCE authorization-code flow and tenant-scoped tool authorization that mirrors the REST API's own role system, so an agent only ever sees what the equivalent web-app user could.

Angular

.NET

TypeScript

MCP

AI Agents

OAuth 2.1

GoStork

Freelance Full-Stack Developer

GoStork

A comprehensive fertility services marketplace using AI to transform unstructured agency data into searchable, structured profiles.

A fertility services marketplace connecting intended parents with egg donor agencies, surrogacy agencies, IVF clinics, sperm banks, law firms, and adoption agencies. Built an AI-powered PDF extraction system using GPT-4 to automatically extract and structure agency profile data from unstructured PDFs, and built the platform's real-time messaging infrastructure (WebSocket chat). Also developed cost detail pages and maintained data scrapers.

Node.js

TypeScript

OpenAI GPT-4

PostgreSQL

Kubernetes

LiveArena

Freelance Full-Stack Engineer

Broadcasting Platforms

Builds tailored live-streaming experiences and white-label platforms for brands across entertainment, sports, and iGaming — including LiveArena, a pay-per-view combat-sports streaming platform, and Studio, a live broadcast-control app.

An enterprise-grade pay-per-view live streaming platform (market-facing as LiveArena.io and IceCage.live) built to scale to 500,000 concurrent users via edge computing and intelligent caching. Built DRM-protected video streaming infrastructure (Widevine, PlayReady, FairPlay) and an event-based variant pricing engine, plus real-time payment celebrations via Pusher, dynamic watermarks, resumable S3 uploads via the TUS protocol, and seamless player switching during buffering. Also built a Kafka-consuming service for Studio, LiveArena's live broadcast-control app, that auto-generates video clips for a casino/iGaming client deployment.

Next.js

Cloudflare Workers

DRM

Hono.js

Kafka

Truckpedia

Feb 2024 - Jan 2026

Software Engineer

Truckpedia

A leading platform providing comprehensive solutions for the trucking industry, including fleet management, logistics optimization, and real-time data analytics.

Led frontend development using Angular, React, and Vue. Optimized scalability, enhanced user performance, and implemented real-time updates across multiple devices.

Angular

React

Vue

Real-time

Ink Platform

May 2022 - Dec 2023

Software Engineer

Omnivex Corporation

Canada-based digital signage company (since 1993) with franchises in USA, Norway, and Mexico. Specializes in real-time digital signage solutions with flagship products Ink and Moxie.

Developed custom UI components for the Ink platform using Angular, React, Vue, and SignalR for real-time UX. Improved component reusability and reduced code duplication.

Angular

React

Vue

SignalR

GoOrder

Jan 2020 - Jun 2022

Senior JavaScript Developer

Contrive Solutions

A software development company specializing in custom web and mobile applications, enterprise solutions, and digital transformation services for businesses across various industries.

Developed a Vue/Vuex food delivery application. Implemented user-friendly interfaces, order tracking, and payment processing features.

Vue.js

Vuex

Food Delivery

Arena - Soundblock

Jan 2020 - Jun 2022

Senior JavaScript Developer

Contrive Solutions

A software development company specializing in custom web and mobile applications, enterprise solutions, and digital transformation services for businesses across various industries.

Built reusable UI components across 7 products. Focused on consistency, performance, and maintainability across the product ecosystem including Soundblock as the primary product.

UI Components

Reusability

Cross-product

Finlex

Jan 2020 - Jun 2022

Senior JavaScript Developer

Contrive Solutions

A software development company specializing in custom web and mobile applications, enterprise solutions, and digital transformation services for businesses across various industries.

Created shared Micro Frontend component libraries using Angular. Implemented scalable architecture and optimized performance for this insurance consultant company in Germany.

Angular

Microfrontends

Component Libraries

Blunk

May 2019 - Nov 2019

JavaScript Developer

Webicosoft

A software development company based in Pakistan that provides web and mobile application development services, specializing in custom solutions for startups and enterprises.

Developed full-stack features for Blunk job-matching platform. Implemented React frontend with Redux and Semantic UI, and built backend using Node.js and MongoDB.

React

Redux

Node.js

MongoDB