HeadlinesBriefing favicon HeadlinesBriefing.com

Removing React.js from Misago with HTMX

Hacker News •
×

The current Misago stack renders a thread list with a Django view that outputs almost full HTML and embeds a JSON payload. React.js then runs on the client, reads that JSON, replaces the HTML, and enables interactivity. This dual rendering causes duplication: every page exists as a Django template and a React component, leading to editing headaches, API overhead, duplicated translations, and a hefty JavaScript bundle—679kb for the vendor file alone.

A cleaner alternative is to keep most logic on the server and use HTMX to swap small HTML islands on user actions. HTMX is a tiny, declarative library that can replace a thread list or a poll without any JSON or React code. The backend only needs to return the partial HTML for the requested island, eliminating the need for separate React routes and serializers. This keeps the codebase simpler, reduces bundle size, and mirrors the traditional forum model that works well for many users.

The migration will happen incrementally: first the navbar, then thread lists, user profiles, and finally the admin panel. The plan targets a full transition by late 2024. Each step will cut JavaScript size—Misago’s main bundle dropped from 679kb to 530kb after moving the thread list to HTMX.

While the site will temporarily be a multi‑page application during the shift, most interactions remain fast, and placeholders for AJAX or HTMX will handle critical actions like voting or liking posts without full reloads.