A Contributor’s Story with Soham Parekh
The “Contributor’s Story” series is designed to give our key open source contributors and community members a face and voice, an overview of the projects they are working on, and the successes and challenges that contributors face in developing it facing.
In this blog post, we’ll be talking to Soham, a WebXR employee who is working on creating immersive AR / VR samples with WebXR media layers through the Major League Hacking (MLH) Fellowship.
“I’ve found that the best way to get better at software development is not just to practice it, but to use it to solve real-world problems.”
Tell us a little about yourself and your current experiences in the MLH Fellowship.
I’m a software developer, currently in my senior year, creating open source projects and writing about software development, competitive coding, machine learning, cybersecurity, and information security awareness. I’m also the founder and senior supervisor of Devstation, a nonprofit that aims to encourage startups and organizations to adopt open source technology.
I first got to know the MLH scholarship through a previous scholarship holder who worked with Jest as part of his scholarship. A few months ago I created a feature request for a Jest plugin for Puppeteer to introduce video recording for the tests. Knowing that I can contribute to the scholarship in exciting settings like Jest that solve real-world problems really caught my attention.
Where did you first hear about open source? How did you come to use / contribute?
I came into contact with open source through the speech-to-code engine called Dragonfly. Since then I have been an active contributor to the Cloud Native Computing Foundation for several years. However, my first formal introduction to open source was in a program similar to the MLH Fellowship called the Google Summer of Code. There I worked with the Wikimedia Foundation as part of the Release Engineering Team and I absolutely fell in love with the open source community.
Describe the project you are currently working on.
For the scholarship, I am working with Zhixiang Teoh to create immersive AR and VR samples on the web that incorporate the WebXR layers specification, especially with the WebXR media layers. The WebXR media layer specification makes creating and interacting with the video layers in a virtual environment not only more performant, but also sharper, reducing the dependency on the CPU and using the GPU in a fairly efficient way.
We paid particular attention to achieving these implementations through an existing library such as Three.js, which makes it relatively easy to connect to the browser’s WebGL and WebXR API by abstracting it through helper classes and functions. In particular, our goals for the scholarship were to create examples showing how multiple media layers with different 3D properties (equiangular, square or cylindrical) can be created and to link controller interactions with them, such as: B. fluid resizing, a toolbar for video playback / pause and playback as well as moving the levels in the virtual 3D space.
How did you initially deal with the topic?
We were fortunate to have some reference implementations that the previous Fellows had been working on, but the existing code wasn’t really the best way to do it. The code samples were in the form of a single file, which made it quite complicated to step through the code.
Our first step was to modularly migrate the existing code examples and use as many abstractions from Three.js as possible so that future viewers of the code would have an easier time following it. We also commented well on the code and added support for “Snowpack” to take advantage of the support for ES modules.
What obstacles or problems have you been confronted with in your contribution so far?
One of the biggest obstacles we’ve had in our post so far is that the WebXR layers are a relatively new feature recently added to the WebXR world. WebXR itself is particularly new to its field, and while browser support for immersive web experiences has increased steadily, many things required a thorough understanding on our part in other areas of the WebXR API specification itself. This has been quite a challenge since the specification should serve as a reference for browser implementers. However, the process was very exciting as it got to grips with many of the things that work under the hood of a browser that make for an immersive experience on the web.
What is the current state of development?
As the scholarship is nearing its end, we achieved most of the results with a well-commented code. We are currently working on refining the existing code, filtering out potential bugs, adding documentation for reservations and workarounds that we’ve built in, and making the code more powerful where we can.
What have you learned about the project, development or open source so far?
The last time I worked with Three.js was two years ago with the primary goal of learning while creating my personal website. Since looking into the Three.js implementation of the native WebGL and WebXR APIs became a recurring trend, working with WebXR as part of the scholarship gave me the opportunity to explore Three.js much deeper. I am now confident of contributing to Three.js and the Immersive Web community and am ready to dive deep into complicated code bases.
A key experience that I particularly appreciate at the end of the scholarship is getting to know and working with Teoh. I tend to develop too much, and Teoh has always been helpful in keeping track of things without spending too much time refining a feature and taking breaks when necessary. I’ve learned that quick pair programming sessions are a great way to work on complicated tasks and get to know your fellow developers.
Overall, I am very satisfied with the contribution to open source and the knowledge that our examples will serve as a reference for future implementations of the layer specification.
What advice would you give future contributors to the open source project?
WebXR looks more intimidating than it actually is. I think the best way to do this is to read the MDN Web Docs on the WebXR specification first and then read the official WebXR API specification. The official WebXR specification is intended for browser torturers. This makes it easy to get lost. The idea is to only use this specification to better understand the related MDN documentation.
Three.js does an excellent job with WebGL. Using the abstractions from Three.js really helped us to work with WebGL and WebXR APIs with relative ease. 1
Halfway through the community, we discovered another such frame called the A-Frame. A-Frame makes working with immersive experiences on the web easier, and I highly encourage future contributors to take a look.
We’d like to thank Soham for their continued contributions to the Facebook open source ecosystem. You can follow Soham’s work through his website, GitHub, and LinkedIn.
To learn more about Facebook Open Source, follow us on Twitter, Facebook, and YouTube for relevant updates, and visit the WebXR website to get started. We also recently sponsored Open Web Docs where we hope to do our part in continuing the MDN tradition of providing high quality web documentation on a variety of technologies, including XR.