跪拜 Guibai
← Back to the summary

Skyplume Ships a Next.js 15 Blog Template That Hits Triple 100s on Lighthouse Out of the Box

TL;DR

  • Skyplume is a Next.js 15 blog template extracted from a real production personal blog.
  • It comes with MDX writing, SEO, RSS, sitemap, local search, tags, dark mode, Giscus comments, and static export built in.
  • The base template is tuned for Lighthouse scores of 100 in Performance, Best Practices, and SEO.
  • The project is open source and supports one-click deployment to Vercel.

skyplume-card.svg

Recently, I organized my personal blog system into an open-source template called Skyplume Blog Template.

It's not a hastily assembled demo but was extracted from my own production blog 0x1ai.com. The template's goal is clear: to give people who want to write seriously, document projects, and publish engineering notes a clean, fast, maintainable Next.js blog starting point with solid SEO fundamentals.

Project links:

If you're looking for a personal blog template you can maintain long-term, rather than just a landing page for screenshots, Skyplume might be a good fit.

Why create another blog template?

There's no shortage of blog templates, but many share a common problem: they look great at first glance, but after writing a few articles, you find the maintenance cost is very high.

Some templates prioritize visuals, making the article page uncomfortable to read; some have many features, but customization entry points are deeply hidden; some require you to add SEO, RSS, sitemap, Open Graph, and article structured data yourself. For someone whose main goal is writing, these things constantly interrupt the publishing rhythm.

Skyplume's approach is relatively restrained: make the content readable first, then talk about decoration.

Its interface uses clear typography, quiet borders, lightweight animations, and a stable dark mode. You can treat it as a personal publishing system with infrastructure already set up, then refocus your energy on articles, projects, and long-term accumulation.

What does it look like?

The image below is a screenshot of the template's homepage. The overall style prioritizes content, avoids excessive decoration, but retains enough detail: clear navigation, prominent hero text, lightweight stat cards, article lists, tags, and a stable rhythm of whitespace.

demo-blog.png

I hope it doesn't look like a "freshly initialized template," but rather something closer to a personal site ready for long-term writing.

What features are built in?

Skyplume is built on Next.js 15 App Router, React 19, TypeScript, Tailwind CSS 4, and Contentlayer, with MDX as the core writing method.

Currently built-in capabilities include:

I tried to include in advance "things a seriously maintained personal blog will eventually need," but without introducing a large CMS or complex backend. Most configurations are concentrated in ordinary data files, MDX files, and small React components.

Lighthouse Performance

The base template has been tuned for Lighthouse, achieving scores of 100 in Performance, Best Practices, and SEO. Actual scores after deployment will still be affected by images, analytics scripts, comment systems, and third-party resources, but the template itself won't be a drag from the start.

Skyplume blog template Lighthouse test screenshot, with Performance, Best Practices, and SEO all scoring 100

I care about this quite a bit. A blog isn't just for the author, nor just for search engines. It should open quickly on mobile, have a clear article structure, display the correct card when shared, and have feeds and sitemaps available by default.

Who is it for?

Skyplume is more suitable for these scenarios:

It's less suitable for these scenarios:

Quick Start

If you want to run it locally, just:

yarn install
yarn dev

Then open:

http://localhost:3000

If you want to deploy directly, you can click this button:

Deploy with Vercel

When customizing for the first time, it's recommended to prioritize modifying these files:

What's the writing experience like?

Articles are placed in the data/blog directory, written in MDX.

---
title: My First Post
date: '2026-01-01'
tags:
  - nextjs
  - writing
categories:
  - notes
draft: false
summary: A short description for feeds, cards, and SEO.
authors:
  - default
---

Write your post in MDX.

Article images are recommended to be placed in:

public/static/blog/<post-slug>

Then referenced in MDX like this:

![Screenshot](/static/blog/my-first-post/screenshot.png)

This workflow is quite close to my own blogging habits: the file structure is clear, articles are articles, images are images, and site configurations can all be tracked in the repository.

How is it different from a regular starter?

When making Skyplume, I didn't just want to make a starter that "runs," but a template that allows for "long-term writing."

Dimension Common starter Skyplume
Writing Markdown or simple MDX MDX + front matter + custom components
SEO Usually needs manual addition metadata, OG, canonical, JSON-LD, sitemap, robots, RSS included
Discovery Mostly just a list page Tags, pagination, local search, RSS
Design Large visual differences Content-first, restrained typography, stable dark mode
Deployment Usually deployable Supports Vercel one-click deploy, also supports static export
Maintainability Depends on specific template implementation Configuration concentrated in data files and small components

Of course, it's not perfect. I plan to continue optimizing the template documentation, add more screenshots, organize a theming guide, and collect real websites built by users based on Skyplume.

Open Source Info

Skyplume is open-sourced under the MIT License.

If you find this template helpful, you are welcome to:

Here's the project link again:

https://github.com/ruoduan-hub/next-blog-skyplume-template

You're also welcome to directly experience the production reference site:

https://www.0x1ai.com/

Conclusion

I've always felt that the most important thing about a personal blog isn't "looking like a product homepage," but whether it allows someone to keep writing.

Skyplume's goal is the same: it doesn't try to decide your content for you, nor does it hide site configuration in complex systems. It just lays the infrastructure a modern personal blog needs in advance, so you can start writing faster, maintain more stably, and accumulate your content assets more naturally.

If you're preparing to rebuild your blog, or want to find a clean publishing entry for projects, engineering notes, and open-source records, you can give Skyplume a try.

When publishing to Chinese communities, if the platform doesn't display GitHub raw images, you can manually upload these images: