TL;DR

Thariq Shihipar - kỹ sư tại Anthropic Claude Code team - vừa publish một bài viết và bộ demo gồm 20 file HTML tự-contained được tạo bởi Claude Code, minh chứng rằng HTML không chỉ "cũng được" mà thực sự vượt trội hơn Markdown trong nhiều trường hợp. Bài viết thu về hơn 15.000 lượt thích trên X chỉ trong ngày đầu tiên, và Simon Willison - một trong những giọng nói uy tín nhất về LLM - gọi đây là "thought-provoking."

Tại sao Markdown từng thống trị

Câu trả lời rất đơn giản: token. Trong thời đại GPT-4 với context window 8K token, mỗi ký tự đều có giá. HTML với các thẻ markup chiếm nhiều token hơn Markdown đáng kể - một bảng HTML tiêu tốn token gấp nhiều lần so với bảng Markdown tương đương. Vì vậy, cộng đồng AI mặc định chọn Markdown như một quy ước ngầm.

Nhưng thế giới đã thay đổi. Claude hiện có context window từ 200K đến 1M token. Chi phí token không còn là ràng buộc quyết định nữa - và đây là lúc để xét lại quy ước cũ.

HTML làm được gì mà Markdown không thể

Thariq liệt kê bốn lợi thế cốt lõi:

  • Visual richness: SVG charts, màu sắc theo severity, styled callout boxes - Markdown không có CSS
  • Tương tác: Widget native, dynamic component - người dùng có thể filter, sort, expand ngay trong file
  • Navigation: Anchor trong trang, phân cấp thông tin có cấu trúc - đặc biệt hữu ích cho tài liệu dài
  • Typography chuyên nghiệp: CSS styling làm tăng đáng kể khả năng đọc

Câu tóm gọn nhất đến từ Stable Learn: "Markdown is a report. HTML is an interface."

20 ví dụ thực tế trong 9 danh mục

Bộ demo tại thariqs.github.io/html-effectiveness gồm 20 file HTML tự-contained, phân thành 9 danh mục:

  • Exploration & Planning (3 file) - brainstorm, roadmap, phân tích yêu cầu
  • Code Review (3 file) - PR review với risk categorization (safe / worth a look / needs attention), navigation theo file, comment theo từng dòng
  • Design (2 file) - mockup, design spec
  • Prototyping (2 file) - clickable prototype ngay trong browser
  • Illustrations & Diagrams (2 file) - SVG diagram, flowchart
  • Decks (1 file) - slide deck chạy trong browser
  • Research & Learning (2 file) - interactive explainer như trang giải thích Consistent Hashing
  • Reports (2 file) - report có thể filter, collapse
  • Custom Editing Interfaces (3 file) - editor tùy chỉnh cho từng workflow
Screenshot HTML output giải thích Python script được Claude Code tạo ra - dark theme, bố cục có cấu trúc với summary, bảng so sánh, và numbered steps
HTML output do Claude Code tạo ra khi giải thích một Python script khai thác lỗ hổng Linux - Simon Willison test trực tiếp

Code review HTML trông như thế nào

Ví dụ PR #247 trong demo: thay vì một file Markdown phẳng buộc người đọc scroll tuyến tính, HTML output có:

  • Risk badge cho từng issue: safe / worth a look / needs attention
  • Anchor navigation nhảy thẳng tới từng file được review
  • Comment gắn với line number cụ thể
  • Diff visualization với thống kê thay đổi (+142 / -38)

Với Markdown, tất cả những thứ trên sẽ bị "phẳng" thành đoạn văn tuần tự - mất đi spatial relationship giúp reviewer triage nhanh.

Hạn chế và khi nào không nên dùng

Cộng đồng Hacker News (430 điểm, 247 comment) cũng nêu các điểm trừ thực tế:

  • Token overhead: HTML table tốn token gấp nhiều lần Markdown table - vẫn là vấn đề khi context ngắn
  • Khó co-author: Khi người dùng muốn chỉnh sửa trực tiếp, phải copy cả card structure HTML thay vì chỉ sửa text thuần
  • Browser dependency: Markdown render được ở khắp nơi (GitHub, VSCode, terminal); HTML cần browser
  • Không phù hợp với: code file, structured data (JSON/YAML), summary nhanh

Một số commenter HN đề xuất hybrid approach: nhúng HTML vào Markdown cho các phần cần tương tác, giữ Markdown thuần cho phần còn lại.

Ai nên thử ngay

HTML output phát huy tối đa khi output cần:

  • Được review lại nhiều lần (code review, audit report)
  • Chia sẻ với team không cần cài tool (gửi file .html là mở được ngay)
  • So sánh side-by-side (implementation plan A vs B)
  • Filter hoặc tìm kiếm trong nội dung
  • Trình bày cho stakeholder không kỹ thuật

Prompt gợi ý từ Thariq: "Output HTML using complete HTML, CSS, JavaScript capabilities to create rich, interactive, clear explanations."

Kết

Bài viết của Thariq không phải là "HTML beats Markdown" tuyệt đối - mà là lời nhắc rằng quy ước công cụ nên được xem xét lại khi điều kiện kỹ thuật thay đổi. Markdown giải quyết bài toán của GPT-4 8K token. Claude 200K+ token mở ra không gian để tư duy lại.

Nếu bạn dùng Claude Code để tạo artifact để đọc - thay vì artifact để xử lý tiếp bằng code - thì HTML có thể là lựa chọn tốt hơn bạn nghĩ.

via thariqs.github.io/html-effectiveness · Simon Willison · Hacker News