feat: add Cloudpack series to homepage

This commit is contained in:
Ken
2026-05-27 07:19:52 +00:00
parent 58e2c2c42e
commit 2a9c91e1e6
+65
View File
@@ -46,6 +46,47 @@ const rageSeries = [
description: rageDescriptions[i],
};
});
// Match cloudpack series titles to actual published posts by slug
const cloudpackPosts: Record<string, string> = {
'604ms Rebuilds at 50,000 Modules': '604ms-rebuilds-at-50000-modules',
'50KB Down to 2KB: Why We Stopped Parsing Source Files': '50kb-down-to-2kb-why-we-stopped-parsing',
'We Shipped 40% Less JavaScript and Nobody Noticed': 'we-shipped-40-percent-less-javascript',
'50% Less Bandwidth Per Deploy': '50-percent-less-bandwidth-per-deploy',
'Your Users Are Already Telling You How to Bundle': 'your-users-are-already-telling-you-how-to-bundle',
"A Compromised Server Can't Inject Code": 'a-compromised-server-cant-inject-code',
};
const cloudpackDescriptions = [
'The outcome: 604ms warm rebuilds. The insight: the bundle is a query, not a file.',
'25x compression. Module summaries replace full parsing. 50k modules fit in L3 cache.',
'Two-layer tree-shaking. Module-level conservative. Function-level aggressive via call-edge graph.',
'Delta manifests. Browser says what it has, server returns what\'s missing. 47 GB/week saved.',
'Real browser sessions drive chunk grouping. No rebuild required. C³ clustering from live traffic.',
'Ed25519 signing. The threat model: ABS compromise ≠ code injection. Two breaches required.',
];
const cloudpackTitles = [
'604ms Rebuilds at 50,000 Modules',
'50KB Down to 2KB: Why We Stopped Parsing Source Files',
'We Shipped 40% Less JavaScript and Nobody Noticed',
'50% Less Bandwidth Per Deploy',
'Your Users Are Already Telling You How to Bundle',
"A Compromised Server Can't Inject Code",
];
const cloudpackSeries = cloudpackTitles.map((title, i) => {
const slug = cloudpackPosts[title];
const post = slug ? posts.find(p => p.id === slug) : null;
return {
title,
slug: slug || null,
published: !!post,
readingTime: post?.body ? getReadingTime(post.body) : null,
number: i + 1,
description: cloudpackDescriptions[i],
};
});
---
<BaseLayout title='Crash Test Dev'>
@@ -130,6 +171,30 @@ const rageSeries = [
</div>
</section>
<!-- Cloudpack Series: 2-column grid at container width -->
<section class="series" aria-label="Cloudpack series">
<h2 class="section-heading">Cloudpack: The Module Graph Is the Software</h2>
<p class="series-description">A six-part investigation into cloudpack, a Rust-based bundler where the bundle is a query against a continuously-maintained module graph. 604ms rebuilds at 50k modules. 50% less CDN bandwidth per deploy. Dead code that actually stays dead.</p>
<div class="series-grid">
{cloudpackSeries.map((item) => (
<div class={`series-card ${item.published ? 'published' : ''}`}>
<span class="card-number">{String(item.number).padStart(2, '0')}</span>
<div class="card-body">
<span class="card-title">{item.title}</span>
<span class="card-description">{item.description}</span>
{item.published ? (
<a href={`${base}posts/${item.slug}/`} class="card-link">
Read &middot; {item.readingTime} min
</a>
) : (
<span class="card-status">Coming soon</span>
)}
</div>
</div>
))}
</div>
</section>
<!-- All Posts: compact 2-column grid at reading width -->
<section class="all-posts" aria-label="All posts">
<h2 class="section-heading">All Posts</h2>