GPU-Lexer: Trình tô màu cú pháp WebGPU đa ngôn ngữ chỉ 27.5KB

09 tháng 9, 2026·3 phút đọc

GPU-Lexer là một trình tô màu cú pháp mã nguồn không phụ thuộc ngôn ngữ, sử dụng WebGPU và mô hình máy học nhỏ gọn để phân loại các phần của mã, chỉ nặng 27.5KB. Công cụ này hứa hẹn tốc độ nhanh hơn gấp nhiều lần so với các thư viện truyền thống như Shiki hay Highlight.js, đặc biệt hiệu quả trên các tệp lớn, nhờ chạy trực tiếp trên GPU của trình duyệt.

GPU-Lexer: Trình tô màu cú pháp WebGPU đa ngôn ngữ chỉ 27.5KB

Nhóm nghiên cứu tại Vercel Labs vừa giới thiệu GPU-Lexer, một trình tô màu cú pháp (syntax highlighter) không phụ thuộc ngôn ngữ, chạy trên nền tảng WebGPU. Thay vì dựa vào cú pháp cụ thể của từng ngôn ngữ lập trình, công cụ này sử dụng một mô hình máy học siêu nhỏ để "đoán" loại của từng phần mã dựa trên ngữ cảnh, mang lại hiệu suất vượt trội trên các tệp mã nguồn lớn.

Kiến trúc đột phá: Không cần grammar, chỉ cần GPU

Khác biệt lớn nhất của GPU-Lexer so với các thư viện truyền thống như Shiki hay Prism.js nằm ở cách tiếp cận. Thay vì phân tích cú pháp theo luật của từng ngôn ngữ, GPU-Lexer chia nhỏ mã nguồn thành các phần cơ bản nhất — từ, khoảng trắng, dòng mới và ký hiệu. Sau đó, một mô hình WebGPU nhỏ sẽ kết hợp thông tin cục bộ và toàn bộ tệp để "gán nhãn" cho từng phần.

"Đây là một thử nghiệm, không phải một trình tô màu tương đương về mặt ngữ pháp," tác giả Shu Ding chia sẻ. "Thay vì chọn một grammar, nó đoán loại của mỗi phần từ mã nguồn xung quanh, kể cả khi chưa từng thấy ngôn ngữ đó trong quá trình huấn luyện."

Hiệu suất và kích thước ấn tượng

  • Kích thước gói chỉ 27.5KB (minified + Brotli) cho mọi ngôn ngữ, so với Shiki lên tới 213.9KB chỉ cho 6 ngôn ngữ web phổ biến.
  • Tốc độ xử lý nhanh hơn tới 60 lần so với Shiki trên tệp three.min.js gộp 10 lần (5.56 triệu ký tự).
  • Sử dụng công nghệ GPU (WebGPU) để tăng tốc xử lý song song.

Theo bảng so sánh trên máy MacBook Pro M4 Pro (GPU 20 lõi, Chrome 152):

  • GPU-Lexer: 471.7ms
  • Sugar High: 859.4ms
  • Prism.js: 1.20s
  • Highlight.js: 1.32s
  • Starry Night: 11.1s
  • Shiki: 30.4s

Độ chính xác và hạn chế

Trong các bài kiểm tra trên 1,069 tệp được giữ lại từ GitHub Innovation Graph Top 25 (quý 1/2026), GPU-Lexer đạt 90.20% mức độ đồng thuận với Shiki (chuẩn tham chiếu 100%). Con số này thấp hơn một chút so với Prism.js (87.01%) và Starry Night (85.07%) nhưng cao hơn Highlight.js (84.65%) và Sugar High (76.33%).

Tác giả lưu ý rằng con số này chỉ đo lường sự đồng thuận với Shiki, không phải độ chính xác tuyệt đối. Trên các ngôn ngữ chưa từng thấy hoặc mã thực tế phức tạp, tỷ lệ khác biệt có thể cao hơn mức 12.57% được ghi nhận.

Tiềm năng cho cộng đồng phát triển web

Đối với các lập trình viên Việt Nam và quốc tế, GPU-Lexer mở ra hướng đi mới cho việc hiển thị mã nguồn trên trình duyệt:

  • Giảm tải băng thông: Chỉ cần một tệp nhỏ duy nhất cho tất cả ngôn ngữ.
  • Tối ưu cho trang web nhiều mã: Các trang như blog kỹ thuật, tài liệu API hay diễn đàn có thể hiển thị mã nguồn nhanh hơn đáng kể.
  • Hoạt động hoàn toàn trên client: Không cần máy chủ xử lý, giảm chi phí server.

Một số hạn chế hiện tại bao gồm: công cụ chưa hỗ trợ tô màu chính xác cho các cú pháp phức tạp như template literal, và trình duyệt cần hỗ trợ WebGPU (hiện có trên Chrome, Edge và các trình duyệt Chromium khác). Các nhà phát triển quan tâm có thể thử nghiệm trực tiếp tại gpu-lexer.vercel.app.

Chia sẻ:FacebookX
Nội dung tổng hợp bằng AI, mang tính tham khảo. Xem bài gốc ↗