The term Vibe Coding was popularized by Andrej Karpathy¹ to describe a conversational, high-level way of programming with AI models, where you specify the intent, style, or 'vibe' of what you want and let the model draft most of the implementation details of a Web app.

No code, just words.

There are interrelated three elements of digital innovation: Think; Simplify; Vibe.

As illustrated above, Vibe Coding here is powered by Google Technology and driven by Design Thinking based on the Stanford d.school² method. This is five iterative stages to create a solid Think foundation for digital innovation. See Journal post: Think.

Vibe Coding with Google Firebase Studio.

Today, Vibe Coding is an effective way to Prototype new Web apps. It is literally no code, just words. Prompts entered into the right hand panel of Firebase Studio result in a Preview of the Prototype Web app in the left hand panel.

Citrizen CRM Vibe Coded app, Optimised as a Production Web app.

Build.

The Build process takes a Vibed Coded Prototype and turn this into a Production class Web app. In moving from Vibe to Build there is an intermediate step: Optimise.

Optimise Introduced.

The core objective of That! Haus Optimise (T!HO) is to act as the 'Production Hardening' layer in Vibe Code apps conceptualised with Google Firebase Studio and then moved to a Production Web app running on Google Cloud Platform.

The role of Optimise is also to ruthlessly eliminate variable costs to ensure economic viability. It is, in the jargon, a human-in-the-loop taking a 'Stochastic Model' inherent in a Vibe Coded Web app and turning this into a robust 'Deterministic Model' required for demanding Software-as-a-Service (SaaS) use cases, such as Customer Relationship Management (CRM) Web apps.

The Solution: T!HO Optimise systematically replaces expensive, probabilistic AI inference calls with cheap, deterministic cloud-native functions (Firestore Aggregations, Edge Caching, and Indexing). This will stabilise the Monthly Active User (MAU) cost at approximately £0.10 per user (based on the £100/month for 1,000 users model), ensuring the solution avoids what might be called ‘the Stochastic Model Trap’ of Vibe Coding leaduing to ballooning consumption costs.

Costs Reduced.

As noted above, when delivering the Production Web app on Google Cloud Platform, with an an intermediary Optimise step, The cost differences here are significant.

Vibe Coding (via Firebase Studio) defaults to ‘Reasoning’ (using Gemini 3 Pro) to solve data problems because it is the fastest way to build. However, at runtime, this incurs a massive ‘AI Tax’ (could be as high as $700/month for 1,000 users) and introduces latency.

T!HO Optimise systematically replaces expensive, probabilistic AI inference calls with cheap, deterministic cloud-native functions (Firestore Aggregations, Edge Caching, and Indexing). This will stabilise the Monthly Active User (MAU) cost at approximately £0.10 per user (based on the £100/month for 1,000 users model).

Performance Enhanced.

In the Prototype Web app, a user asks "How many tickets are open?" Gemini reads 50 records and counts them, so costs are high if used in Production. So, Optimise replaces the natural language query handler with Firestore Aggregation Queries, resulting in cost optimisation.

Optimise identifies Summary Components in the Vibe Code. Refactor to use count(), sum(), and average() serverside calculations. This reduces 50 Read operations + 1 AI Call \to 1 Aggregation Query cost (approx. 1/1000th of a penny).

If say, 1,000 users loading the same Departmental Updates page generates 1,000 Reads every time the page refreshes. Optimise provides a Smart Cache (Read Reduction). Optimise reduces Bandwidth and Read costs by up to 90% for high-traffic, low-change data.

Optimise applies a 'deleteAt timestamp' to all temporary data (eg. Audit logs, completed task notifications). Firestore native TTL policy automatically deletes these records at T+X days without incurring Delete operation costs. This significantly reduces Web app storage costs with higher user numbers. This keeps costs within the GCP Free Tier for storage for as long as possible.

Security Enforced.

From a security perspective, Optimise injects the following security posture:

Firestore Security Rules Engine:
This is creating granular, role-based rules and ensures strict multi-tenancy isolation (Data Sovereignty).

Input Validation:
Optimise wraps all API endpoints with Zod validation libraries. This prevents 'Garbage In' and protects against injection attacks, ensuring that even if Gemini hallucinates a code snippet, the data entering the DB is strictly typed. (Zod Schemas)

Solution Delivered.

Prototype: Use Gemini 3 Pro to build the features and UI fast. Get stakeholder buy-in.
Audit: Run the Vibe Code through Optimise: Identify every generateText() call.
Refactor: replace generateText('Summarize this list') with db.collection('list').count().
Move: logic from 'Clientside AI' to 'Serverside Typescript'.
Deploy: Push to Firebase Hosting with the optimised backend.

References

1. Karpathy, A. [@karpathy]. (2025, February 2). There’s a new kind of coding I call “vibe coding”, where you fully give in to vibes, embrace exponentials, and forget that code even exists. X. https://x.com/karpathy/status/1753472166197080428
2. The Hasso Plattner Institute of Design. (2004) Stanford d.school. https://dschool.stanford.edu/about
3. Kilpatrick, L. (2025, November 18). Start building with Gemini 3. Google. https://blog.google/technology/developers/gemini-3-developers/
4. Google. (2025). Get started with Firebase Studio. Firebase. https://firebase.google.com/docs/studio/get-started