Email: Bytes: Pimp my Bundler: Vite edition

Subject:
Bytes: Pimp my Bundler: Vite edition
Received:
12/5/2025, 11:12:46 PM
From:
"Tyler from ui.dev" <tyler@ui.dev>
To:
desert.legend.57@rss.andrealin.it
&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Bytes: Pimp my Bundler: Vite edition&lt;/title&gt;
&lt;meta charset="utf-8"&gt;
&lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
&lt;meta name="color-scheme" content="light dark"&gt;
&lt;meta name="supported-color-schemes" content="light dark"&gt;
&lt;link href="https://fonts.googleapis.com/css2?family=Fira+Mono&amp;family=Outfit:wght@400;500;700;900&amp;family=Paytone+One" rel="stylesheet"&gt;
&lt;style&gt;@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;
  }
}&lt;/style&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;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%;"&gt;&lt;tbody&gt;&lt;tr&gt;
&lt;td style="border-collapse: collapse !important; word-break: normal;"&gt;&lt;/td&gt;
&lt;td width="600px" style="border-collapse: collapse !important; width: 600px; word-break: normal;"&gt;&lt;div style="max-width:600px;padding-top:80px"&gt;
&lt;div style="text-align:center"&gt;&lt;img width="600" style="max-width: 100%; padding-bottom: 40px;" src="https://bytes.dev/images/bytes-banner-rounded.png" alt="Bytes"&gt;&lt;/div&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;&lt;strong style="font-weight: 600;"&gt;Today’s issue:&lt;/strong&gt; The Zig roller coaster, the JavaScript hivemind, and &lt;em&gt;Shai Halud 3&lt;/em&gt; coming to an npm package near you.&lt;/p&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;Welcome to &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/owhkhwuwoxe5rguv/aHR0cHM6Ly9ieXRlcy5kZXYvYXJjaGl2ZXMvNDQ2" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139978"&gt;#446&lt;/a&gt;.&lt;/p&gt;
&lt;hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;"&gt;
&lt;div style="text-align:center;margin-bottom:36px"&gt;
&lt;img width="80" src="https://bytes.dev/images/content/eyes.png" alt="Eyeballs logo" style="max-width: 100%;"&gt;&lt;h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;"&gt;The Main Thing&lt;/h2&gt;
&lt;/div&gt;
&lt;div class="bg-alt" style="background-color: #f5f5f5; border-radius: 16px; margin-bottom: 40px; max-width: 100%; padding: 24px; padding-bottom: 12px;"&gt;
&lt;img src="https://bytes.dev/images/content/pikachu-mummy.jpg" alt="Pikachu with the Mummy's face on it" width="600" style="border-radius: 5px; max-width: 100%;"&gt;&lt;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;"&gt;The Vite team when they start charging $.01 per download&lt;!-- --&gt; &lt;/p&gt;
&lt;/div&gt;
&lt;h3 style="font-size: 24px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;"&gt;Pimp my Bundler: Vite edition&lt;/h3&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;The Vite team released &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/z2hgh7uew5z03wup/aHR0cHM6Ly92aXRlLmRldi9ibG9nL2Fubm91bmNpbmctdml0ZTgtYmV0YQ==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139979"&gt;the first beta of Vite 8&lt;/a&gt; on Wednesday, and it’s a pretty huge deal for one reason and one reason only: &lt;strong style="font-weight: 600;"&gt;Rolldown.&lt;/strong&gt;&lt;/p&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;This blazing fast, Rust-based bundler has taken the Vite team years to build and was an opt-in-only feature back in Vite 7. But now that it’s finally ready for primetime, we should probably ask – &lt;strong style="font-weight: 600;"&gt;Why did they build it in the first place?&lt;/strong&gt;&lt;/p&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;Well until now, Vite has uniquely relied on two bundlers: &lt;strong style="font-weight: 600;"&gt;esbuild&lt;/strong&gt; provided fast compilation during development, and &lt;strong style="font-weight: 600;"&gt;Rollup&lt;/strong&gt; handled the bundling, chunking, and optimizing of production builds.&lt;/p&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;This approach allowed Vite to outsource all the parsing and bundling work, so they could focus on the DX and orchestration that make Vite special. But it turns out that maintaining two separate bundling pipelines isn’t &lt;em&gt;quite&lt;/em&gt; as fun as it sounds – and the team was forced to manage separate transformation pipelines, different plugin systems, and a growing amount of glue code to keep all the bundling behavior aligned.&lt;/p&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;So the Vite team finally decided to head over to &lt;del&gt;West Coast Customs&lt;/del&gt; &lt;em&gt;Evan You’s workshop&lt;/em&gt; to build their own custom dream bundler from scratch. It doesn’t come with TVs in the headrests, but it does have:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;&lt;strong style="font-weight: 600;"&gt;Blazingest speed&lt;/strong&gt; – Rolldown is written in Rust (btw) and operates at native speed, making it just as fast as esbuild and 10–30× faster than Rollup.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;&lt;strong style="font-weight: 600;"&gt;Smooth compatibility&lt;/strong&gt; – It supports the same plugin API as Rollup and Vite, and most Vite plugins work out of the box with Vite 8.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;&lt;strong style="font-weight: 600;"&gt;More features&lt;/strong&gt; – It unlocks more advanced features for Vite like full bundle mode, more flexible chunk split control, module federation, and more.&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;&lt;strong style="font-weight: 600;"&gt;Bottom Line:&lt;/strong&gt; Arguably the biggest impact of this new bundler is that it gives Evan You &amp; friends full control of an end-to-end JS toolchain that includes &lt;strong style="font-weight: 600;"&gt;Vite&lt;/strong&gt; as the build tool, &lt;strong style="font-weight: 600;"&gt;Rolldown&lt;/strong&gt; as the bundler, and &lt;strong style="font-weight: 600;"&gt;Oxc&lt;/strong&gt; as the compiler. This is a smart strategy for VoidZero (the VC-backed company they founded), but it should also allow them to provide a better, more cohesive experience across the entire stack for developers.&lt;/p&gt;
&lt;table width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse; margin-top: 40px; text-align: center;"&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td style="border-collapse: collapse !important; padding-top: 12px; word-break: normal;"&gt;
&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/p8hehqu4xre8z8bq/aHR0cHM6Ly9mYWNlYm9vay5jb20vc2hhcmVyL3NoYXJlci5waHA_dT1odHRwcyUzQSUyRiUyRmJ5dGVzLmRldiUyRmFyY2hpdmVzJTJGNDQ2" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1812139980"&gt;&lt;img alt="" style="display: inline-block; max-width: 100%; width: 32px;" width="25" src="https://bytes.dev/images/fb-share-icon.png"&gt;&lt;/a&gt;&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/x0hph3ue3kmxwkf5/aHR0cHM6Ly93d3cubGlua2VkaW4uY29tL3NoYXJpbmcvc2hhcmUtb2Zmc2l0ZS8_dXJsPWh0dHBzJTNBJTJGJTJGYnl0ZXMuZGV2JTJGYXJjaGl2ZXMlMkY0NDY=" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1812139981"&gt;&lt;img alt="" style="display: inline-block; max-width: 100%; width: 32px;" width="25" src="https://bytes.dev/images/li-share-icon.png"&gt;&lt;/a&gt;&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/6qhehoulox407zio/aHR0cHM6Ly90d2l0dGVyLmNvbS9pbnRlbnQvdHdlZXQvP3RleHQ9V2h5JTIwdGhlJTIwVml0ZSUyMHRlYW0lMjB3ZW50JTIwYWxsJTIwaW4lMjBvbiUyMGJ1aWxkaW5nJTIwdGhlaXIlMjBvd24lMjBidW5kbGVyJnVybD1odHRwcyUzQSUyRiUyRmJ5dGVzLmRldiUyRmFyY2hpdmVzJTJGNDQ2" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1812139982"&gt;&lt;img alt="" style="display: inline-block; max-width: 100%; width: 32px;" width="25" src="https://bytes.dev/images/tw-share-icon.png"&gt;&lt;/a&gt;&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/kkhmh2unmzp4lwil/bWFpbHRvOj9ib2R5PVRob3VnaHQlMjB5b3UlMjdkJTIwbG92ZSUyMHRoaXMlMjB3ZWVrJTI3cyUyMEJ5dGVzJTBBLS0tJTBBV2h5JTIwdGhlJTIwVml0ZSUyMHRlYW0lMjB3ZW50JTIwYWxsJTIwaW4lMjBvbiUyMGJ1aWxkaW5nJTIwdGhlaXIlMjBvd24lMjBidW5kbGVyJTBBaHR0cHMlM0ElMkYlMkZieXRlcy5kZXYlMkZhcmNoaXZlcyUyRjQ0NiZzdWJqZWN0PVlvdSUyMGxpa2UlMjBjb3JuYnJlYWQlM0Y=" rel="noopener" style="color: #12b5e5; font-weight: 600; padding-left: 5px; text-decoration: none;" target="_blank" url-id="1812139983"&gt;&lt;img alt="" style="display: inline-block; max-width: 100%; width: 32px;" width="25" src="https://bytes.dev/images/em-share-icon.png"&gt;&lt;/a&gt;
&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;
&lt;hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;"&gt;
&lt;div style="text-align:center;margin-bottom:36px"&gt;
&lt;img width="150" src="https://bytes.dev/images/content/convex-logo.png" alt="Convex logo" style="max-width: 100%;"&gt;&lt;h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;"&gt;&lt;span&gt;Our Friends &lt;br class="mobile-break"&gt;(With Benefits)&lt;/span&gt;&lt;/h2&gt;
&lt;/div&gt;
&lt;div class="bg-alt" style="background-color: #f5f5f5; border-radius: 16px; margin-bottom: 40px; max-width: 100%; padding: 24px; padding-bottom: 12px;"&gt;
&lt;img src="https://bytes.dev/images/content/buff-simpsons2.jpg" alt="Mr Burns looking buff and a guy bowing to him" width="600" style="border-radius: 5px; max-width: 100%;"&gt;&lt;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;"&gt;Me showing my team how to build backend components&lt;!-- --&gt; &lt;/p&gt;
&lt;/div&gt;
&lt;h3 style="font-size: 24px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;"&gt;&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/58hvh8ug73wlm2s6/aHR0cHM6Ly9uZXdzLmNvbnZleC5kZXYvY29tcG9uZW50cy1hdXRob3Jpbmcv" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139984"&gt;You can build your own Convex Components now&lt;/a&gt;&lt;/h3&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;This lets you package up Convex functions, schemas, and persistent state into a reusable module that you or other developers can drop right into your projects.&lt;/p&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;&lt;strong style="font-weight: 600;"&gt;How is that different from writing a library?&lt;/strong&gt; They operate more like &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/25h2h9u3dlxn2zi3/aHR0cHM6Ly9kb2NzLmNvbnZleC5kZXYvY29tcG9uZW50cy9hdXRob3Jpbmc=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139985"&gt;mini Convex apps&lt;/a&gt; that let you share common backend capabilities like rate limiting, aggregates, and AI agents across projects.&lt;/p&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;With Convex Components, you can:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Persist data to tables where you control the schema&lt;/li&gt;
&lt;li&gt;Isolate access to data behind an API boundary&lt;/li&gt;
&lt;li&gt;Define queries, mutations, and actions that can run asynchronously&lt;/li&gt;
&lt;/ul&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/qvh8h8udne3qrmul/aHR0cHM6Ly93d3cueW91dHViZS5jb20vd2F0Y2g_dj1INEppSFV4Wlo2aw==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139986"&gt;Watch this quick YouTube demo&lt;/a&gt; to learn how you can use a Vite + Convex to build your own backend components from scratch.&lt;/p&gt;
&lt;hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;"&gt;
&lt;div style="text-align:center;margin-bottom:36px"&gt;
&lt;img width="110" src="https://bytes.dev/images/content/spot-the-bug.png" alt="Spot the Bug logo" style="max-width: 100%;"&gt;&lt;h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;"&gt;Spot the Bug&lt;/h2&gt;
&lt;div class="section-presenter" style="margin-bottom:50px;margin-top:15px"&gt;
&lt;h4 style="font-size: 19px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;"&gt;Sponsored by &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/9qhzhdud948np5f9/aHR0cHM6Ly93d3cuY2FsbHN0YWNrLmNvbS9ldmVudHMvcmVhY3QtbmF0aXZlLW9uLW1ldGEtcXVlc3QtYS1kZXZlbG9wZXJzLWd1aWRlLXRvLWJ1aWxkaW5nLWZvci12cj91dG1fY2FtcGFpZ249bWV0YSZ1dG1fbWVkaXVtPWVtYWlsJnV0bV9zb3VyY2U9Ynl0ZXM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139988"&gt;Callstack&lt;/a&gt;
&lt;/h4&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 16px; line-height: 1.5; margin-top: 5px; padding-left: 24px; padding-right: 24px;"&gt;&lt;em&gt;VR is the next frontier for React Native devs - &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/9qhzhdud948np5f9/aHR0cHM6Ly93d3cuY2FsbHN0YWNrLmNvbS9ldmVudHMvcmVhY3QtbmF0aXZlLW9uLW1ldGEtcXVlc3QtYS1kZXZlbG9wZXJzLWd1aWRlLXRvLWJ1aWxkaW5nLWZvci12cj91dG1fY2FtcGFpZ249bWV0YSZ1dG1fbWVkaXVtPWVtYWlsJnV0bV9zb3VyY2U9Ynl0ZXM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139988"&gt;watch&lt;/a&gt; and learn why.&lt;/em&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;pre class="language-js" style="background-color: #f9f9f9; border: 1px solid #f9f9f9; border-radius: 8px; color: #231F20; overflow: auto; padding: 24px;"&gt;&lt;code class="language-js" style="font-size: 14px;"&gt;&lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;function&lt;/span&gt; &lt;span class="token function" style="color: #9d7dce; font-size: 14px;"&gt;differenceInMilliseconds&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;&lt;span class="token parameter" style="color: #f38ba3; font-size: 14px;"&gt;date1&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;,&lt;/span&gt; date2&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt; &lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;{&lt;/span&gt;
  &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;const&lt;/span&gt; &lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;{&lt;/span&gt; &lt;span class="token literal-property property" style="color: #12b5e5; font-size: 14px;"&gt;getTime&lt;/span&gt;&lt;span class="token operator" style="color: #12b5e5; font-size: 14px;"&gt;:&lt;/span&gt; getTime1 &lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;}&lt;/span&gt; &lt;span class="token operator" style="color: #12b5e5; font-size: 14px;"&gt;=&lt;/span&gt; &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;new&lt;/span&gt; &lt;span class="token class-name" style="color: #12b5e5; font-size: 14px;"&gt;Date&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;date1&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;;&lt;/span&gt;
  &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;const&lt;/span&gt; &lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;{&lt;/span&gt; &lt;span class="token literal-property property" style="color: #12b5e5; font-size: 14px;"&gt;getTime&lt;/span&gt;&lt;span class="token operator" style="color: #12b5e5; font-size: 14px;"&gt;:&lt;/span&gt; getTime2 &lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;}&lt;/span&gt; &lt;span class="token operator" style="color: #12b5e5; font-size: 14px;"&gt;=&lt;/span&gt; &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;new&lt;/span&gt; &lt;span class="token class-name" style="color: #12b5e5; font-size: 14px;"&gt;Date&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;date2&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;;&lt;/span&gt;
  &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;return&lt;/span&gt; &lt;span class="token function" style="color: #9d7dce; font-size: 14px;"&gt;getTime1&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt; &lt;span class="token operator" style="color: #12b5e5; font-size: 14px;"&gt;-&lt;/span&gt; &lt;span class="token function" style="color: #9d7dce; font-size: 14px;"&gt;getTime2&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;;&lt;/span&gt;
&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;}&lt;/span&gt;

&lt;span class="token function" style="color: #9d7dce; font-size: 14px;"&gt;differenceInMilliseconds&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;&lt;span class="token string" style="color: #f99157; font-size: 14px;"&gt;'2021-01-01'&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;,&lt;/span&gt; &lt;span class="token string" style="color: #f99157; font-size: 14px;"&gt;'2021-01-02'&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;
&lt;hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;"&gt;
&lt;div style="text-align:center;margin-bottom:36px"&gt;
&lt;img width="110" src="https://bytes.dev/images/content/cool-bits.png" alt="Cool Bits logo" style="max-width: 100%;"&gt;&lt;h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;"&gt;Cool Bits&lt;/h2&gt;
&lt;/div&gt;
&lt;ol&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/3ohphdu3zx8v7ksr/aHR0cHM6Ly96aWdsYW5nLm9yZy9uZXdzL21pZ3JhdGluZy1mcm9tLWdpdGh1Yi10by1jb2RlYmVyZy8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139989"&gt;Zig migrated from GitHub to Codeberg&lt;/a&gt; for a mixture of political reasons (totally fair) and frustrations with “inexcusable bugs.” Codeberg rewarded their trust by promptly getting &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/n2hohquvr24e34t6/aHR0cHM6Ly9zb2NpYWwuYW5veGlub24uZGUvQENvZGViZXJnLzExNTY1MjI4OTk0OTk2NTkyNQ==" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139990"&gt;hit with a DDoS attack&lt;/a&gt; and going down for a while (not cool, Satya).&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;Right on cue, Sinclair Target shared some &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/48hvh7umgw3krofx/aHR0cHM6Ly9zaW5jbGFpcnRhcmdldC5jb20vYmxvZy8yMDI1LzA4L3Rob3VnaHRzLW9uLWdvLXZzLi1ydXN0LXZzLi16aWcv" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139991"&gt;thoughts on Go vs. Rust vs. Zig&lt;/a&gt;.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;Most AI projects fail during implementation – which is why Augment Code created this &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/wnh2h6uqgmd8q9i7/aHR0cHM6Ly9mYW5kZi5jby80ckRpTjVh" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139992"&gt;Guide to Closing the Enterprise AI Failure Rate Gap&lt;/a&gt;. It provides the specific infrastructure patterns, monitoring architectures, and deployment strategies that actually work at scale. [sponsored]&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;Critical security vulnerabilities are becoming super trendy these days, and the React Team just announced their own &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/reh8h9umxkpnm2c2/aHR0cHM6Ly9yZWFjdC5kZXYvYmxvZy8yMDI1LzEyLzAzL2NyaXRpY2FsLXNlY3VyaXR5LXZ1bG5lcmFiaWxpdHktaW4tcmVhY3Qtc2VydmVyLWNvbXBvbmVudHM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139993"&gt;unauthenticated remote code execution vulnerability in RSC&lt;/a&gt;. You should upgrade your React projects asap – unless you were too lazy to upgrade to React 19 in the first place. Then you’re good.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/08hwhgu2zn4q29al/aHR0cHM6Ly9naXRodWIuY29tL2FybmFyZy9uaXh0bWw=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139994"&gt;nixtml&lt;/a&gt; is a static site generator written in nix.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;Daniel Rosenwasser shared an update on &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/8ghqh3uo9w8ko3hk/aHR0cHM6Ly9kZXZibG9ncy5taWNyb3NvZnQuY29tL3R5cGVzY3JpcHQvcHJvZ3Jlc3Mtb24tdHlwZXNjcmlwdC03LWRlY2VtYmVyLTIwMjUv" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139995"&gt;TypeScript 7&lt;/a&gt;. It’s codenamed &lt;em&gt;Project Corsa,&lt;/em&gt; but it should hopefully run a lot better than the Vauxhall Corsa I rented last time I went to London.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;&lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/vqh3hmuogm68o3ug/aHR0cHM6Ly9jYXJib25xYS5jb20vP3V0bV9jYW1wYWlnbj1jb29sX2JpdHMmdXRtX2NvbnRlbnQ9ZGVjNSZ1dG1fbWVkaXVtPWVtYWlsJnV0bV9zb3VyY2U9Ynl0ZXM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139996"&gt;CarbonQA&lt;/a&gt; provides high-quality QA services for dev teams, so you’ll never have to waste time testing your own app again. Their US-based testers work in your tools, talk with your team on Slack, and let your devs spend their time building real features. [sponsored]&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;Zach Leatherman wrote some security suggestions for &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/l2heh6ulrqpwlzb6/aHR0cHM6Ly93d3cuemFjaGxlYXQuY29tL3dlYi9ucG0tc2VjdXJpdHkv" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139997"&gt;locking down your npm publishing workflows&lt;/a&gt;. So maybe you can help prevent &lt;em&gt;Shai Halud 3: The Return of the Worm&lt;/em&gt; from infecting an npm package near you.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;Bramus wrote about &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/m2h7h6u3e2xw3nsm/aHR0cHM6Ly93d3cuYnJhbS51cy8yMDI1LzEyLzAyL2FuY2hvci1wb3NpdGlvbmluZy1hbmQtdGhlLWluc2V0LW1vZGlmaWVkLWNvbnRhaW5pbmctYmxvY2staW1jYi8=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139998"&gt;the most likely reason you still get surprised by anchor positioning&lt;/a&gt;.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5;"&gt;JavaScript turned 30 years old and keeps complaining about its thinning hairline and how there aren’t any good indie bands anymore. To celebrate, enjoy &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/dphehmue5dxreqam/aHR0cHM6Ly9ieXRlcy5kZXYvYXJjaGl2ZXMvMjU=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139999"&gt;this story we wrote on JavaScript’s 25th birthday&lt;/a&gt; – which also happened to be issue #25 of Bytes &lt;span role="img" aria-label="yin yang"&gt;☯️&lt;/span&gt;. Call me Will Byers, because I’ve been in sync with the JS hivemind for a long time.&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;
&lt;hr style="border: 0; border-bottom: 5px solid; border-color: #f5f5f5; margin-bottom: 100px; margin-top: 100px;"&gt;
&lt;div style="text-align:center;margin-bottom:36px"&gt;
&lt;img width="110" src="https://bytes.dev/images/content/spot-the-bug.png" alt="Spot the Bug logo" style="max-width: 100%;"&gt;&lt;h2 style="font-family: Paytone One, sans-serif; font-size: 28px; margin-top: 10px; text-transform: uppercase;"&gt;Spot the Bug: Solution&lt;/h2&gt;
&lt;div class="section-presenter" style="margin-bottom:50px;margin-top:15px"&gt;&lt;h4 style="font-size: 19px; margin-bottom: 0; padding-left: 24px; padding-right: 24px;"&gt;Sponsored by &lt;a href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/9qhzhdud948np5f9/aHR0cHM6Ly93d3cuY2FsbHN0YWNrLmNvbS9ldmVudHMvcmVhY3QtbmF0aXZlLW9uLW1ldGEtcXVlc3QtYS1kZXZlbG9wZXJzLWd1aWRlLXRvLWJ1aWxkaW5nLWZvci12cj91dG1fY2FtcGFpZ249bWV0YSZ1dG1fbWVkaXVtPWVtYWlsJnV0bV9zb3VyY2U9Ynl0ZXM=" style="color: #12b5e5; font-weight: 600; text-decoration: underline;" url-id="1812139988"&gt;Callstack&lt;/a&gt;
&lt;/h4&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;pre class="language-js" style="background-color: #f9f9f9; border: 1px solid #f9f9f9; border-radius: 8px; color: #231F20; overflow: auto; padding: 24px;"&gt;&lt;code class="language-js" style="font-size: 14px;"&gt;&lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;function&lt;/span&gt; &lt;span class="token function" style="color: #9d7dce; font-size: 14px;"&gt;differenceInMilliseconds&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;&lt;span class="token parameter" style="color: #f38ba3; font-size: 14px;"&gt;date1&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;,&lt;/span&gt; date2&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt; &lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;{&lt;/span&gt;
  &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;const&lt;/span&gt; t1 &lt;span class="token operator" style="color: #12b5e5; font-size: 14px;"&gt;=&lt;/span&gt; &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;new&lt;/span&gt; &lt;span class="token class-name" style="color: #12b5e5; font-size: 14px;"&gt;Date&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;date1&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;.&lt;/span&gt;&lt;span class="token function" style="color: #9d7dce; font-size: 14px;"&gt;getTime&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;;&lt;/span&gt;
  &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;const&lt;/span&gt; t2 &lt;span class="token operator" style="color: #12b5e5; font-size: 14px;"&gt;=&lt;/span&gt; &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;new&lt;/span&gt; &lt;span class="token class-name" style="color: #12b5e5; font-size: 14px;"&gt;Date&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;date2&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;.&lt;/span&gt;&lt;span class="token function" style="color: #9d7dce; font-size: 14px;"&gt;getTime&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;;&lt;/span&gt;
  &lt;span class="token keyword" style="color: #f38ba3; font-size: 14px;"&gt;return&lt;/span&gt; t1 &lt;span class="token operator" style="color: #12b5e5; font-size: 14px;"&gt;-&lt;/span&gt; t2&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;;&lt;/span&gt;
&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;}&lt;/span&gt;

&lt;span class="token function" style="color: #9d7dce; font-size: 14px;"&gt;differenceInMilliseconds&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;(&lt;/span&gt;&lt;span class="token string" style="color: #f99157; font-size: 14px;"&gt;'2021-01-01'&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;,&lt;/span&gt; &lt;span class="token string" style="color: #f99157; font-size: 14px;"&gt;'2021-01-02'&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;)&lt;/span&gt;&lt;span class="token punctuation" style="color: #231F20; font-size: 14px;"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 17px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;In JavaScript, class methods are not direct properties of an instance, but rather belong to the class’s prototype. When you try to destructure a method, you’re attempting to extract it directly from the instance, which doesn’t work because &lt;code style="font-size: 14px;"&gt;getTime&lt;/code&gt; isn’t a direct property. On the other hand, &lt;code style="font-size: 14px;"&gt;new Date().getTime()&lt;/code&gt; works because JavaScript checks the &lt;code style="font-size: 14px;"&gt;prototype&lt;/code&gt; chain and finds &lt;code style="font-size: 14px;"&gt;getTime&lt;/code&gt; on the &lt;code style="font-size: 14px;"&gt;Date&lt;/code&gt; prototype.&lt;/p&gt;
&lt;div style="text-align:center;padding-bottom:80px;padding-top:80px"&gt;
&lt;div class="bg-alt" style="background-color: #f5f5f5; border-radius: 16px; margin-bottom: 40px; padding: 24px;"&gt;&lt;div style="margin-top:-40px"&gt;
&lt;img src="https://bytes.dev/images/bytes-icon.png" alt="Bytes" width="55px" style="max-width: 100%; width: 55px;"&gt;&lt;h5 style="font-size:18px;font-weight:400;margin-bottom:24px"&gt;Want us to say nice things &lt;br&gt; about your company?&lt;/h5&gt;
&lt;div style="margin-bottom:16px"&gt;&lt;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.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/e0hph0u74mz570s8/aHR0cHM6Ly9ieXRlcy5kZXYvYWR2ZXJ0aXNl" url-id="1812140000"&gt;Sponsor Bytes&lt;/a&gt;&lt;/div&gt;
&lt;div style="margin-bottom:20px"&gt;&lt;a style="color: #FCBA28; font-size: 14px; font-weight: 600; text-decoration: underline;" href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/7qh7h2u9zde399fz/aHR0cHM6Ly9ieXRlcy5kZXYvc2hhcmU=" url-id="1812140001"&gt;or share it&lt;/a&gt;&lt;/div&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 14px; line-height: 1.5; padding-left: 24px; padding-right: 24px;"&gt;Built with ❤️ by&lt;!-- --&gt; &lt;a style="color: #ed203d; font-weight: 600; text-decoration: underline;" href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/owhkhwuwoxe5wgav/aHR0cHM6Ly91aS5kZXY=" url-id="1812140002"&gt;ui.dev&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;&lt;/div&gt;
&lt;p style="font-family: Outfit, sans-serif; font-size: 14px; line-height: 1.5; opacity: 0.5; padding-left: 24px; padding-right: 24px;"&gt;50 W Broadway Ste 333 PMB 51647 Salt Lake City, Utah 84101&lt;/p&gt;
&lt;div style="font-family:Papyrus, cursive"&gt;&lt;a class="unsubscribe-link" href="https://click.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml/z2hgh7uew5z0ewip/aHR0cHM6Ly9ieXRlcy5kZXYvdW5zdWJzY3JpYmU=" style="color: #9B9890;" url-id="1812140003"&gt;Unsubscribe from Bytes&lt;/a&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;/td&gt;
&lt;td style="border-collapse: collapse !important; word-break: normal;"&gt;&lt;/td&gt;
&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;

&lt;span style="display: none"&gt;&lt;a href="https://unsubscribe.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml"&gt;Unsubscribe&lt;/a&gt;&lt;/span&gt;
&lt;!-- --&gt;
&lt;img src="https://open.kit-mail6.com/38u909o4rrakh2v9l40hrh4qgw2nns7h4oml" alt=""&gt;
&lt;/body&gt;
&lt;/html&gt;
Email Content
