Công nghệ UE5 Nanite trên WebGPU

 (github.com/Scthe)
1 điểm bởi GN⁺ 2024-09-06 | 1 bình luận | Chia sẻ qua WhatsApp

Nanite WebGPU

Tóm tắt

  • Nanite WebGPU là một dự án triển khai Nanite bằng WebGPU trong trình duyệt web.
  • Chỉ dùng được trên Chrome.
  • Bao gồm phân cấp LOD Meshlet, trình raster hóa phần mềm, billboard impostor và nhiều thành phần khác.
  • Hỗ trợ frustum culling và occlusion culling.
  • Hỗ trợ texture và vertex normal.
  • Hoạt động cả ngoại tuyến bằng Deno.

Tính năng

  • Phân cấp LOD Meshlet

    • Tiền xử lý mesh trong trình duyệt bằng WebAssembly.
    • Cũng cung cấp tính năng xuất tệp.

  • Trình raster hóa phần mềm

    • WebGPU không hỗ trợ atomic<u64>.
    • Nén độ sâu (u16) và normal mã hóa octahedron (2 * u8) vào 32 bit.

  • Billboard impostor

    • Hiển thị bằng cách trộn 12 hình ảnh theo vị trí camera.
    • Không xử lý góc nhìn từ trên xuống hoặc từ dưới lên.

  • Culling

    • Theo từng instance: frustum culling và occlusion culling.
    • Theo từng Meshlet: frustum culling và occlusion culling.
    • Theo từng tam giác: hardware backface culling và z-buffer.

  • Có thể chuyển đổi giữa kết xuất dựa trên GPU và triển khai CPU.

  • Hỗ trợ đồng thời model có texture và nhiều đối tượng khác nhau.

  • Có thể thay đổi tham số khi chạy.

  • Cung cấp thống kê: bộ nhớ, hình học, số Meshlet, số tam giác, v.v.

  • Hỗ trợ định dạng tệp tùy chỉnh.

  • Hỗ trợ lượng tử hóa vị trí vertex và normal mã hóa octahedron.

  • Xử lý thay đổi kích thước cửa sổ.

  • Hoạt động cả ngoại tuyến bằng Deno.

  • Có thể sao chép mã WebGPU và WGSL vào dự án.

Mục tiêu

  1. Đơn giản: bắt đầu từ tệp OBJ và xử lý mọi thứ bên trong ứng dụng.
  2. Thử nghiệm: có thể thay đổi nhiều thiết lập để kiểm tra hiệu năng.

Cảnh demo

  • Jinx: 120*120 instance, 640m tam giác.
  • Lucy và rồng: 70*70 instance, 1.7b tam giác.
  • Lucy: 110*110 instance, 1.2b tam giác.
  • Rồng: 70*70 instance, 1.2b tam giác.
  • Thỏ: 500*500 instance, 1.2b tam giác.
  • Xem trước impostor: tăng kích thước texture impostor.

Cách dùng

  • Di chuyển bằng các phím [W, S, A, D], lên/xuống bằng [Z, SPACEBAR].
  • Có thể bật/tắt các tùy chọn culling để khắc phục lỗi.
  • Có thể đo hiệu năng bằng nút Profile.

FAQ

  • Khác biệt chính so với Nanite của UE5

    • Error metric của phép đơn giản hóa còn đơn giản.
    • Việc đơn giản hóa Meshlet còn đơn giản.
    • Không có occlusion culling 2 giai đoạn.
    • Không có hàng đợi công việc trong shader.
    • Không có cơ chế loại bỏ và streaming các LOD không dùng trong VRAM.
    • Không có visibility buffer.
    • Không có shadow/multiview tích hợp.
    • Không thể xử lý nhiều đối tượng khác nhau.
    • Không có GPU profiler.

  • Ý nghĩa của hàng tỷ tam giác

    • Mesh dày đặc có thể ảnh hưởng xấu đến hiệu năng.
    • Số lượng instance lớn tiêu thụ nhiều VRAM.
    • Cách sắp xếp cảnh ảnh hưởng đến hiệu năng.

  • Những điểm đáng ngạc nhiên về Nanite

    1. Mục tiêu của DAG không phải là dùng ít tam giác hơn cho các đối tượng ở xa.
    2. Thời gian dành cho culling và xử lý Meshlet còn nhiều hơn cả bản thân Nanite.
    3. Phân cấp LOD Meshlet hoạt động dễ dàng.
    4. Nếu mesh không được đơn giản hóa gọn gàng thì hiệu năng sẽ giảm.

  • Đơn giản hóa mesh

    • Có thể phát sinh nhiều vấn đề trong quá trình đơn giản hóa.
    • UE5 dùng mã đơn giản hóa mesh riêng của mình.

  • Error metric

    • Việc chọn Meshlet phù hợp là cốt lõi của Nanite.

  • Có nên tự viết triển khai Nanite không?

    • Dùng UE5 là cách đơn giản nhất.
    • Với mục đích học tập thì đáng để tự triển khai.

  • Giá trị của Meshlet backface cone culling

    • Hiệu quả với mesh dày đặc.
    • Có thể trùng lặp với occlusion culling.
    • Có thể gây giảm hiệu năng do lời gọi WebAssembly.

Tóm tắt của GN⁺

  • Nanite WebGPU là một dự án thú vị triển khai Nanite trong trình duyệt web.
  • Tối ưu hiệu năng thông qua nhiều kỹ thuật culling và trình raster hóa phần mềm.
  • So với UE5, có khác biệt ở phần đơn giản hóa và error metric.
  • Phù hợp để tự triển khai nhằm mục đích học tập, nhưng trong dự án thực tế thì dùng UE5 có thể tốt hơn.
  • Một dự án có tính năng tương tự là Nanite của Unreal Engine 5.

Bài viết liên quan

1 bình luận

 
GN⁺ 2024-09-06
Ý kiến trên Hacker News

  • Bản triển khai Nanite của bên thứ ba khá thú vị

    • Nanite là một cách rất thông minh để biểu diễn mesh đồ họa
    • Các phần lặp lại được xử lý bằng liên kết, và có thể chia sẻ submesh một cách đệ quy
    • Hỗ trợ mức độ chi tiết bên trong mesh, nên các submesh nhỏ sẽ bị loại bỏ
    • Có thể render nhanh nội dung lặp lại ở quy mô lớn với ít dữ liệu
    • Thiết kế GPU hiện tại không phù hợp với Nanite, và cần thêm công việc phần cứng mới
    • Demo Unreal Engine cho thấy một cảnh sử dụng lặp đi lặp lại cùng một bức tượng
    • Việc tạo mesh Nanite khá phức tạp, và hiện tại chỉ có thể làm bằng editor của Unreal Engine
    • Các offset nội bộ của định dạng có thể tạo ra bề mặt tấn công

  • Bevy cũng có Virtual Geometry triển khai ý tưởng của Nanite

    • Tác giả của Bevy có thể trực tiếp trả lời câu hỏi
    • Scthe đã đóng góp vào việc cải thiện mã của Bevy

  • Việc demo dùng chuỗi user-agent để quyết định khả năng tương thích là không tốt

    • Khả năng tương thích tính năng nên được phát hiện và sử dụng riêng lẻ
    • Tôi đang dùng Chromium và thường xuyên dùng WebGPU, nhưng demo lại yêu cầu Chrome

  • WebGPU không hoạt động trên iPhone 12 Pro Max

    • Đã bật WebGPU trong các tính năng thử nghiệm, nhưng nó vẫn hoạt động trên các website khác
    • Giá mà ứng dụng web cung cấp thêm thông tin về nguyên nhân thất bại

  • Đã cần có sự thỏa hiệp để xử lý việc WebGPU thiếu atomic 64-bit

    • Trên phần cứng cấp desktop, tính năng này gần như được hỗ trợ phổ biến

  • Tên gọi và mô tả gây nhầm lẫn, và có thể vi phạm nhãn hiệu

    • Nó thực ra không liên quan đến Nanite thật, và được triển khai bởi người không liên quan đến UE5
    • Virtual Geometry của Bevy có thể hữu ích hơn

  • So sánh hệ thống LOD của các engine khác nhau

    • Godot cung cấp LOD tự động
    • Unity yêu cầu tạo model LOD thủ công
    • NeoAxis có cách tiếp cận thú vị nhưng hiệu năng không tốt
    • Unreal vượt trội khá xa trong việc hiển thị nhiều đối tượng trên màn hình

  • Đã đọc một cuộc thảo luận thú vị trên diễn đàn three.js về việc triển khai virtual geometry

    • Phần bàn luận về triển khai đồ họa web và các đánh đổi rất thú vị

  • Có câu hỏi về tuyên bố rằng software rasterizer nhanh hơn hardware rasterizer

    • Mục đích của GPU là tăng tốc rasterization
    • Điều này khó hiểu trừ khi software rasterizer chạy trên GPU

  • Gặp lỗi WebGPU khi chạy demo jinx trên M2 Max

    • Xuất hiện thông báo lỗi: "Fill size (7398781) is not a multiple of 4 bytes"