WebMCP at Scale with Susanna Wong

🎧 New Señors @ Scale Episode

This week, I spoke with Susanna Wong, staff software engineer at Typeform, a Google Developer Expert in Web Technologies since 2020, a member of the Google Developer Advisory Board, and a mentor through Women Techmakers. Susanna studied engineering at the University of Virginia, where the program let her assemble her own major out of systems engineering and computer science. She wrote software prototypes at SAP Labs in Palo Alto, then left to chase the creative side of code — a master's at the Architectural Association in London, and close to seven years working as a building architect and computational designer.

In this episode, we dig into what changed fundamentally between training your own models in 2020 and building on an LLM baseline today, where it makes sense to run a model in the browser instead of calling an API, how Typeform's multi-agent system is put together, what evals actually look like when your feature is non-deterministic, and why WebMCP could change how all of us build websites.

⚙️ Main Takeaways

1. Seven years as a building architect, writing code the whole time

The detour that people consistently misunderstand.

• Not a software architect: "I tell people that, oh yeah, I used to be an architect. People think like, oh, software architect — no, like literally building architect."
• What the code did: At Arup's facade engineering department, architects would produce complex shapes that then had to be broken down into panels within fabrication limits. The process is deeply iterative — "if you start with a certain configuration, you cannot foresee how it will be when you get to the other side of the shape" — so it has to be scripted.
• The real job: Writing scripts to try different configurations and optimize between cost and visual impact.
• Why she left: She still loved the creative side, but "in the architectural industry, it's all about project management. There's a lot of different parties to manage, and I still feel like I want to focus on code and building software."
• What she came back to: She'd built frontend at SAP using Google Web Toolkit — Java compiled to frontend. By 2016 and 2017 it was React and Angular. "JavaScript completely took over, which is really amazing to see."

2. Kedro made ML pipelines reproducible; Kedro-Viz made them explainable

Her first project at QuantumBlack, McKinsey's ML consultancy.

• The problem it solved: In 2020 people were still building models in Jupyter notebooks. For a data scientist "the most important product is the data, the analysis, the insights. So how you get there is not important" — which works right up until you need to scale.
• What Kedro is: An open source framework for building machine learning pipelines with real structure. She described it as "kind of like React for building machine learning models" — versioning, components, packages, instead of notebook versions scattered everywhere.
• The client-facing half: Kedro-Viz automatically renders the pipeline as an interactive DAG. Hand a client a pile of code and they can't tell what it does; hand them a diagram they can click into and they can.
• Modular pipelines: The feature her team shipped, which lets you group nodes into a small pipeline and chain those into a larger one. "If you build a Star Wars ship, you have different components that will make this ship. You have the seats, the wing and so on."
• Why it was a hard frontend problem: The data is effectively an infinite tree, and presenting that as a DAG that expands indefinitely was, in her words, one of the most fulfilling projects a frontend engineer can get.

3. The LLM replaced the trained model as the baseline

The single biggest shift she's watched since 2020.

• How it used to work: To predict next year's sales you collected your historical data, processed it manually, trained a model, and only then made a prediction. "The data is the baseline that you have in order to enable you to do that."
• How it works now: "No one is going to train their own models nowadays." You hand your sales data to an LLM as grounding and ask it to analyze and predict.
• Where custom still lives: "If they want something very custom, they would fine tune the LLM, but not train their own models."
• The old work still matters: "All this machine learning and all these advanced learnings there is pretty much the foundation for the LLM nowadays."

4. Web AI is older than it looks — and the baseline moved under it too

For anyone hearing the term for the first time.

• It predates the LLM era: Around 2022 and 2023 people were already talking about Transformers.js, hosting models in the browser, and doing visual recognition entirely client side.
• What changed: The idea is similar, but the abstraction level moved. "Back then, we still need to have the idea of, I'm going to train my model, I'm going to make my model better over time. With Web AI you still have that, but your baseline is the LLM."
• What you get: An offline model hosted in the browser — no API call, no token cost, and a genuine privacy story.

5. Run the model in the browser when the task is fundamental, not when it's hard

A clean rule for choosing between local and remote.

• Cost first: Running in the browser is free; calling the API isn't.
• Where local fails: Anything needing heavy reasoning or current information. Her example — recommending the best restaurants in Barcelona with up-to-date details — won't work, "because the one that is deployable onto the browser is not trained on the latest data."
• Where local wins: Foul-word detection, screening for specific keywords, translation. "You don't have to incur token calls and you also don't have that latency to have to call an API just to do something so simple."
• Hugging Face is the shortcut: "There are a lot of pre-trained, very powerful models for one specific task on Hugging Face" — better for that task than pinging a general API for everything.
• The download cost is shrinking: Models keep getting smaller, and Chrome is moving toward shipping Gemma models pre-built. "I'm a huge fan of downloading your own models and hosting your own models. I have yet to do one in production. But if it actually comes pre-built out of the box, I would actually utilize it."

6. Cross-browser support is what's blocking local-first AI in production

The honest reason this hasn't gone mainstream.

• The blocker: You can optimize the experience for Chrome, which is most of the web, "but still, there's always the problem where it's being supported across all the major browsers." I compared it to patching for old IE, and she agreed that's the shape of it.
• Where it works today: B2B apps where you control the browser, or privacy-heavy contexts. "Let's say if I build an app for a bank, which needs a lot of privacy, and I know all my users inside the bank, we can advise them to just only use Chrome."
• Where she wouldn't risk it: A general SaaS product, where you can't assume your users are on a good enough laptop to run offline models efficiently.
• What could unblock it: The Chrome team pushing baseline support across browsers, plus the WebNN standards work and hardware vendors shipping stronger local inference silicon. "We might get there — not even at some point, in very near future."
• Whose job it is: "It's also come down to us, the front-end enthusiasts, to really also advocate for it in our daily work."

7. Typeform's multi-agent system, and the UI context problem

What she's actually shipping right now.

• The shape of it: Typeform AI is a layer that lets users augment whatever they're doing, and underneath it is a multi-agent system built on OpenAI with LangChain — a supervisor agent plus specialized sub-agents.
• The protocols: Agents talk to each other over A2A. For internal APIs the team builds MCP tools that sit on top as a proxy, so agents can call them easily.
• Her current task: Making the agent aware of what the user is actually looking at — "injecting and building the whole UI context on our context engineering side for the agent."
• How different this is: "Very different from how the features that I would be building even just a year or two years ago."
• The other half of a staff role: Helping the whole organization adopt AI tooling and build faster, not just shipping the feature herself.

8. Evals are unit tests, except you run them many times

The elephant in the room for every team shipping AI features.

• The core shift: "We're switching from building deterministic features to something completely non-deterministic." One passing run means nothing — you run it repeatedly and compare results until you have confidence the configuration handles a class of request.
• Not a TDD loop: With TDD you write the test, make it pass, move on. "Nowadays, when you build AI features, tweaking your prompt is a must." Every prompt change means re-running your existing evals to catch regressions, then writing new ones for the new behavior.
• Design evals around use cases, not inputs: "You don't think, okay, my user do X, Y, and you get what they want. You need to think about, my user will ask about X, Y, Z as a use case, and I need to set my experiments, my evaluators, so that it can give me confidence that my model can handle these types of use cases."
• A concrete example: Making sure the agent web-searches correctly when a user says they work at Tesla and wants an onboarding form — and equally when they say McDonald's, or any other brand.

9. Offline evals during development, online evals against production traces

Two distinct places evals run, doing two different jobs.

• Offline evals: A predefined set of experiments, run locally, in CI/CD, or in a cloud environment. The closest thing to a test suite during development.
• Online evals: Once the agent is deployed, user requests and model responses become traces in your LLM evaluation system. You run evals against those traces to see whether performance has drifted, evaluating against real user behavior rather than a fixture.
• Why it never stops: "It's also something where you can continuously observe and evolve." Swap the model and you've swapped brains — "each of the models is like their own brain, their own personality, and they would perform very differently" — so the evals tell you how your system holds up on each one.
• On RAG: Not in use at Typeform yet, but on the roadmap and actively being looked into.

10. Rising token costs are a good problem, until they aren't

A refreshingly unpanicked take on AI spend.

• The current position: They monitor costs, but rising spend means more people using the AI features. "It's not a problem for us yet. We just want and really encourage users to use our AI system."
• On token-maxing culture: Susanna was blunt about vendors handing out awards for highest token usage. "It's like McDonald's give you the award for buying the most happy meals. I don't know whether it's a good thing or not."
• The eventual mitigation: For teams already on the wrong side of this, offline models are one of the levers worth reaching for.

11. WebMCP brings the web to agents instead of making agents imitate humans

The idea from her React Paris talk, and the one with the biggest blast radius.

• MCP in one line: "MCP is literally like a USB stick for agents to connect to whatever API that you want, or for agents to connect to the world of information, which is APIs."
• WebMCP in one line: The same plug, mounted on your website.
• What agents do today: Ask an assistant to log into your bank and it has to imitate a human — locate the username field, run OCR over the pixels, or walk the entire DOM tree reading ARIA labels to work out where things are.
• Why that's bad twice over: "A, it's unstable. And B, it's extremely costly to do that" — a full OCR pass or a whole DOM traversal just to find an input field.
• The inversion: "Rather than letting the agent go into a website and figure out everything like what a human does, it literally exposes a layer where it tells the agent, hey, this is what this website can do. If you want to log in, call this tool."
• What it buys: Far fewer tokens, direct execution instead of guessing, and a much lower failure rate. "If this is widely adopted, it will really change how we all build websites nowadays."

🧠 What I Learned

• Susanna spent close to seven years as a literal building architect, scripting facade panel optimization at Arup between cost and visual impact.
• Kedro brought structure and versioning to ML pipelines built in scattered Jupyter notebooks; Kedro-Viz turned them into an interactive DAG clients could actually understand.
• Modular pipelines let you compose nodes into small pipelines and chain those into bigger ones — rendering that as an infinitely expanding tree was the hard frontend problem.
• The baseline moved: in 2020 you needed your own data to train a model; now everything starts from the LLM, and custom means fine-tuning rather than training.
• Web AI predates the LLM boom — Transformers.js and browser-hosted visual recognition were being discussed back in 2022.
• Run a model in the browser for fundamental tasks (translation, keyword screening, foul-word detection) and call an API for reasoning or fresh data.
• Hugging Face has task-specific pre-trained models that beat a general API call for narrow jobs.
• Cross-browser support is the real blocker on local-first AI; it's viable for B2B or privacy-critical apps where you control the browser, not for general SaaS.
• Typeform's multi-agent system runs on OpenAI with LangChain, a supervisor plus sub-agents, A2A between agents, and MCP tools proxying internal APIs.
• Evals are unit tests for non-deterministic features — run them repeatedly, design them around user use cases, and re-run everything after every prompt change.
• Offline evals run during development and in CI; online evals run against production traces to catch drift and to compare models.
• WebMCP exposes tools to agents directly so they stop doing OCR and DOM traversal to find a login field — cheaper, more stable, and far less likely to fail.

💬 Favorite Quotes

"I tell people that, oh yeah, I used to be an architect. People think like, oh, software architect — no, like literally building architect."

"For data scientists, the most important product is the data, the analysis, the insights. So how you get there is not important."

"No one is going to train their own models nowadays."

"All this machine learning and all these advanced learnings there is pretty much the foundation for the LLM nowadays."

"You don't have to incur token calls and you also don't have that latency to have to call an API just to do something so simple."

"It's also come down to us, the front-end enthusiasts, to really also advocate for it in our daily work."

"We're switching from building deterministic features to something completely non-deterministic."

"Each of the models is like their own brain, their own personality, and they would perform very differently."

"MCP is literally like a USB stick for agents to connect to the world of information, which is APIs."

"If this is widely adopted, it will really change how we all build websites nowadays."

🎯 Also in this Episode

• Building her own major at the University of Virginia: mechanical engineering, then systems engineering, graduating in engineering science
• Writing software prototypes at SAP Labs in Palo Alto for PhD computer scientists — "back then we need a lab to do it, nowadays we just need Claude Code"
• The Architectural Association master's in Emerging Technologies and Design, a school that produced Zaha Hadid and the founder of OMA
• Building frontend at SAP with Google Web Toolkit — Java compiled into a web UI — before JavaScript took over
• Design systems and early GraphQL work at CNN that grew into a company-wide initiative, then Toyota Connected in digital mobility
• The offline restaurant recommender she built two years ago on a local Llama model — a pocket guide trained on her own preferences
• Why she thinks printed AI books go stale before they ship: a handbook she bought five months ago never mentions skills or harness engineering
• YouTube, podcasts, and conferences as the actual learning channels now — and the mental health cost of an industry moving at 100x
• Why conferences cut through the noise: the people claiming to orchestrate ten agents at once usually have access you don't

Resources

More from Susanna and the tools mentioned:

• Susanna on LinkedIn
• Susanna on X
• Kedro — The open source ML pipeline framework she worked on at QuantumBlack
• Typeform — Where she builds AI features on a multi-agent platform
• Hugging Face — Task-specific pre-trained models for browser-hosted inference
• Transformers.js — Running models directly in the browser
• WebMCP — The subject of her React Paris talk on bringing the web to agents
• WebNN — The browser neural network standard work referenced in the episode
• LangChain, A2A, and MCP — The agent stack behind Typeform AI

🎧 Listen Now

🎧 Spotify
📺 YouTube
🍏 Apple Podcasts

Episode Length: 42 minutes on Web AI and offline browser models, the cross-browser problem blocking local-first adoption, Typeform's multi-agent system, evals for non-deterministic features, and what WebMCP changes for everyone building websites.

Whether you're weighing a browser-hosted model against an API call, trying to work out how to test a feature that never returns the same thing twice, or wondering what your site should expose to agents, this conversation is grounded in someone shipping all three.

Happy shipping,
Dan