<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preload" as="image" href="https://bytes.dev/images/bytes-banner-rounded.png">
<link rel="preload" as="image" href="https://bytes.dev/images/content/eyes.png">
<link rel="preload" as="image" href="https://bytes.dev/images/content/eve-rapper.jpg">
<link rel="preload" as="image" href="https://bytes.dev/images/fb-share-icon.png">
<link rel="preload" as="image" href="https://bytes.dev/images/li-share-icon.png">
<link rel="preload" as="image" href="https://bytes.dev/images/tw-share-icon.png">
<link rel="preload" as="image" href="https://bytes.dev/images/em-share-icon.png">
<link rel="preload" as="image" href="https://bytes.dev/images/content/greptile-logo.png">
<link rel="preload" as="image" href="https://bytes.dev/images/content/druski-point.jpg">
<link rel="preload" as="image" href="https://bytes.dev/images/content/pop-quiz.png">
<link rel="preload" as="image" href="https://bytes.dev/images/content/cool-bits.png">
<link rel="preload" as="image" href="https://bytes.dev/images/bytes-icon.png">
<title>Bytes: Next.js for agents</title>
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<link href="https://fonts.googleapis.com/css2?family=Fira+Mono&family=Outfit:wght@400;500;700;900&family=Paytone+One" rel="stylesheet">
<style>@media (prefers-color-scheme: dark) {
.email-wrapper {
color: #F9F4DA !important;
background-color: #0F0D0E !important;
}
hr {
border-color: #262422 !important;
}
mark {
background-color: #231F20 !important;
color: #F9F4DA !important;
}
pre {
background-color: #231F20 !important;
border: 1px solid #231F20 !important;
color: #F9F4DA !important;
}
.bg-alt {
background-color: #231F20 !important;
}
.unsubscribe-link {
color: #504C48 !important;
}
.token.punctuation {
color: #f9f4da !important;
}
}
@media screen and (min-width: 600px) {
.mobile-break {
display: none;
}
}</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<table class="email-wrapper" border="0" cellspacing="0" width="100%" style="background-color: #FFF; border-collapse: collapse; color: #231F20; font-family: Outfit, sans-serif; font-size: 18px; width: 100%;"><tbody><tr>
<td style="border-collapse: collapse !important; word-break: normal;"></td>
<td width="600px" style="border-collapse: collapse !important; width: 600px; word-break: normal;"><div style="max-width:600px;padding-top:80px">
<div style="text-align:center"><img width="600" style="max-width: 100%; padding-bottom: 40px;" src="https://bytes.dev/images/bytes-banner-rounded.png" alt="Bytes"></div>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"><strong style="font-weight: 600;">Today’s issue:</strong> Bun spelled backwards, an all-American coding harness, and why you might need to buy a fire extinguisher.</p>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Welcome to <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/6qhehoul85785eaohk/aHR0cHM6Ly9ieXRlcy5kZXYvYXJjaGl2ZXMvNDk3" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038592">#497</a>.</p>
<hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;">
<div style="text-align:center;margin-bottom:36px">
<img width="80" src="https://bytes.dev/images/content/eyes.png" alt="Eyeballs logo" style="max-width: 100%;"><h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;">The Main Thing</h2>
</div>
<div class="bg-alt" style="background-color: #f5f5f5; border-radius: 16px; margin-bottom: 40px; max-width: 100%; padding: 24px; padding-bottom: 12px;">
<img src="https://bytes.dev/images/content/eve-rapper.jpg" alt="Eve rapping" width="600" style="border-radius: 5px; max-width: 100%;"><p style="font-family: Outfit, sans-serif; font-size: 17px; font-style: italic; line-height: 1; margin: 0; padding-bottom: 4px; padding-left: 24px; padding-right: 24px; padding-top: 10px; text-align: center;">The last thing you see before your agent bankrupts you<!-- --> </p>
</div>
<h3 style="font-size: 24px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;">Next.js for agents</h3>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">The New York Knicks just won the NBA championship, World Cup fans are experiencing the joys of free refills and ranch, and Vercel just launched <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/kkhmh2un05l05qtlh7/aHR0cHM6Ly92ZXJjZWwuY29tL2Jsb2cvaW50cm9kdWNpbmctZXZl" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038593">a new agent framework called <code style="font-size: 15px;">eve</code></a>. It’s safe to say that we haven’t seen this level of vibes since Hot Girl Summer. But as much as we want to talk ball, we all know why we’re here. Let’s get to it.</p>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">This new open-source framework is like <code style="font-size: 15px;">Next.js</code> but instead of composing routes, layouts and components for web pages, <code style="font-size: 15px;">eve</code> uses the file system to describe an agent’s infrastructure and behavior. And conveniently for Vercel, this framework uses pretty much all of their services <span role="img" aria-label="money-mouth face">🤑</span>. But to be fair, building agents is much more about stringing services together than writing a bunch of code, and as it turns out, a directory structure is a really nice way to do this.</p>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">With <code style="font-size: 15px;">eve</code>, an agent looks like this:</p>
<pre style="background-color: #f9f9f9; border: 1px solid #f9f9f9; border-radius: 8px; color: #231F20; padding: 24px;"><code style="font-size: 15px;">agent/
├── agent.ts # the model it runs on
├── instructions.md # who it is
├── tools/
│ ├── run_sql.ts # what it can do
│ └── post_chart.ts
├── skills/
│ └── revenue-definitions.md # what it knows
├── subagents/
│ └── investigator/ # who it delegates to
├── channels/
│ └── slack.ts # where it lives
└── schedules/
└── monday-summary.ts # when it acts on its own
</code></pre>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Here is a quick breakdown of the different components:</p>
<ul>
<li>
<strong style="font-weight: 600;">Durable runtime:</strong> Built on top of Vercel’s Workflows service, the runtime can be suspended and resumed without losing state.</li>
<li>
<strong style="font-weight: 600;">Sandboxes:</strong> Agents can spin up sandboxed environments (Firecracker microVM) to run untrusted code that your agent generates.</li>
<li>
<strong style="font-weight: 600;">Connect:</strong> This service handles OAuth connections to external services like Linear, Slack, Discord, and more.</li>
<li>
<strong style="font-weight: 600;">Cron:</strong> When marketers use the word “agentic” they usually just mean a spicy cron job, so obviously that’s a part of the stack.</li>
<li>
<strong style="font-weight: 600;">Evals:</strong> Built on their observability service, evals let you “score” how well your agent did on a given task and give you information on how to improve the agent over time.</li>
</ul>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"><strong style="font-weight: 600;">Bottom Line:</strong> If the brief for <code style="font-size: 15px;">eve</code> was to create a product that uses every service Vercel has ever created, they definitely succeeded. But even if this product bankrupts me, I’d still choose it over manually wiring things up in AWS.</p>
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse; margin-top: 40px; text-align: center;"><tbody><tr><td style="border-collapse: collapse !important; padding-top: 12px; word-break: normal;">
<a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/25h2h9u3p82p8kt3h4/aHR0cHM6Ly9mYWNlYm9vay5jb20vc2hhcmVyL3NoYXJlci5waHA_dT1odHRwcyUzQSUyRiUyRmJ5dGVzLmRldiUyRmFyY2hpdmVzJTJGNDk3" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1864038595"><img alt="" style="display: inline-block; max-width: 100%; width: 32px;" width="25" src="https://bytes.dev/images/fb-share-icon.png"></a><a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/qvh8h8udm4rm4kulhk/aHR0cHM6Ly93d3cubGlua2VkaW4uY29tL3NoYXJpbmcvc2hhcmUtb2Zmc2l0ZS8_dXJsPWh0dHBzJTNBJTJGJTJGYnl0ZXMuZGV2JTJGYXJjaGl2ZXMlMkY0OTc=" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1864038596"><img alt="" style="display: inline-block; max-width: 100%; width: 32px;" width="25" src="https://bytes.dev/images/li-share-icon.png"></a><a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/g3hnhwum8l38l0trh9/aHR0cHM6Ly90d2l0dGVyLmNvbS9pbnRlbnQvdHdlZXQvP3RleHQ9VmVyY2VsJTIwbGF1bmNoZWQlMjBhJTIwbmV3JTIwYWdlbnQlMjBmcmFtZXdvcmslMjBjYWxsZWQlMjBldmUuJnVybD1odHRwcyUzQSUyRiUyRmJ5dGVzLmRldiUyRmFyY2hpdmVzJTJGNDk3" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1864038597"><img alt="" style="display: inline-block; max-width: 100%; width: 32px;" width="25" src="https://bytes.dev/images/tw-share-icon.png"></a><a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/9qhzhdudv6pv68f9h3/bWFpbHRvOj9zdWJqZWN0PVlvdSUyMGxpa2UlMjBjb3JuYnJlYWQlM0YmYm9keT1UaG91Z2h0JTIweW91JTI3ZCUyMGxvdmUlMjB0aGlzJTIwd2VlayUyN3MlMjBCeXRlcyUwQS0tLSUwQVZlcmNlbCUyMGxhdW5jaGVkJTIwYSUyMG5ldyUyMGFnZW50JTIwZnJhbWV3b3JrJTIwY2FsbGVkJTIwZXZlLiUwQWh0dHBzJTNBJTJGJTJGYnl0ZXMuZGV2JTJGYXJjaGl2ZXMlMkY0OTc=" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1864038598"><img alt="" style="display: inline-block; max-width: 100%; width: 32px;" width="25" src="https://bytes.dev/images/em-share-icon.png"></a>
</td></tr></tbody></table>
<hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;">
<div style="text-align:center;margin-bottom:36px">
<img width="150" src="https://bytes.dev/images/content/greptile-logo.png" alt="Greptile logo" style="max-width: 100%;"><h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;"><span>Our Friends <br class="mobile-break">(With Benefits)</span></h2>
</div>
<div class="bg-alt" style="background-color: #f5f5f5; border-radius: 16px; margin-bottom: 40px; max-width: 100%; padding: 24px; padding-bottom: 12px;">
<img src="https://bytes.dev/images/content/druski-point.jpg" alt="Druski pointing" width="600" style="border-radius: 5px; max-width: 100%;"><p style="font-family: Outfit, sans-serif; font-size: 17px; font-style: italic; line-height: 1; margin: 0; padding-bottom: 4px; padding-left: 24px; padding-right: 24px; padding-top: 10px; text-align: center;">When my AI code reviewer makes a valid point<!-- --> </p>
</div>
<h3 style="font-size: 24px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;"><a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/3ohphdu352752wbrhn/aHR0cHM6Ly93d3cuZ3JlcHRpbGUuY29tLz91dG1fc291cmNlPWJ5dGVzJnV0bV9tZWRpdW09c3BvbnNvcnNoaXAmdXRtX2NhbXBhaWduPWJ5dGVzX3ByaW1hcnk=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038599">The AI Code Reviewer that you’ll actually use.</a></h3>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Have you noticed that there are a LOT of code review tools on the market but none of them seem to stick? This is because other tools are too noisy, miss important context, or take forever to run. <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/3ohphdu352752wbrhn/aHR0cHM6Ly93d3cuZ3JlcHRpbGUuY29tLz91dG1fc291cmNlPWJ5dGVzJnV0bV9tZWRpdW09c3BvbnNvcnNoaXAmdXRtX2NhbXBhaWduPWJ5dGVzX3ByaW1hcnk=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038599">Greptile</a> might be the missing sweet spot.</p>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Here’s how it works.</p>
<ol>
<li>It indexes your codebase to build a searchable map of architecture, dependencies, and code relationships.</li>
<li>Then it dispatches agents in parallel to analyze changes from multiple angles and identify issues faster.</li>
<li>Over time, Greptile learns your team’s standards to deliver reviews that match your engineering practices and preferences.</li>
</ol>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Find out why popular open source projects like PyTorch, Solana, and NVIDIA are all using Greptile as their code review agent.</p>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"><a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/3ohphdu352752wbrhn/aHR0cHM6Ly93d3cuZ3JlcHRpbGUuY29tLz91dG1fc291cmNlPWJ5dGVzJnV0bV9tZWRpdW09c3BvbnNvcnNoaXAmdXRtX2NhbXBhaWduPWJ5dGVzX3ByaW1hcnk=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038599">Learn more here</a>.</p>
<hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;">
<div style="text-align:center;margin-bottom:36px">
<img width="140" src="https://bytes.dev/images/content/pop-quiz.png" alt="Pop Quiz logo" style="max-width: 100%;"><h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;">Pop Quiz</h2>
<div class="section-presenter" style="margin-bottom:50px;margin-top:15px">
<h4 style="font-size: 20px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;">Sponsored by <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/n2hohquv9x39gwi6hg/aHR0cHM6Ly9zZW50cnkuaW8vcmVzb3VyY2VzLzIwMS1zZXJpZXMvP3V0bV9zb3VyY2U9Ynl0ZXMmdXRtX21lZGl1bT1wYWlkLWNvbW11bml0eSZ1dG1fY2FtcGFpZ249YnJhbmQtZnkyN3EyLTIwMXdvcmtzaG9wJnV0bV9jb250ZW50PW5ld3NsZXR0ZXItcHJlc2VudGluZy0yMDEtd29ya3Nob3AtcmVnaXN0ZXI=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038600">Sentry</a>
</h4>
<p style="font-family: Outfit, sans-serif; font-size: 18px; line-height: 1.5; margin-top: 5px; padding-left: 24px; padding-right: 24px;"><em>Learn how to get the most out of Sentry by <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/n2hohquv9x39gwi6hg/aHR0cHM6Ly9zZW50cnkuaW8vcmVzb3VyY2VzLzIwMS1zZXJpZXMvP3V0bV9zb3VyY2U9Ynl0ZXMmdXRtX21lZGl1bT1wYWlkLWNvbW11bml0eSZ1dG1fY2FtcGFpZ249YnJhbmQtZnkyN3EyLTIwMXdvcmtzaG9wJnV0bV9jb250ZW50PW5ld3NsZXR0ZXItcHJlc2VudGluZy0yMDEtd29ya3Nob3AtcmVnaXN0ZXI=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038600">registering for their free seminar series</a>, which covers integrations, debugging, and agentic workflows.</em></p>
</div>
</div>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">What will be logged to the console after the code is finished executing?</p>
<pre class="language-js" style="-moz-hyphens: none; -moz-tab-size: 2; -ms-hyphens: none; -o-tab-size: 2; -webkit-hyphens: none; background-color: #f9f9f9; border: 1px solid #f9f9f9; border-radius: 8px; color: #c0c5ce; direction: ltr; font-family: 'Fira Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 15px; hyphens: none; line-height: 1.5; overflow: auto; padding: 24px; tab-size: 2; text-align: left; white-space: pre; word-break: normal; word-spacing: normal;"><code class="language-js" style="-moz-hyphens: none; -moz-tab-size: 2; -ms-hyphens: none; -o-tab-size: 2; -webkit-hyphens: none; color: #c0c5ce; direction: ltr; font-family: 'Fira Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 15px; hyphens: none; line-height: 1.5; tab-size: 2; text-align: left; white-space: pre; word-break: normal; word-spacing: normal;"><span class="token keyword" style="color: #f38ba3; font-size: 15px;">function</span> <span class="token function" style="color: #9d7dce; font-size: 15px;">first</span> <span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span> <span class="token punctuation" style="color: #231F20; font-size: 15px;">{</span>
<span class="token keyword" style="color: #f38ba3; font-size: 15px;">var</span> name <span class="token operator" style="color: #12b5e5; font-size: 15px;">=</span> <span class="token string" style="color: #f99157; font-size: 15px;">'Jordyn'</span>
console<span class="token punctuation" style="color: #231F20; font-size: 15px;">.</span><span class="token function" style="color: #9d7dce; font-size: 15px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span>name<span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
<span class="token punctuation" style="color: #231F20; font-size: 15px;">}</span>
<span class="token keyword" style="color: #f38ba3; font-size: 15px;">function</span> <span class="token function" style="color: #9d7dce; font-size: 15px;">second</span> <span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span> <span class="token punctuation" style="color: #231F20; font-size: 15px;">{</span>
<span class="token keyword" style="color: #f38ba3; font-size: 15px;">var</span> name <span class="token operator" style="color: #12b5e5; font-size: 15px;">=</span> <span class="token string" style="color: #f99157; font-size: 15px;">'Jake'</span>
console<span class="token punctuation" style="color: #231F20; font-size: 15px;">.</span><span class="token function" style="color: #9d7dce; font-size: 15px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span>name<span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
<span class="token punctuation" style="color: #231F20; font-size: 15px;">}</span>
console<span class="token punctuation" style="color: #231F20; font-size: 15px;">.</span><span class="token function" style="color: #9d7dce; font-size: 15px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span>name<span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
<span class="token keyword" style="color: #f38ba3; font-size: 15px;">var</span> name <span class="token operator" style="color: #12b5e5; font-size: 15px;">=</span> <span class="token string" style="color: #f99157; font-size: 15px;">'Tyler'</span>
<span class="token function" style="color: #9d7dce; font-size: 15px;">first</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
<span class="token function" style="color: #9d7dce; font-size: 15px;">second</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
console<span class="token punctuation" style="color: #231F20; font-size: 15px;">.</span><span class="token function" style="color: #9d7dce; font-size: 15px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span>name<span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
</code></pre>
<hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;">
<div style="text-align:center;margin-bottom:36px">
<img width="110" src="https://bytes.dev/images/content/cool-bits.png" alt="Cool Bits logo" style="max-width: 100%;"><h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;">Cool Bits</h2>
</div>
<ol>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">Not to be outdone by Vercel, Fred and the Cloudflare team released the beta for their own <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/48hvh7umdprd95bxh7/aHR0cHM6Ly9mbHVlZnJhbWV3b3JrLmNvbS9ibG9nL2ZsdWUtMS0wLWJldGE=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038601">agent framework called Flue</a>. Game on.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">The team at Thoughtful wrote about <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/wnh2h6uq2kw24ka7hx/aHR0cHM6Ly93d3cudGhvdWdodGZ1bGxhYi5jb20vdGhlLXN0YXRlLW9mLWFpLXBvc3QtdHJhaW5pbmctYWdlbnRzLmh0bWw=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038602">post-training AI agents</a>.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">Shopify Engineering breaks down the <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/reh8h9uml30l77u2h6/aHR0cHM6Ly9zaG9waWZ5LmVuZ2luZWVyaW5nL2NhdGFsb2ctY2x1c3RlcmluZz91dG1fc291cmNlPWNvbW1zX3BhaWQmdXRtX21lZGl1bT1uZXdzbGV0dGVyJnV0bV9jYW1wYWlnbj1ieXRlcy1lbmdfUTIyNllQV0ZCSA==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038603">LLM-powered system that matches related products across billions of listings and millions of merchants</a>. [sponsored]</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">Sydney Runkle wrote about the <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/08hwhgu269d6xwulh5/aHR0cHM6Ly93d3cubGFuZ2NoYWluLmNvbS9ibG9nL3RoZS1hcnQtb2YtbG9vcC1lbmdpbmVlcmluZw==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038604">art of loop engineering</a>. The fact that there is something called “loop engineering” probably has John von Neumann rolling in his grave.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">Ryan Dahl let his team build <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/8ghqh3uo62l63xckh9/aHR0cHM6Ly9kb2NzLmRlbm8uY29tL3J1bnRpbWUvZGVza3RvcC8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038605">Deno Desktop</a>, an alternative to Electron that runs on Deno instead of Node.js. We love a petty king.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">The Remix team just released <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/vqh3hmuo9vp94ksghl/aHR0cHM6Ly9yZW1peC5ydW4vYmxvZy9yZWFjdC1yb3V0ZXItdjg=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038606">React Router v8</a> featuring lazy-route discovery, better middleware, and an explanation of why Ryan and Michael <del>don’t love you anymore</del> are working on other things.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;"><a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/l2heh6ulmn3m4ot6h0/aHR0cHM6Ly90cmlnZ2VyLmRldi8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038607">Trigger.dev</a> lets you build resilient AI agents and workflows in TypeScript without hitting timeouts, with queues, cron, scheduling, observability, and real-time UI streaming built in. [sponsored]</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">Zod creator Colin McDonnell created a Bun-like all-in-one toolkit for Node.js and called it <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/m2h7h6u36q8698bmhq/aHR0cHM6Ly9udWJqcy5jb20v" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038608"><code style="font-size: 15px;">nub</code></a>. Yes, Colin used to work on Bun and yes, <code style="font-size: 15px;">nub</code> is Bun spelled backwards.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">Poolside, an American open-source AI company, released <code style="font-size: 15px;">pool</code>, their <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/dphehmue9o09kebmh4/aHR0cHM6Ly9naXRodWIuY29tL3Bvb2xzaWRlYWkvcG9vbA==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038609">coding agent harness</a>.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">Companies like Supabase, Clerk, and Mintlify run CI on <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/e0hph0u73l03eqs8h2/aHR0cHM6Ly9ibGFja3NtaXRoLnNoLz91dG1fc291cmNlPWJ5dGVzJnV0bV9tZWRpdW09bmV3c2xldHRlciZ1dG1fY2FtcGFpZ249Ynl0ZXNfc2Vjb25kYXJ5XzIwMjZfMDZfMTk=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038610">Blacksmith</a>: a drop-in replacement for GitHub runners that’s 2x faster and 60% cheaper. [sponsored]</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">Vicki Boykis wants you to know that <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/7qh7h2u926o28zizh6/aHR0cHM6Ly92aWNraWJveWtpcy5jb20vMjAyNi8wNi8xNS9ydW5uaW5nLWxvY2FsLW1vZGVscy1pcy1nb29kLW5vdy8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038611">local models are actually pretty good now</a>. You just need 64 GB of RAM and a fire extinguisher to run them.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5;">The release candidate for <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/owhkhwuwm6rmn5ivhr/aHR0cHM6Ly9kZXZibG9ncy5taWNyb3NvZnQuY29tL3R5cGVzY3JpcHQvYW5ub3VuY2luZy10eXBlc2NyaXB0LTctMC1yYy8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038612">TypeScript 7.0</a> is out now. It’s 10x faster than TypeScript 6.0 but also requires a fire extinguisher.</p>
</li>
</ol>
<hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;">
<div style="text-align:center;margin-bottom:36px">
<img width="140" src="https://bytes.dev/images/content/pop-quiz.png" alt="Pop Quiz logo" style="max-width: 100%;"><h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;">Pop Quiz: Answer</h2>
<div class="section-presenter" style="margin-bottom:50px;margin-top:15px"><h4 style="font-size: 20px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;">Sponsored by <a href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/n2hohquv9x39gwi6hg/aHR0cHM6Ly9zZW50cnkuaW8vcmVzb3VyY2VzLzIwMS1zZXJpZXMvP3V0bV9zb3VyY2U9Ynl0ZXMmdXRtX21lZGl1bT1wYWlkLWNvbW11bml0eSZ1dG1fY2FtcGFpZ249YnJhbmQtZnkyN3EyLTIwMXdvcmtzaG9wJnV0bV9jb250ZW50PW5ld3NsZXR0ZXItcHJlc2VudGluZy0yMDEtd29ya3Nob3AtcmVnaXN0ZXI=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1864038600">Sentry</a>
</h4></div>
</div>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">What will be logged to the console after the code is finished executing?</p>
<pre class="language-js" style="-moz-hyphens: none; -moz-tab-size: 2; -ms-hyphens: none; -o-tab-size: 2; -webkit-hyphens: none; background-color: #f9f9f9; border: 1px solid #f9f9f9; border-radius: 8px; color: #c0c5ce; direction: ltr; font-family: 'Fira Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 15px; hyphens: none; line-height: 1.5; overflow: auto; padding: 24px; tab-size: 2; text-align: left; white-space: pre; word-break: normal; word-spacing: normal;"><code class="language-js" style="-moz-hyphens: none; -moz-tab-size: 2; -ms-hyphens: none; -o-tab-size: 2; -webkit-hyphens: none; color: #c0c5ce; direction: ltr; font-family: 'Fira Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 15px; hyphens: none; line-height: 1.5; tab-size: 2; text-align: left; white-space: pre; word-break: normal; word-spacing: normal;"><span class="token keyword" style="color: #f38ba3; font-size: 15px;">function</span> <span class="token function" style="color: #9d7dce; font-size: 15px;">first</span> <span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span> <span class="token punctuation" style="color: #231F20; font-size: 15px;">{</span>
<span class="token keyword" style="color: #f38ba3; font-size: 15px;">var</span> name <span class="token operator" style="color: #12b5e5; font-size: 15px;">=</span> <span class="token string" style="color: #f99157; font-size: 15px;">'Jordyn'</span>
console<span class="token punctuation" style="color: #231F20; font-size: 15px;">.</span><span class="token function" style="color: #9d7dce; font-size: 15px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span>name<span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
<span class="token punctuation" style="color: #231F20; font-size: 15px;">}</span>
<span class="token keyword" style="color: #f38ba3; font-size: 15px;">function</span> <span class="token function" style="color: #9d7dce; font-size: 15px;">second</span> <span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span> <span class="token punctuation" style="color: #231F20; font-size: 15px;">{</span>
<span class="token keyword" style="color: #f38ba3; font-size: 15px;">var</span> name <span class="token operator" style="color: #12b5e5; font-size: 15px;">=</span> <span class="token string" style="color: #f99157; font-size: 15px;">'Jake'</span>
console<span class="token punctuation" style="color: #231F20; font-size: 15px;">.</span><span class="token function" style="color: #9d7dce; font-size: 15px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span>name<span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
<span class="token punctuation" style="color: #231F20; font-size: 15px;">}</span>
console<span class="token punctuation" style="color: #231F20; font-size: 15px;">.</span><span class="token function" style="color: #9d7dce; font-size: 15px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span>name<span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
<span class="token keyword" style="color: #f38ba3; font-size: 15px;">var</span> name <span class="token operator" style="color: #12b5e5; font-size: 15px;">=</span> <span class="token string" style="color: #f99157; font-size: 15px;">'Tyler'</span>
<span class="token function" style="color: #9d7dce; font-size: 15px;">first</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
<span class="token function" style="color: #9d7dce; font-size: 15px;">second</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
console<span class="token punctuation" style="color: #231F20; font-size: 15px;">.</span><span class="token function" style="color: #9d7dce; font-size: 15px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 15px;">(</span>name<span class="token punctuation" style="color: #231F20; font-size: 15px;">)</span>
</code></pre>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">We get <code style="font-size: 15px;">undefined</code>, <code style="font-size: 15px;">Jordyn</code>, <code style="font-size: 15px;">Jake</code>, then <code style="font-size: 15px;">Tyler</code>.</p>
<p style="font-family: Outfit, sans-serif; font-size: 19px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">What this shows us is that you can think of each new Execution Context as having its own unique variable environment. Even though there are other Execution Contexts that contain the variable name, the JavaScript engine will first look to the current Execution Context for that variable.</p>
<div style="text-align:center;padding-bottom:80px;padding-top:80px">
<div class="bg-alt" style="background-color: #f5f5f5; border-radius: 16px; margin-bottom: 40px; padding: 24px;"><div style="margin-top:-40px">
<img src="https://bytes.dev/images/bytes-icon.png" alt="Bytes" width="55px" style="max-width: 100%; width: 55px;"><h5 style="font-size:18px;font-weight:400;margin-bottom:24px">Want us to say nice things <br> about your company?</h5>
<div style="margin-bottom:16px"><a style="background-color: #FCBA28; border: 1px solid #231F20; border-radius: 100px; color: #231F20; font-size: 14px; font-weight: 600; padding: 8px 14px; text-decoration: none;" href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/z2hgh7ue2k3275fph0/aHR0cHM6Ly9ieXRlcy5kZXYvYWR2ZXJ0aXNl" url-id="1864038613">Sponsor Bytes</a></div>
<div style="margin-bottom:20px"><a style="color: #FCBA28; font-size: 14px; font-weight: 600; text-decoration: underline;" href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/p8hehqu4w2zwdmhqh3/aHR0cHM6Ly9ieXRlcy5kZXYvc2hhcmU=" url-id="1864038614">or share it</a></div>
<p style="font-family: Outfit, sans-serif; font-size: 14px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Built with ❤️ by<!-- --> <a style="color: #ed203d; font-weight: 600; text-decoration: underline;" href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/x0hph3uevpwvz2c5hl/aHR0cHM6Ly9maXJlc2hpcC5kZXY=" url-id="1864038615">Fireship</a></p>
</div></div>
<p style="font-family: Outfit, sans-serif; font-size: 14px; line-height: 1.5; opacity: 0.5; padding-left: 24px; padding-right: 24px;">50 W Broadway Ste 333 PMB 51647 Salt Lake City, Utah 84101</p>
<div style="font-family:Papyrus, cursive"><a class="unsubscribe-link" href="https://c5e21242.click.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l/6qhehoul8578wetohk/aHR0cHM6Ly9ieXRlcy5kZXYvdW5zdWJzY3JpYmU=" style="color: #9B9890;" url-id="1864038616">Unsubscribe from Bytes</a></div>
</div>
</div></td>
<td style="border-collapse: collapse !important; word-break: normal;"></td>
</tr></tbody></table>
<span style="display: none"><a href="https://c5e21242.unsubscribe.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l">Unsubscribe</a></span>
<!-- -->
<img src="https://c5e21242.open.convertkit-mail.com/o8uqeqor33bqh6me070hvhqe79896coh4g6l" alt="">
</body>
</html>