Spaceship is a high-performance, premium blog and portfolio template built with Astro 5, Svelte 5 Runes, and Tailwind CSS 4. It is designed for developers and designers who want a modern, ultra-fast, and SEO-optimized web experience.
#✨ Features
- 🚀 High Performance: Built with Astro for lightning-fast speeds and minimal JavaScript.
- ⚡ Optimizations:
- Partytown: Google Analytics is offloaded to web workers.
- Loading Indicator: Smooth progress bar for better navigation UX.
- 🎨 Modern Design: Clean aesthetics with dark mode support and fluid typography.
- Svelte 5 Runes: Leveraging the latest Svelte reactivity system (
$state,$derived,$props). - Tailwind CSS 4: Next-gen CSS framework for high performance and zero-runtime.
- 📝 Interactive Blog:
- MDX Support: Embed Svelte components directly in your posts.
- Series Support: Group related posts into a series with automatic navigation.
- Draft Mode: Hide draft posts in production, visible in development.
- Publication Date Filtering: Schedule posts with future dates.
- Customizable CTA: Add call-to-action blocks at the end of posts.
- Per-Post Controls: Toggle CTA and comments individually per post.
- 💬 Comments System:
- GitHub Discussions: Powered by Giscus for privacy-friendly comments.
- Fully Customizable: Configure theme, language, and behavior.
- Per-Post Toggle: Enable/disable comments on individual posts.
- 🔍 Advanced Search: Fast, client-side search across all post titles and descriptions.
- 📊 Robust SEO:
- JSON-LD Support: Automatic structured data for WebSite, BlogPosting, Person, and Breadcrumbs.
- Canonical URLs: Built-in support for canonical links and robots meta tags.
- Dynamic OG Images: Automatically generated social preview images for every post.
- RSS Feed & Sitemap: Ready-to-use RSS and sitemap generation.
- ✍️ Enhanced Markdown:
- Shiki Syntax Highlighting: Includes line highlights, diffs, and word highlighting.
- Auto-generated TOC: Interactive table of contents with scroll spying.
- Heading Anchor Links: Clickable links for sharing specific sections.
- Mermaid Diagrams: Support for flowcharts and diagrams directly in markdown.
- Emoji Support: Native emoji shortcodes (
:rocket:, etc.).
- 🧹 Modular Architecture: Well-organized components and content collections.
#🛠️ Tech Stack
- Framework: Astro 5
- UI Components: Svelte 5
- Styling: Tailwind CSS 4
- Content: Markdown & MDX
- Optimization: Sharp, Shiki, Partytown
- Icons: Lucide & custom SVGs