{
  "id": 18229144,
  "title": "How I Built a Static Blog with 50+ Articles and Zero Frameworks: Pure HTML, CSS, and JavaScript",
  "url": "https://urgent.news/2026/11/05/how-i-built-a-static-blog-with-50-articles-and-zero-frameworks-pure",
  "topic": "tech",
  "section": "Tech",
  "published": "2026-11-05T02:20:51.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/whjin/how-i-built-a-static-blog-with-50-articles-and-zero-frameworks-pure-html-css-and-javascript-5708"
  },
  "original_language": "en",
  "account": "For years, I've been asked about the framework powering my blog. The answer always catches people off guard: none at all. Wuhuajin.com, my blog, is a completely static site crafted with just HTML, CSS, and vanilla JavaScript—no React, Vue, or any build tools. Over 50 articles have been published, and it maintains near-perfect PageSpeed scores for more than a year. This article details my decision to forgo frameworks, the architecture that powers the site, and the trade-offs to consider when pursuing a similar approach.\n\nI abandoned frameworks for a content site because frameworks tackle problems like state management, component re-rendering, routing, and code organization that my simple blog didn't require. A blog's sole purpose is to deliver text and images to readers swiftly. Framing it that way, a zero-framework blog became the logical choice. It ensures maximum speed, minimal maintenance, full control over every byte of HTML, and long-term longevity.\n\nThe system operates on a straightforward principle: write in Markdown, ship as static HTML. No client-side rendering—each article is transformed into a standalone HTML file during the build process. The site's source, located in the src/ directory, consists of reusable components, article Markdown files, CSS, and JavaScript files. The content pipeline converts Markdown into prerendered HTML, parsing front matter, applying syntax highlighting, and generating pages that work seamlessly even with JavaScript disabled.\n\nBuild scripts, written in custom Node.js .cjs files, handle the prerendering process, generating HTML for articles, categories, the homepage, and sitemaps. Each script is independent, making the build process straightforward and deterministic. Development is facilitated by a simple server script that uses Node's built-in http module and file watchers to provide live reload functionality without the overhead of a heavy bundler.\n\nFor multilingual support, the site incorporates a lightweight dictionary for translation, which maps English keys to translated strings. This dictionary is used by a single i18n component, adding just a few hundred lines of code without the substantial payload of a full i18n solution. Performance improvements, including HTML size reduction, reduced render-blocking resources, and optimized images, demonstrate that a zero-framework approach doesn't compromise on speed.",
  "summary": "How I Built a Static Blog with 50+ Articles and Zero Frameworks: Pure HTML, CSS, and JavaScript Every few months, someone asks me the same question: \"What framework is your blog built with? Next.js? Astro?\" The answer usually surprises them: none. My blog, wuhuajin.com , is a fully static site built with pure HTML, CSS, and vanilla JavaScript — no React, no Vue, no build framework. It has over 50…",
  "key_points": [
    "Wuhuajin.com is a static blog built with only HTML, CSS, and JavaScript.",
    "No frameworks used to ensure maximum speed and minimal maintenance.",
    "Over 50 articles published with near-perfect PageSpeed scores for over a year."
  ],
  "editors_take": "Prioritizing vanilla web technologies over complex frameworks trades modern development conveniences for superior site speed, reduced maintenance overhead, and long-term stability for content-driven platforms.",
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}