Вступ

Що таке графічний API?

Персональний комп’ютер, або смартфон зазвичай складається з двох обчислювальних одиниць: CPU (Центральний процесор) і GPU (Графічний процесор). При програмуванні додатку в першу чергу пишуться інструкції для CPU. Для цього призначені більшість мов програмування.

CPU та GPU - це два різних процесори. Ми програмуємо CPU так, щоб він наказував GPU, що робити, за допомогою графічного API і драйвера.

Якщо хтось хоче, щоб додаток виконував інструкції на GPU (наприклад, рендерив 3D-зображення), код CPU повинен відправити інструкції до драйвера GPU. Графічний API є програмним інтерфейсом, який використовується для того, щоб CPU код комунікував з GPU.

Існує багато таких API, наприклад, ви могли чути про OpenGL, DirectX, Vulkan чи Metal.

Tip

В теорії, будь-хто може створити свій власний графічний API. Кожен виробник GPU має власний низькорівневий протокол для взаємодії драйвера із залізом, на основі якого реалізовані більш поширені API (часто надаються разом із драйвером).

У цій документації ми вивчимо графічний API, який називається WebGPU. Цей API був розроблений для забезпечення єдиного доступу до графічних процесорів, незалежно від виробника GPU та операційної системи, на якій працює програма.

WebGPU - це Інтерфейс Апаратного Забезпечення для Рендерингу, який побудований на основі різних API, що надаються драйвером/ОС залежно від вашої платформи. Ця дублююча розробка виконується один раз веббраузерами і надається нам через хедер webgpu.h.

Чому WebGPU?

🤔 Так, чому я повинен використовувати веб-API, щоб розробляти настільні додатки?

Радий, що ви запитали. Коротка відповідь:

• Прийнятний рівень абстрації

• Гарна продуктивність

• Кросплатформенність

• Стандартизованість

• Перспективність

І це насправді єдиний графічний API, який використовує всі ці властивості!

Так, WebGPU API був розроблений в першу чергу для вебсайтів, як інтерфейс між JavaScript та графічними процесорами. Це не є недоліком, оскільки на сьогодні вимоги до продуктивності вебсайтів насправді такі самі, як і для нативних додатків. Ви можете прочитати більше про те, Чому я вважаю, що WebGPU це найкращий графічний API для вивчення в 2023 році.

Note

При розробці API для вебу є два важливих обмеження: портативність та конфіденційність. Ми отримуємо тут переваги від зусиль, докладених для забезпечення портативності, і, на щастя, обмеження API, пов’язані з міркувань конфіденційності, можна відключити при використанні WebGPU, як нативний API.

Чому тоді C++?

Чи не повинні ми використовувати JavaScript, оскільки він є початковою ціллю WebGPU? Або C, бо це мова хедеру webgpu.h, який ми будемо використовувати? Або ж Rust так як це мова, на якій написаний один з бекендів WebGPU? Все це валідні мови, які можна використовувати з WebGPU, але, я обрав C++ бо:

• C++ досі є основною мовою, яка використовується для високопродуктивних графічних додатків (відеоігри, рендер-рушії, інструменти для моделювання, тощо).

• Рівень абстрації та контроль над C++ загалом добре підходять для взаємодії з графічними API.

• Графічне програмування - це дуже гарна нагода, щоб дійсно навчитися C++. На початку я буду виходити з того, що ви маєте лише дуже поверхневі знання цієї мови.

See also

Для еквівалента цієї документації мовою Rust я рекомендую вам ознайомитись з Learn WGPU від Sotrh.

Як використовувати цю документацію?

Читання

Перші дві частини цієї документації були розроблені для того, щоб читати послідовно, як повну лекцію, але окремі сторінки також можна використовувати як довідники з конкретних тем.

Розділ Початок Роботи присвячений шаблонному коду який потрібен для ініціалізації WebGPU і управлінню вікном (використовуючи GLFW), і представляє ключові концепції та ідіоми API. У цьому розділі, ми маніпулюємо сирим C API, і закінчуємо представляючи C++ обгортку, яку ми можемо використовувати в іншій частині цієї документації.

Можна перейти безпосередньо до частини 2 Базовий 3D Рендеринг і використовувати шаблонний код, який є результатом з першої частини, як початковий набір. Ви можете завжди повернутися назад пізніше до деталей з розділу початок роботи.

Рендеринг - це далеко не єдине що можна робити за допомогою GPU на сьогодні; частина 3 представляє Базове Обчислення, тобто використання WebGPU без рендерингу.

Четверта частина Просунуті Техніки складається з розділів присвячених різним технікам комп’ютерної графіки, які можна читати незалежно один від одного.

Грамотне Програмування

Warning

Цей посібник в початковій фазі; це доступно тільки для перших декількох розділів.

Посібник слідує принципу Грамотного програмування: Документація, яку ви читаєте, має коментарі, завдяки яким можна автоматично об’єднати її блоки коду в повністю робочий файл. Це спосіб переконатися, що посібник дійсно містить все необхідне для відтворення результатів.

У правій бічній панелі розділів, які підтримують цю функцію, ви можете ввімкнути/вимкнути відображення такої інформації:

Все вимкнено за замовчуванню, щоб уникнути візуального шуму, але якщо ви не знаєте, куди саме помістити конкретний фрагмент коду, ви можете їх увімкнути.

Внесок

Якщо ви виявили помилку, або більш серйозну проблему, не соромтеся виправити її, натиснувши кнопку редагування, яка знаходиться у верхній частині кожної сторінки!

Взагалі, ви можете обговорити будь-які технічні або організаційні питання через репозиторій Issues у репозиторії. Будь-які конструктивні та/або доброзичливі відгуки вітаються!

Робота в Процесі

Цей посібник досі в розробці, і сам WebGPU API також. Я намагаюсь якомога ретельніше стежити за змінами, але доки API не стабілізується, це неминуче призводить до невеликих невідповідностей.

Завжди слідкуйте за актуальністю останньої модифікації сторінки і супровідного коду (використовуй git). Вони можуть бути не ідеально синхронізовані; зазвичай я спершу оновлюю код, а потім вміст посібника.