<!DOCTYPE html>
<html>
<head>
<title>Bytes: Vercel expands its empire</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<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: 16px; 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: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"><strong style="font-weight: 600;">Today’s issue:</strong> Triangle-shaped waffle parties, escaping the Reno airport, and the Ruby web framework that smells like a winner.</p>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Welcome to <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/48hvh7umnmkq73ux/aHR0cHM6Ly9ieXRlcy5kZXYvYXJjaGl2ZXMvNDA2" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894606">#406</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/planned-this.jpg" alt="3D animated lady with 'I planned this' written on her hand" width="600" style="border-radius: 5px; max-width: 100%;"><p style="font-family: Outfit, sans-serif; font-size: 15px; font-style: italic; line-height: 1; margin: 0; padding-bottom: 4px; padding-left: 24px; padding-right: 24px; padding-top: 10px; text-align: center;">Guillermo after buying out every single Next.js rival<!-- --> </p>
</div>
<h3 style="font-size: 24px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;">Vercel expands its empire</h3>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">If there’s one thing I learned from my University of Phoenix degree in Freudian Marketing, it’s that branding your product as <em>the</em> solution to a problem is a great way to subconsciously trick people into forgetting that your competitors exist.</p>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">And nobody understands that better than Vercel – ”<em>the</em> AI Cloud” that’s behind Next.js (”<em>the</em> React Framework for the web”), Turborepo (”<em>the</em> build system for JS and TS codebases”), and AI SDK (”<em>the</em> AI Toolkit for TypeScript”).</p>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Yesterday, they announced two new <del>Senior Superlatives</del> technologies to their portfolio – Nuxt (”<em>the</em> progressive web framework”) and <code style="font-size: 14px;">xmcp</code> (”<em>the</em> framework for building & shipping MCP applications”). Let’s take a quick look at each one.</p>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">You probably know Nuxt as the Vue metaframework that’s only one vowel away from Next. Similar to Vercel’s Svelte deal from 2022, the big triangle is <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/wnh2h6uq3q8vlzb7/aHR0cHM6Ly92ZXJjZWwuY29tL2Jsb2cvbnV4dGxhYnMtam9pbnMtdmVyY2Vs" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894607">hiring the Nuxt core team members</a> and funneling more sponsor dollars into the project – while promising to allow Nuxt to retain its independence and open governance model.</p>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">As part of that deal, Vercel also gets <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/reh8h9umemnvp9f2/aHR0cHM6Ly9uaXRyby5idWlsZC8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894608">Nitro</a>, the next-gen server toolkit that powers Nuxt, SolidStart, TanStack Start, and AnalogJS. As Ryan Carniato <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/08hwhgu2k2qw4ocl/aHR0cHM6Ly94LmNvbS9SeWFuQ2FybmlhdG8vc3RhdHVzLzE5NDI2NTM3ODI3MTU5NDkxNTE=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894609">pointed out</a>, this means that basically every metaframework besides Astro, Remix, QwikCity, and Fresh is now being built by developers who work at Vercel <span role="img" aria-label="woozy face">🥴</span>. More on that later.</p>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Their other big announcement from Monday is the new <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/8ghqh3uoxokp82ik/aHR0cHM6Ly94bWNwLmRldi8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894610"><code style="font-size: 14px;">xmcp</code> framework</a> that Vercel built in-house for improving the DX for building on MCP. Just run <code style="font-size: 14px;">npx create-xmcp-app</code>, and it’ll give you:</p>
<ul>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><strong style="font-weight: 600;">File-system routing</strong> that auto-registers tools from a <code style="font-size: 14px;">tools/</code> directory</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><strong style="font-weight: 600;">A middleware toolkit</strong> for auth and custom middleware, plus configurable MCP server settings</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><strong style="font-weight: 600;">Hot reloading</strong> for instant development feedback</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><strong style="font-weight: 600;">Easy deployment</strong> to Vercel (of course), plus support for other platforms</p>
</li>
</ul>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Vercel clearly expects these investments in open-source frameworks and AI tools to eventually generate a meaningful ROI for its shareholders. But thankfully, they have a pretty solid track record of stewarding projects like Svelte and shadcn/ui in a way that benefits the whole ecosystem as well – even if some developers aren’t exactly stoked to see so many tools all flying the black triangle flag.</p>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"><strong style="font-weight: 600;">Bottom Line:</strong> Is it great to see open-source authors getting paid? Absolutely. Is it possible that this rapid consolidation could eventually threaten the overall health of the JavaScript ecosystem? I hope not.</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://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/vqh3hmuodo8364fg/aHR0cHM6Ly9mYWNlYm9vay5jb20vc2hhcmVyL3NoYXJlci5waHA_dT1odHRwcyUzQSUyRiUyRmJ5dGVzLmRldiUyRmFyY2hpdmVzJTJGNDA2" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1762894611"><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://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/l2heh6ulzlwvpvt6/aHR0cHM6Ly93d3cubGlua2VkaW4uY29tL3NoYXJpbmcvc2hhcmUtb2Zmc2l0ZS8_dXJsPWh0dHBzJTNBJTJGJTJGYnl0ZXMuZGV2JTJGYXJjaGl2ZXMlMkY0MDY=" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1762894612"><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://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/m2h7h6u373w0x7im/aHR0cHM6Ly90d2l0dGVyLmNvbS9pbnRlbnQvdHdlZXQvP3RleHQ9QnJlYWtpbmclMjBkb3duJTIwVmVyY2VsJTI3cyUyMGFjcXVpc2l0aW9uJTIwb2YlMjAlNDBudXh0bGFicyZ1cmw9aHR0cHMlM0ElMkYlMkZieXRlcy5kZXYlMkZhcmNoaXZlcyUyRjQwNg==" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1762894613"><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://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/dphehmuemerwx7sm/bWFpbHRvOj9ib2R5PVRob3VnaHQlMjB5b3UlMjdkJTIwbG92ZSUyMHRoaXMlMjB3ZWVrJTI3cyUyMEJ5dGVzJTBBLS0tJTBBQnJlYWtpbmclMjBkb3duJTIwVmVyY2VsJTI3cyUyMGFjcXVpc2l0aW9uJTIwb2YlMjAlNDBudXh0bGFicyUwQWh0dHBzJTNBJTJGJTJGYnl0ZXMuZGV2JTJGYXJjaGl2ZXMlMkY0MDYmc3ViamVjdD1Zb3UlMjBsaWtlJTIwY29ybmJyZWFkJTNG" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1762894614"><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/basedash-logo.png" alt="Basedash 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/veggie-stare.jpg" alt="3 Veggie Tales characters staring into the camera" width="600" style="border-radius: 5px; max-width: 100%;"><p style="font-family: Outfit, sans-serif; font-size: 15px; font-style: italic; line-height: 1; margin: 0; padding-bottom: 4px; padding-left: 24px; padding-right: 24px; padding-top: 10px; text-align: center;">The marketing team asking you to "whip up a couple dashboards"<!-- --> </p>
</div>
<h3 style="font-size: 24px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;"><a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/e0hph0u7275wzka8/aHR0cHM6Ly93d3cuYmFzZWRhc2guY29tLz9yZWY9Ynl0ZXM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894615">Create beautiful charts and dashboards by prompting AI</a></h3>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">Instead of writing SQL queries <em>(gross)</em> or clicking through drag-and-drop builders <em>(more gross)</em>, you just tell <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/e0hph0u7275wzka8/aHR0cHM6Ly93d3cuYmFzZWRhc2guY29tLz9yZWY9Ynl0ZXM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894615">Basedash</a> what you want – and their AI builds it for you.</p>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">It’s simple:</p>
<ul>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><strong style="font-weight: 600;">Describe your charts in plain English</strong> – Ask it to “show me active users by device type” or “compare sales by region” (<a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/7qh7h2u9m93peoiz/aHR0cHM6Ly93d3cuYmFzZWRhc2guY29tL2RlbW9zL2dldHRpbmctc3RhcnRlZC13aXRoLWJhc2VkYXNoP3JlZj1ieXRlcw==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894616">see 7-minute YouTube demo</a>).</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><strong style="font-weight: 600;">Chat with your data</strong> – Basedash comes with its own Postgres data warehouse that connects to <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/owhkhwuw7w5lewbv/aHR0cHM6Ly9kb2NzLmJhc2VkYXNoLmNvbS9kYXRhLXNvdXJjZXMvaW50cm9kdWN0aW9uLz9yZWY9Ynl0ZXM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894617">600+ data sources</a>, or you can connect your own DB. Ask the AI follow-up questions to drill deeper into your insights.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><strong style="font-weight: 600;">Get instant visualizations</strong> – Basedash automatically chooses the best chart type, table, or dashboards and formats it beautifully.</p>
</li>
</ul>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"><a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/e0hph0u7275wzka8/aHR0cHM6Ly93d3cuYmFzZWRhc2guY29tLz9yZWY9Ynl0ZXM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894615">Try the 14-day free trial</a> (no credit card required) – and see why it was Product Hunt’s #3 Product of the Week and is used by hundreds of AI-first companies.</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="110" src="https://bytes.dev/images/content/spot-the-bug.png" alt="Spot the Bug logo" style="max-width: 100%;"><h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;">Spot the Bug</h2>
<div class="section-presenter" style="margin-bottom:50px;margin-top:15px">
<h4 style="font-size: 19px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;">Sponsored by <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/z2hgh7ue8e0rzpup/aHR0cHM6Ly93d3cuZGF0YWRvZ2hxLmNvbS9yZXNvdXJjZXMvZnJvbnRlbmQtbW9uaXRvcmluZy1iZXN0LXByYWN0aWNlcy8_dXRtX2NhbXBhaWduPWRnLWluZnJhLXd3LWZyb250LWVuZC1tb25pdG9yaW5nLWd1aWRlLWJ5dGVzJnV0bV9tZWRpdW09bmV3c2xldHRlciZ1dG1fc291cmNlPWJ5dGVzZGV2" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894618">Datadog</a>
</h4>
<p style="font-family: Outfit, sans-serif; font-size: 16px; line-height: 1.5; margin-top: 5px; padding-left: 24px; padding-right: 24px;"><em>They created a <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/z2hgh7ue8e0rzpup/aHR0cHM6Ly93d3cuZGF0YWRvZ2hxLmNvbS9yZXNvdXJjZXMvZnJvbnRlbmQtbW9uaXRvcmluZy1iZXN0LXByYWN0aWNlcy8_dXRtX2NhbXBhaWduPWRnLWluZnJhLXd3LWZyb250LWVuZC1tb25pdG9yaW5nLWd1aWRlLWJ5dGVzJnV0bV9tZWRpdW09bmV3c2xldHRlciZ1dG1fc291cmNlPWJ5dGVzZGV2" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894618">Frontend Monitoring Best Practices Guide</a> that’ll teach you how to monitor route changes, user interactions, and errors in your single-page apps.</em></p>
</div>
</div>
<pre class="language-js" style="background-color: #f9f9f9; border: 1px solid #f9f9f9; border-radius: 8px; color: #231F20; overflow: auto; padding: 24px;"><code class="language-js" style="font-size: 14px;"><span class="token keyword" style="color: #f38ba3; font-size: 14px;">const</span> blob <span class="token operator" style="color: #12b5e5; font-size: 14px;">=</span> <span class="token keyword" style="color: #f38ba3; font-size: 14px;">new</span> <span class="token class-name" style="color: #12b5e5; font-size: 14px;">Blob</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">[</span><span class="token template-string" style="font-size: 14px;"><span class="token template-punctuation string" style="color: #f99157; font-size: 14px;">`</span><span class="token string" style="color: #f99157; font-size: 14px;">
self.onmessage = function() {
const processor = {
cache: new Map(),
process(data) {
return data.map(x => x * 2);
}
};
processor.cache.set('results', processor.process([1,2,3]));
processor.cache.set('processFn', processor.process);
self.postMessage({
type: 'DONE',
state: processor.cache
});
};
</span><span class="token template-punctuation string" style="color: #f99157; font-size: 14px;">`</span></span><span class="token punctuation" style="color: #231F20; font-size: 14px;">]</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">,</span> <span class="token punctuation" style="color: #231F20; font-size: 14px;">{</span> <span class="token literal-property property" style="color: #12b5e5; font-size: 14px;">type</span><span class="token operator" style="color: #12b5e5; font-size: 14px;">:</span> <span class="token string" style="color: #f99157; font-size: 14px;">'application/javascript'</span> <span class="token punctuation" style="color: #231F20; font-size: 14px;">}</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</span>
<span class="token keyword" style="color: #f38ba3; font-size: 14px;">const</span> worker <span class="token operator" style="color: #12b5e5; font-size: 14px;">=</span> <span class="token keyword" style="color: #f38ba3; font-size: 14px;">new</span> <span class="token class-name" style="color: #12b5e5; font-size: 14px;">Worker</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token constant" style="color: #12b5e5; font-size: 14px;">URL</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function" style="color: #9d7dce; font-size: 14px;">createObjectURL</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span>blob<span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</span>
worker<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function" style="color: #9d7dce; font-size: 14px;">postMessage</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token string" style="color: #f99157; font-size: 14px;">'start'</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</span>
worker<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function-variable function" style="color: #9d7dce; font-size: 14px;">onerror</span> <span class="token operator" style="color: #12b5e5; font-size: 14px;">=</span> <span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token parameter" style="color: #f38ba3; font-size: 14px;">e</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span> <span class="token operator" style="color: #12b5e5; font-size: 14px;">=></span> console<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function" style="color: #9d7dce; font-size: 14px;">error</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token string" style="color: #f99157; font-size: 14px;">'Worker error:'</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">,</span> e<span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</span>
worker<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function-variable function" style="color: #9d7dce; font-size: 14px;">onmessage</span> <span class="token operator" style="color: #12b5e5; font-size: 14px;">=</span> <span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token parameter" style="color: #f38ba3; font-size: 14px;">e</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span> <span class="token operator" style="color: #12b5e5; font-size: 14px;">=></span> console<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function" style="color: #9d7dce; font-size: 14px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span>e<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span>data<span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</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: 17px; line-height: 1.5;">Ashwin wrote about <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/p8hehqu4l485exsq/aHR0cHM6Ly9rYXNodzFuLmNvbS9ibG9nL2xsbS1jbGkv" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894619">using AI without leaving the terminal</a>, which would’ve been helpful when I was stuck in the Reno airport for 7 hours after my bachelor party.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;">The <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/x0hph3uelexdmxf5/aHR0cHM6Ly94LmNvbS90eXBlc2NyaXB0L3N0YXR1cy8xOTQyNjQxNTg0MDkwMzAwODg1" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894620">TypeScript 5.9 beta</a> introduces an updated <code style="font-size: 14px;">tsc --init</code>, support for the new <code style="font-size: 14px;">import defer</code> syntax, and more.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;">Sasha Blumenfeld wrote about <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/6qhehouldl064xto/aHR0cHM6Ly9ibG9nLnNlbnRyeS5pby9zZW50cnlzLXVwZGF0ZWQtYWdlbnQtbW9uaXRvcmluZy8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894621">a major upgrade to Sentry Agent Monitoring</a> – which now brings tracing, model performance, and deep context into one unified experience for seamless AI monitoring. [sponsored]</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;">Loren Stewart wrote about <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/kkhmh2un3n42prcl/aHR0cHM6Ly93d3cubG9yZW5zdGV3LmFydC9ibG9nL3JlYWN0aXZlLXN0YXRlLW1hbmFnZXItd2l0aC1wcm94aWVz" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894622">building a lightweight reactive state manager with JavaScript proxies</a>. And the faster you build it, the faster you can sell it to Vercel and earn your first triangle-shaped waffle party.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/58hvh8ugzglowxu6/aHR0cHM6Ly9yc3BhY2sucnMvYmxvZy9hbm5vdW5jaW5nLTEtNA==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894623">Rspack 1.4</a> comes with new Wasm target support, smaller bundles, and incremental build by default.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;">The Bun team bought <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/25h2h9u3e3n0xwt3/aHR0cHM6Ly9idW4uY29tLw==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894624">bun.com</a>. Everything else about the site is the exact same, but as a fellow domain degenerate, I believe that a mid six-figure domain purchase by an open-source project is newsworthy enough.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;">Can your coding agent run long commands and plan its next move? Warp’s can – and it just beat Claude Code by 20% on the <code style="font-size: 14px;">Terminal-Bench</code> benchmark. Warp’s eng team wrote about <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/qvh8h8ud0dq235ul/aHR0cHM6Ly93d3cud2FycC5kZXYvYmxvZy90ZXJtaW5hbC1iZW5jaD91dG1fY2FtcGFpZ249YWRlX2xhdW5jaF9zZWNvbmRhcnlfanVseSZ1dG1fY29udGVudD1ieXRlcyZ1dG1fbWVkaXVtPW5ld3NsZXR0ZXImdXRtX3NvdXJjZT1wdWJsaWNhdGlvbnM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894625">how they pulled it off</a>. [sponsored]</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/g3hnhwumkmxo28fr/aHR0cHM6Ly93d3cuZWxlY3Ryb25qcy5vcmcvYmxvZy9lbGVjdHJvbi0zNy0w" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894626">Electron 37</a> came out last month – and much like the <em>Jurassic Park</em> franchise, no matter how much you slander it, it will always succeed and never die.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;">Una Kravets wrote about <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/9qhzhdudldn38of9/aHR0cHM6Ly9kZXZlbG9wZXIuY2hyb21lLmNvbS9ibG9nL2lmLWFydGljbGU=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894627">CSS conditionals with the new <code style="font-size: 14px;">if()</code> function</a>.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;">QA Wolf is hosting a free workshop on <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/3ohphdu3n3v98pbr/aHR0cHM6Ly93d3cucWF3b2xmLmNvbS9ldmVudHMvcGF0ZW50LXN0cmF0ZWd5LWZvci1zdGFydC11cHM_dXRtX2NhbXBhaWduPUFDUV9BbGxfRXZlbnQlMjBSZWdpc3RyYXRpb25zX19OZXdzbGV0dGVyQXVkaWVuY2VfLV9OZXdzbGV0dGVyX1BhdGVudFN0cmF0ZWd5Rm9yU3RhcnR1cHNfMjAyNTA3MDgtTm9uZV9FeHBlcmltZW50LUZBTFNFJnV0bV9jb250ZW50PVBhdGVudFN0cmF0ZWd5Rm9yU3RhcnR1cHNfTm9uZV9Ob25lX0hlYWRsaW5lJTNBTm9uZV9fX19OZXdzbGV0dGVyLVNlY29uZGFyeVBsYWNlbWVudF8yMDI1MDcwOF92MV8mdXRtX21lZGl1bT1uZXdzbGV0dGVyJnV0bV9zb3VyY2U9Ynl0ZXMmdXRtX3Rlcm09Ym9keS1QYXRlbnRTdHJhdGVneUZvclN0YXJ0dXBz" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894628">Patent strategy for startups</a> with Saad Hassan, the go-to IP attorney for Sequoia and a16z founders. He’ll demystify patents vs trademarks vs copyrights and share common IP landmines to avoid. [sponsored]</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;">The Deno team took a break from suing the fourth-largest software company in the world to ship <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/n2hohquvkve54lf6/aHR0cHM6Ly9kZW5vLmNvbS9ibG9nL3YyLjQ=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894629">Deno 2.4</a> – which brings back the <code style="font-size: 14px;">deno bundle</code> subcommand for creating single-file JavaScript bundles, introduces bytes and text imports, and lots more.</p>
</li>
<li>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"><a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/48hvh7umnmkq33ax/aHR0cHM6Ly9uYWlsZHJpdmluNS5jb20vYmxvZy8yMDI1LzA3LzA4L2JydXQtYS1uZXctd2ViLWZyYW1ld29yay1mb3ItcnVieS5odG1s" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894630">Brut</a> is a new web framework for Ruby that’s presumably inspired by the green cologne you bought for $7 at Walgreens your freshman year of high school. Smells like success. And desperation. A potent combo indeed.</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="110" src="https://bytes.dev/images/content/spot-the-bug.png" alt="Spot the Bug logo" style="max-width: 100%;"><h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;">Spot the Bug: Solution</h2>
<div class="section-presenter" style="margin-bottom:50px;margin-top:15px"><h4 style="font-size: 19px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;">Sponsored by <a href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/z2hgh7ue8e0rzpup/aHR0cHM6Ly93d3cuZGF0YWRvZ2hxLmNvbS9yZXNvdXJjZXMvZnJvbnRlbmQtbW9uaXRvcmluZy1iZXN0LXByYWN0aWNlcy8_dXRtX2NhbXBhaWduPWRnLWluZnJhLXd3LWZyb250LWVuZC1tb25pdG9yaW5nLWd1aWRlLWJ5dGVzJnV0bV9tZWRpdW09bmV3c2xldHRlciZ1dG1fc291cmNlPWJ5dGVzZGV2" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1762894618">Datadog</a>
</h4></div>
</div>
<p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;">The <code style="font-size: 14px;">processor.cache</code> is a <code style="font-size: 14px;">Map</code> object, which is not serializable. To fix this, you can convert the <code style="font-size: 14px;">Map</code> to a serializable object before posting it to the main thread.</p>
<pre class="language-js" style="background-color: #f9f9f9; border: 1px solid #f9f9f9; border-radius: 8px; color: #231F20; overflow: auto; padding: 24px;"><code class="language-js" style="font-size: 14px;"><span class="token keyword" style="color: #f38ba3; font-size: 14px;">const</span> blob <span class="token operator" style="color: #12b5e5; font-size: 14px;">=</span> <span class="token keyword" style="color: #f38ba3; font-size: 14px;">new</span> <span class="token class-name" style="color: #12b5e5; font-size: 14px;">Blob</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">[</span><span class="token template-string" style="font-size: 14px;"><span class="token template-punctuation string" style="color: #f99157; font-size: 14px;">`</span><span class="token string" style="color: #f99157; font-size: 14px;">
self.onmessage = function() {
const processor = {
cache: new Map(),
process(data) {
return data.map(x => x * 2);
}
};
processor.cache.set('results', processor.process([1,2,3]));
// Convert Map to serializable object, skip functions
const serializableState = {
type: 'DONE',
state: Object.fromEntries(processor.cache)
};
self.postMessage(serializableState);
};
</span><span class="token template-punctuation string" style="color: #f99157; font-size: 14px;">`</span></span><span class="token punctuation" style="color: #231F20; font-size: 14px;">]</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">,</span> <span class="token punctuation" style="color: #231F20; font-size: 14px;">{</span> <span class="token literal-property property" style="color: #12b5e5; font-size: 14px;">type</span><span class="token operator" style="color: #12b5e5; font-size: 14px;">:</span> <span class="token string" style="color: #f99157; font-size: 14px;">'application/javascript'</span> <span class="token punctuation" style="color: #231F20; font-size: 14px;">}</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</span>
<span class="token keyword" style="color: #f38ba3; font-size: 14px;">const</span> worker <span class="token operator" style="color: #12b5e5; font-size: 14px;">=</span> <span class="token keyword" style="color: #f38ba3; font-size: 14px;">new</span> <span class="token class-name" style="color: #12b5e5; font-size: 14px;">Worker</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token constant" style="color: #12b5e5; font-size: 14px;">URL</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function" style="color: #9d7dce; font-size: 14px;">createObjectURL</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span>blob<span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</span>
worker<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function" style="color: #9d7dce; font-size: 14px;">postMessage</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token string" style="color: #f99157; font-size: 14px;">'start'</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</span>
worker<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function-variable function" style="color: #9d7dce; font-size: 14px;">onmessage</span> <span class="token operator" style="color: #12b5e5; font-size: 14px;">=</span> <span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span><span class="token parameter" style="color: #f38ba3; font-size: 14px;">e</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span> <span class="token operator" style="color: #12b5e5; font-size: 14px;">=></span> console<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span><span class="token function" style="color: #9d7dce; font-size: 14px;">log</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">(</span>e<span class="token punctuation" style="color: #231F20; font-size: 14px;">.</span>data<span class="token punctuation" style="color: #231F20; font-size: 14px;">)</span><span class="token punctuation" style="color: #231F20; font-size: 14px;">;</span>
</code></pre>
<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://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/wnh2h6uq3q8vdzc7/aHR0cHM6Ly9ieXRlcy5kZXYvYWR2ZXJ0aXNl" url-id="1762894631">Sponsor Bytes</a></div>
<div style="margin-bottom:20px"><a style="color: #FCBA28; font-size: 14px; font-weight: 600; text-decoration: underline;" href="https://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/reh8h9umemnv89h2/aHR0cHM6Ly9ieXRlcy5kZXYvc2hhcmU=" url-id="1762894632">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://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/08hwhgu2k2qw8oil/aHR0cHM6Ly91aS5kZXY=" url-id="1762894633">ui.dev</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://click.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw/8ghqh3uoxokp42ik/aHR0cHM6Ly9ieXRlcy5kZXYvdW5zdWJzY3JpYmU=" style="color: #9B9890;" url-id="1762894634">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://unsubscribe.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw">Unsubscribe</a></span>
<!-- -->
<img src="https://open.convertkit-mail4.com/lmu4943dvvtmhnkg468a6h89xm400cgh2xvw" alt="">
</body>
</html>