Members-Only
Recent Talks & Demos are for members only
You must be an AI Tinkerers active member to view these talks and demos.
Frontend Browser Agent Implementation
See a frontend component agent implementation with custom loops and UI tools. Learn unique context engineering strategies beyond simple message history.
I’m going to show my implementation for a browser-use agent that lives inside a frontend component:
- show code for custom agent loop and UI manipulation tools
- live demo
- share learnings about context engineering
- LangChainThe open-source framework for building and deploying reliable, data-aware Large Language Model (LLM) applications.LangChain is the essential framework for engineering LLM-powered applications: it simplifies connecting models (like GPT-4 or Claude) to external data, computation, and APIs. The platform provides a modular set of components—Chains, Agents, Tools, and Memory—allowing developers to quickly build complex workflows like Retrieval-Augmented Generation (RAG) pipelines and sophisticated conversational agents. Its Python and JavaScript libraries, combined with LangChain Expression Language (LCEL), offer a standardized interface for rapid prototyping and moving applications to production with confidence.
- TypeScriptTypeScript is an open-source superset of JavaScript: it adds static typing and compiles to clean, standards-based JavaScript.TypeScript is a high-level, open-source language developed by Microsoft: it acts as a superset of JavaScript, adding a powerful static type system. This system enables compile-time type checking, catching errors before runtime (a critical benefit for large-scale applications). The TypeScript Compiler (TSC) reliably transpiles all code into clean, standards-based JavaScript (ES3 or newer), ensuring compatibility across any browser or host environment (Node.js, React.js, etc.).
- AGENTSAutonomous software entities using large language models to reason, select tools, and execute complex workflows independently.Agents shift the focus from conversation to execution: they use frameworks like LangGraph or CrewAI to break down complex objectives into actionable tasks. These systems leverage external tools (Tavily for search, GitHub for code, or Salesforce for CRM) to operate across digital environments. Current benchmarks show agents can automate up to 80% of routine knowledge work by managing their own reasoning loops. These entities deliver finished outputs (validated data, resolved tickets, or deployed software) with minimal human intervention.
- ToolsTechnology Tools: The essential software, applications, and hardware that drive efficiency and automate complex processes across all professional sectors.Technology tools are the critical instruments (both tangible and intangible) that translate conceptual knowledge into practical, reproducible results: they are deployed to streamline workflows, reduce error rates, and achieve specific goals. In software development, this means using **Git** for version control, **Jira** for project management, or **Docker** for containerized application deployment . For general productivity, tools like **Google Drive** enable real-time collaboration and document sharing for millions of users . These assets, ranging from specialized software to all-in-one platforms, fundamentally change how organizations operate and innovate.
Related projects
Private Agents in your browser
Chicago
Demonstrates how to run small-language-model agents directly in the browser, enabling low-latency, cost-effective agentic tasks on a laptop…
How We Built a Browser Agent That Won't Go Rogue: A Technical Deep Dive
London
Explore Fabraix's architecture, showing how a Chrome extension isolates a local AI agent, securely captures page context, and…
Browser Operator: Web Browser with AI Agents
Seattle
Explore building a browser‑based AI agent platform: architecture choices, privacy‑first design, challenges of running small models, and limitations…
AI Agent that autonomously browses websites and executes task
Palo Alto
Demonstration of an autonomous AI agent that browses the Starbucks website, selects custom coffee options, and completes the…
Creating AI Agents in JavaScript
Miami
Live demonstration of building a JavaScript multi‑agent system using KaibanJS, showing role‑based agents, shared memory, LLM integration, tool…
Best practices for building web agents that actually work
San Francisco
Learn practical tips and code samples for building reliable web-browsing AI agents, tackling issues like large HTML, blocking,…