Rendering a Triangle with Vulkan and JavaScript #1

A Triangle rendered with Vulkan

Prerequisites

BigInt

ArrayBuffer

  • ArrayBuffer.prototype.getAddress: This allows to take the address of an ArrayBuffer which is represented using a BigInt (as described above)
  • ArrayBuffer.fromAddress: This method takes two parameters. The 1st parameter is the memory address which you want the ArrayBuffer to start “reading” from. The 2nd parameter is the byteLength of the ArrayBuffer

ES6 Modules

Installation

Code Reference

#1 Setup Phase

#2 Creating an Instance

  • You create a handle
  • Create and fill a “createInfo” Object to specify settings for that handle
  • Then pass that handle, together with the settings into a “create” function

#3 Retrieve available GPUs

  • Create an In-Out Object (making a Primitive referenceable) to get the amount of handles that we have to instantiate
  • Call the enumeration function to update our In-Out Object
  • Create and fill an Array based on the In-Out Object’s “$” value
  • Call the enumeration function a second time, but this time with our Array of VkPhysicalDevices and the In-Out Object

#4 Print GPU Device Names

#5 Picking a GPU

#6 Creating a Surface

Still curious?

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store