EP154: What is MCP?

Cut your QA cycles down to minutes with QA Wolf (Sponsored)

If slow QA processes bottleneck you or your software engineering team and you’re releasing slower because of it — you need to check out QA Wolf.

Their AI-native service gets engineering teams to 80% automated end-to-end test coverage and helps them ship 5x faster by reducing QA cycles from hours to minutes.

QA Wolf takes testing off your plate. They can get you:

• Unlimited parallel test runs for mobile and web apps

• 24-hour maintenance and on-demand test creation

• Human-verified bug reports sent directly to your team

• Zero flakes guarantee

The benefit? No more manual E2E testing. No more slow QA cycles. No more bugs reaching production.

With QA Wolf, Drata’s team of 80+ engineers achieved 4x more test cases and 86% faster QA cycles.

---

This week’s system design refresher:

• Calling for Reviewers for Upcoming Books

• What is MCP?

• How to Design a System like Instagram

• How to load your websites at lightning speed

• SPONSOR US

---

Calling for Reviewers for Upcoming Books

We’re excited to announce three new books coming soon:

• Behavioral Interview

• Object-Oriented Design Interview

• Mobile System Design Interview

The first drafts of these books are complete, and we’re looking for reviewers to help make them better.

If you’re interested in serving as a reviewer, we’d love to hear from you! Please send an email to hi@bytebytego.com with a brief introduction, specify which book you’d like to review, and include a link to your LinkedIn profile. Thank you for considering this opportunity!

Please note that this is a volunteer position (not paid). As a token of our appreciation, we’ll include your name in the book’s acknowledgments if you help with the review process.

---

What is MCP?

Why is everyone talking about it? Let’s take a closer look.

Model Context Protocol (MCP) is a new system introduced by Anthropic to make AI models more powerful.

It is an open standard (also being run as an open-source project) that allows AI models (like Claude) to connect to databases, APIs, file systems, and other tools without needing custom code for each new integration.

MCP follows a client-server model with 3 key components:

1. Host: AI applications like Claude that provide the environment for AI interactions so that different tools and data sources can be accessed. The host runs the MCP Client.

2. MCP Client: The MCP client is the component inside an AI model (like Claude) that allows it to communicate with MCP servers. For example, if the AI model wants data from PostgreSQL, the MCP client formats the request into a structured message to send to the MCP Server

3. MCP Server: This is the middleman that connects an AI model to an external system like PostgreSQL, Google Drive, or an API. For example, if Claude analyzes sales data from PostgreSQL, the MCP Server for PostgreSQL acts as the connector between Claude and the database.

MCP has five core building blocks (also known as primitives). They are divided between the client and server.

1. For the clients, the building blocks are Roots (secure file access) and Sampling (ask the AI for help with a task such as generating a DB query).

2. For the servers, there are Prompts (instructions to guide the AI), Resources (Data Objects that the AI can reference) and Tools (functions that the AI can call such as running a DB query).

Over to you: Have you explored Anthropic’s Model Context Protocol?

---

Hands-on debugging session: instrument, monitor, and fix (Sponsored)

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and the new Trace Explorer 🤩, and leverage some good ol’ AI to find and fix issues fast.

---

How to Design a System like Instagram

Here’s a simple step-by-step approach to build the core functionality:

1. Users perform an action on their device like tapping the like button, uploading a picture, or following another user.

2. The request goes through a gateway to the backend server built using frameworks like Django, Express, or anything else.

3. The data is stored in the database.

   • Structured data such as user profiles, comments, and relationships are stored in relational databases like Postgres.

   • Data items requiring high write throughput such as user feeds and activity logs can be stored in eventually consistent databases like Cassandra.

   • Frequently accessed data is stored in cache (for example, Redis or Memcached).

4. Images and videos are stored in an object storage and corresponding metadata is stored in the database.

5. Asynchronous tasks like sending notifications are sent to a queue.

6. Background workers (like Celery) retrieve the task from the queue and perform the necessary processing.

7. Celery worker also performs the necessary updates in the databases.

Over to you: What else will you add to build an Instagram-like system?

---

How to load your websites at lightning speed

Check out these 8 tips to boost frontend performance:

1. Compression
   Compress files and minimize data size before transmission to reduce network load.

2. Selective Rendering/Windowing
   Display only visible elements to optimize rendering performance. For example, in a dynamic list, only render visible items.

3. Modular Architecture with Code Splitting
   Split a bigger application bundle into multiple smaller bundles for efficient loading.

4. Priority-Based Loading
   Prioritize essential resources and visible (or above-the-fold) content for a better user experience.

5. Pre-loading
   Fetch resources in advance before they are requested to improve loading speed.

6. Tree Shaking or Dead Code Removal
   Optimize the final JS bundle by removing dead code that will never be used.

7. Pre-fetching
   Proactively fetch or cache resources that are likely to be needed soon.

8. Dynamic Imports
   Load code modules dynamically based on user actions to optimize the initial loading times.

Over to you: What other frontend performance tips would you add to this cheat sheet?

---

SPONSOR US

Get your product in front of more than 1,000,000 tech professionals.

Our newsletter puts your products and services directly in front of an audience that matters - hundreds of thousands of engineering leaders and senior engineers - who have influence over significant tech decisions and big purchases.

Space Fills Up Fast - Reserve Today

Ad spots typically sell out about 4 weeks in advance. To ensure your ad reaches this influential audience, reserve your space now by emailing sponsorship@bytebytego.com.