Giter Club home page Giter Club logo

learnwebgpu's Introduction

Learn WebGPU

This is the source files of the website https://eliemichel.github.io/LearnWebGPU.

Building

Building the website requires Python.

  1. It is recommended, but not mandatory, to set up a virtual Python environment:
$ virtualenv venv
$ venv/Scripts/activate
  1. Then install Python packages
pip install -r requirements.txt
  1. And finally build the website by running:
make html
  1. To build the source code defined by Sphinx Literate, run
make tangle

Contributing

To help this project, you can:

learnwebgpu's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

learnwebgpu's Issues

`wgpuQueueOnSubmittedWorkDone`'s signature is not matching with that is in webgpu.hpp

Im working through the tutorial and on https://eliemichel.github.io/LearnWebGPU/getting-started/the-command-queue.html
the call to wgpuQueueOnSubmittedWorkDone takes 3 arguments. However, this does not compile and the header file specifies that there has to be a uint64_t signalValue argument there. I can compile it if I just pass a number there but I don't know what that needs to be

wgpuQueueOnSubmittedWorkDone(queue, 0, onQueueWorkDone, nullptr);

Update favicon module name in config

Thanks for using Sphinx Favicon in your project! I just released version 1.0 of the extension, which brings one breaking change: to better conform with Python standards, we changed the module name to sphinx_favicon (instead of sphinx-favicon). This means you'll have to update your conf.py file to use version 1.0. Otherwise, your existing configuration should continue to work!

Hint about descriptor lifetime earlier

From peterkennard on Discord:

So, I am taking a sample step054 ( animating pyramid ) and integrating it with a test program.

One thing it does not illustrate is the scope of all the various objects since they are ALL declared inside the big main()

I created a class TestApp() and divided it into

init();
renderFrame(); // called in a loop
releaseResources(); when done

and just for now, I put all the objects that were on the stack and made them members of the class.
This all works fine, but the lifecycle scope of the various objects is not really hinted at in the sample.
I know many of the "initialization structures" can be discarded after the object is created so in my code I often put them in blocks unless one can use the enclosing method as the scope. But when everything is in a giant main it sort of obscures the need to keep some things around or referenced.

main() {
{
InitStruct is{};
...
objectHandle = createObject(is);
}
...
{
// another one
}

Anyway - I have found the the WebGPU guide and the associated code quite well done. Thanks for creating it!
PK

This kind of refactoring happens in step080, but maybe it is a bit too late, or at least I should give hints about it earlier indeed!

Memory leaks galore

None of your demo's are without memory leaks (starting with the texturing). Not sure if it's Vulkan related, but it seems to be related the swapchain and texturing. Just do a profile with visual studio or just look at you task manager and wonder why a triangle takes 1GB of memory.

Clarify resource management in emscripten chapter

From Delhills on Discord:

Does anyone know how to load the files (shaders, meshes, ...) from emscripten (or have any resource where it's explained)? I tried to follow Élie's CMakeLists code in step 95 but I don't quite understand it and it doesn't work 😟

In case someone has the same problem as me when using emscripten, if you add "--preload-file "${CMAKE_CURRENT_SOURCE_DIR}/resources" in target_link_options inside CMakeLists then remove the "-d build-web" in the command to run the server (python -m http.server) and then access the url "localhost:8000/build-web/App.html" and it should work

(I'm going to fix this thx! Also I'm considering putting the emscripten part much earlier in the main part of the guide)

Build with GLFW Wayland

In the "Opening a window" chapter, it is provided a minimal example of opening a window with GLFW.

On Linux, GLFW uses X11 by default, but it's possible to compile the project with Wayland enabled. The following is necessary to achieve this:

  1. Set GLFW_USE_WAYLAND option when creating the build folder: cmake . -B build -D GLFW_USE_WAYLAND=1;
  2. add glfwMakeContextWindow(window); after if (!window) { /* error hanling */ };
  3. add glfwSwapBuffers(window); inside the main loop (while (!glfwWindowShouldClose(window)) { /* loop contents*/ }, usually it's before glfwPollEvents(););

That's it. The official example from the documentation is an ideal minimal code that works both in X11 and Wayland: https://www.glfw.org/documentation.html.

I felt it was important to bring this to attention because of many news on Linux ecosystem:

Assert fails in requestAdapter

I am following the tutorial on my windows laptop and in the https://eliemichel.github.io/LearnWebGPU/getting-started/the-adapter.html in requestAdapter function its mentioned that we should wait for onAdapterReady before doing the assert but we do it immediately anyway.

     // In theory we should wait until onAdapterReady has been called, which
    // could take some time (what the 'await' keyword does in the JavaScript
    // code). In practice, we know that when the wgpuInstanceRequestAdapter()
    // function returns its callback has been called.
    assert(userData.requestEnded);

However, this assert is firing for me with this warning:

Warning: Disable Intel Vulkan adapter on Windows driver version 100.6911. See https://crbug.com/1338622.
 - While initializing adapter (backend=BackendType::Vulkan)
    at InitializeImpl (C:\Users\gauta\Codes\wgpu\build\_deps\dawn-src\src\dawn\native\vulkan\PhysicalDeviceVk.cpp:107)
    at Initialize (C:\Users\gauta\Codes\wgpu\build\_deps\dawn-src\src\dawn\native\PhysicalDevice.cpp:35)

Assertion failed: userData.requestEnded, file C:\Users\gauta\Codes\wgpu\main.cpp, line 41

If I remove the assert I can enumerate the features of the adapter, which I am assuming means I am getting the adapter:

Hello world!
WebGPU instance: 000002A2AE3F1B60
Warning: Disable Intel Vulkan adapter on Windows driver version 100.6911. See https://crbug.com/1338622.
 - While initializing adapter (backend=BackendType::Vulkan)
    at InitializeImpl (C:\Users\gauta\Codes\wgpu\build\_deps\dawn-src\src\dawn\native\vulkan\PhysicalDeviceVk.cpp:107)
    at Initialize (C:\Users\gauta\Codes\wgpu\build\_deps\dawn-src\src\dawn\native\PhysicalDevice.cpp:35)

Got adapter: 000002A2B11A29A0
Adapter features:
 - 5
 - 1
 - 2
 - 8
 - 10
 - 11
 - 1002
 - 1004
 - 1007
 - 1008
 - 1009

I tried to find where that onAdapterReady callback is to be passed. But I couldn't find it on google. Can you please include how to pass it?


Additionally when setting up the tutorial the step that installs the dawn-src didn't work for me. I went into the folder and manually ran the git clone commands mentioned in the cmake files to make it work.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.