AAA – Kỹ thuật khử răng cưa phân tích

Hành trình hôm nay: khử răng cưa

• Khử răng cưa là một dạng nghệ thuật đã phát triển qua nhiều thập kỷ toán học, kỹ thuật sáng tạo và đổi mới không ngừng.
• Có nhiều cách tiếp cận như SSAA, SMAA, DLAA, và mỗi cách đều cố gắng đạt cùng một mục tiêu bằng những phương pháp khác nhau.
• Bài viết này xem xét cách các phương pháp đó hoạt động và giới thiệu một cách mới để giải quyết vấn đề: khử răng cưa phân tích.

Thiết lập

• Để hiểu thuật toán khử răng cưa, tác giả triển khai bằng cách vẽ một hình tròn chuyển động trên canvas WebGL.
• Nếu độ phân giải quá cao khiến không nhìn thấy hiện tượng răng cưa, có thể hạ độ phân giải xuống để quan sát.

Phân tích kỹ thuật

• Không bắt buộc phải hiểu mã GPU, nhưng điều đó sẽ giúp ích cho việc hiểu phần phân tích.
• Hình tròn không được vẽ bằng hình học mà được vẽ bởi shader.

SSAA

• SSAA là viết tắt của super sampling anti-aliasing, phương pháp render ở độ phân giải lớn hơn rồi downsample.
• Cách triển khai đơn giản nhưng đòi hỏi nhiều bộ nhớ và tính toán.
• Cần bố trí mẫu phù hợp và phải tích hợp sâu với pipeline render.

MSAA

• MSAA chỉ thực hiện super sampling ở đường viền silhouette của mô hình, hình học chồng lấp và mép texture.
• Nó được triển khai bằng phần cứng và việc hỗ trợ hay không phụ thuộc vào phần cứng.
• Trong một số tình huống, có thể không tốn chi phí hiệu năng.

Khử răng cưa hậu xử lý

• Năm 2009, bài báo của Alexander Reshetov đã khai sinh ra MLAA.
• FXAA là một thuật toán được phát triển lấy cảm hứng từ MLAA, có chi phí hiệu năng thấp và dễ triển khai.
• Nó hiệu quả hơn trong các cảnh phức tạp.

Khử răng cưa phân tích

• Khử răng cưa phân tích tiếp cận vấn đề theo hướng ngược lại: biết trước hình dạng cần thiết và vẽ các pixel đã được khử răng cưa sẵn lên màn hình.
• Không cần buffer bổ sung hay yêu cầu phần cứng đặc biệt, và có thể chạy cả trên WebGL 1.0 hoặc OpenGLES 2.0 cơ bản.
• Nó tính kích thước pixel để làm mờ dần biên của hình dạng.

Triển khai

• Dùng signed distance field cho phép biết khoảng cách từ mỗi điểm được lấy mẫu tới hình dạng mong muốn.
• Các hàm dFdx, dFdy, fwidth được dùng để tính kích thước pixel.
• Việc blending được thực hiện bằng alpha blending hoặc MSAA + Alpha to Coverage.
• Có thể dùng linearstep thay cho smoothstep để tối ưu hiệu năng.

Kết luận

• Khử răng cưa phân tích mang lại các cạnh mượt bằng cách làm mờ dần chính xác biên của hình dạng.
• Có nhiều cách triển khai khác nhau, cho phép lựa chọn giữa hiệu năng và độ chính xác.

[GN⁺]

Ý kiến trên Hacker News

• Phần phân tích lập trình đồ họa được trình bày thông qua ví dụ WebGL và đây là một bài viết rất chuyên sâu
  • Đã dùng MSAAx4, nhưng đang cân nhắc chuyển sang FXAA/TAA và cũng học được cách tiếp cận phân tích cho các thành phần UI
  • Tài liệu về lập trình đồ họa khá hiếm, nhưng danh sách phân tích khung hình là một nguồn tài nguyên hữu ích
  • Nhiều trò chơi không giải thích sự khác nhau giữa các chữ viết tắt trong thiết lập AA, nên còn thiếu tính thân thiện với người dùng
  • SDF (mSDF) vốn đã là một kỹ thuật cổ điển đủ tốt
  • Việc giải quyết các đoạn đường cong Bézier ở cấp độ pixel trong Slug và DirectWrite là công nghệ của hiện tại hoặc tương lai
  • Đây là lần đầu biết đến công việc của Captain Disillusion, rất đáng giới thiệu cho những ai quan tâm đến hiệu ứng video
  • Khung hình có vòng tròn và phần phóng to là một cách rất tuyệt để truyền tải thông điệp
  • Các dải chuyển sắc mượt mà mang lại cảm giác rất thỏa mãn
  • Engine render 2D và 3D có mục tiêu và trường hợp sử dụng hoàn toàn khác nhau
  • Trong 3D có thể không quan trọng, nhưng trong 2D lại có những tiêu chí AA mà độ chính xác và độ lệch là rất quan trọng
  • Ảnh chụp màn hình NeoTokyo rất ấn tượng, và đã có khoảng thời gian vui vẻ khi vận hành máy chủ cho bản mod đó
  • Đã đọc nhầm SSAA thành 'khử răng cưa không gian màn hình'