April 7 - 8, 2022
JS GameDev Summit
Online

JS GameDev Summit 2022

All Stars GameDev and Graphics on the Web

JS GameDev Summit is a 2-day online event for engineers, technical artists, creative developers who develop games and graphics heavy application with Web technology. Get the latest updates from graphics engines crews, game development case studies and best practices and much more.

This edition of the event has finished, the latest updates of this JavaScript Conference are available on the Brand Website.
Optimizing HTML5 Games: 10 Years of Learnings
33 min
Optimizing HTML5 Games: 10 Years of Learnings
Top Content
Watch video: Optimizing HTML5 Games: 10 Years of Learnings
PlayCanvas is an open-source game engine used by game developers worldwide. Optimization is crucial for HTML5 games, focusing on load times and frame rate. Texture and mesh optimization can significantly reduce download sizes. GLTF and GLB formats offer smaller file sizes and faster parsing times. Compressing game resources and using efficient file formats can improve load times. Framerate optimization and resolution scaling are important for better performance. Managing draw calls and using batching techniques can optimize performance. Browser DevTools, such as Chrome and Firefox, are useful for debugging and profiling. Detecting device performance and optimizing based on specific devices can improve game performance. Apple is making progress with WebGPU implementation. HTML5 games can be shipped to the App Store using Cordova.
Building Fun Experiments with WebXR & Babylon.js
33 min
Building Fun Experiments with WebXR & Babylon.js
Top Content
This Talk explores the use of Babylon.js and WebXR to create immersive VR and AR experiences on the web. It showcases various demos, including transforming a 2D game into a 3D and VR experience, VR music composition, AR demos, and exploring a virtual museum. The speaker emphasizes the potential of web development in the metaverse and mentions the use of WebXR in Microsoft products. The limitations of WebXR on Safari iOS are discussed, along with the simplicity and features of Babylon.js. Contact information is provided for further inquiries.
Making Awesome Games with LittleJS
34 min
Making Awesome Games with LittleJS
Top Content
Little.js is a super lightweight and fast JavaScript game engine that has everything included to start making games right away. It has a tiny footprint and no dependencies, making it perfect for size-coding competitions like JS13K. Little.js is built with an object-oriented structure and comes with several classes. It provides a fast rendering system, a comprehensive audio system, and various starter projects for different game types. Little.js is designed to be simple and easy to understand, allowing you to look at and modify the code.
Web 3 Gaming: What it is and Why it Matters
36 min
Web 3 Gaming: What it is and Why it Matters
Web3 gaming enables decentralized identity and finance, allowing game developers to bypass centralized platforms. It is driven by wallets, ERC20 tokens, and NFTs. Web3 games focus on collaborative world-building, ownership, and open-source collaboration. The challenge is achieving decentralization while addressing economic and technological limitations. Web3 aims to redefine the gaming industry by using economic tools and exploring new genres like RPG and RTS games.
Unreal Engine in WebAssembly/WebGPU
33 min
Unreal Engine in WebAssembly/WebGPU
Top Content
Alex Saint-Louis, co-founder of Wunder Interactive, shares the mission of bringing Unreal Engine to the browser, enabling cross-platform 3D applications and games. They are working on a WebGPU back end for Unreal Engine to push the limits of 3D on the web. Wunder Interactive has improved compression, built their own asset file system, and offers powerful tools for game developers. They are utilizing modern web technologies like WebAssembly, WebGL, and WebGPU, and plan to support other engines like Unity and Godot. The team aims to transform the industry by bringing console-quality games to the browser and providing an alternative distribution path. They are excited to bring Unreal Engine 5 to the web with WebGPU support and are working on WebXR support for cross-platform 3D experiences, including VR.
How to make amazing generative art with simple JavaScript code
165 min
How to make amazing generative art with simple JavaScript code
Top Content
WorkshopFree
Frank Force
Frank Force
Instead of manually drawing each image like traditional art, generative artists write programs that are capable of producing a variety of results. In this workshop you will learn how to create incredible generative art using only a web browser and text editor. Starting with basic concepts and building towards advanced theory, we will cover everything you need to know.
Making Multiplayer Games with Colyseus, Node.js and TypeScript
31 min
Making Multiplayer Games with Colyseus, Node.js and TypeScript
Top Content
Today's Talk covers making multiplayer games with Coliseus, Node.js, and Typescript. It explores the state of networking on the web, alternative servers, and how Coliseus works. The Talk also discusses client-side prediction, lag compensation, server limitations, scaling, and showcases cool games made with Coliseus. Additionally, it mentions Nakama and Unity integration for client-side prediction in multiplayer games. Coliseus is available on mobile and can be found on colossus.io or the GitHub repository.
Detect and Avoid Common Performance and Memory Issues in Unity WebGL Builds
10 min
Detect and Avoid Common Performance and Memory Issues in Unity WebGL Builds
Top Content
Today's Talk focuses on avoiding performance and memory issues in Unity WebGL builds. The importance of managing memory and keeping the heap size small is highlighted. Techniques such as using asset bundles or an addressable system can help reduce memory usage. The limitations of garbage collection in WebGL builds are discussed, along with tips for optimizing Unity code. Tools like Backtrace can assist in debugging memory and performance issues.
Making “Bite-Sized” Web Games with GameSnacks
33 min
Making “Bite-Sized” Web Games with GameSnacks
Top Content
Welcome to making bite-sized games with GameSnacks, a platform that focuses on optimizing game sizes for easy accessibility on the web. Techniques such as lazy loading, script placement, and code and art optimization can greatly improve game performance. Choosing the right file formats, reducing game size, and using game engines or custom tools are important considerations. Prioritizing file size, testing internet connections, and using testing tools for accurate simulation can help attract more users and improve game retention and reach.
Extending Unity WebGL With Javascript
32 min
Extending Unity WebGL With Javascript
Top Content
Unity targets over 25 platforms and technologies, including desktop, mobile, and virtual reality. They use Emscripten to compile the engine and game logic into WebAssembly for web development. Unity can be extended with plugins to access browser features like WebXR's augmented reality mode. The speaker demonstrates intercepting Unity's calls to the browser to modify its behavior. Unity is actively working on mobile support for web export and improving documentation for extending Unity with web plugins.
PlayCanvas End-to-End : the quick version
121 min
PlayCanvas End-to-End : the quick version
Top Content
WorkshopFree
João Ruschel
João Ruschel
In this workshop, we’ll build a complete game using the PlayCanvas engine while learning the best practices for project management. From development to publishing, we’ll cover the most crucial features such as asset management, scripting, audio, debugging, and much more.
Choosing a Game Engine or Framework for HTML Game Development
25 min
Choosing a Game Engine or Framework for HTML Game Development
Top Content
Watch video: Choosing a Game Engine or Framework for HTML Game Development
Welcome to the Web Game Dev Summit where game engine options for web-based games are explored. Native and compiled development approaches are discussed, with off-the-shelf engines like Unity and HTML5-specific engines as options. Godot Engine is highlighted as an open source engine with strong web support. Traditional game engines like Default, GameMaker Studio, and Babylon.js are mentioned, along with frameworks like PhaserJS and Cocos2DJS. JavaScript libraries for game development, audio support options, and considerations for choosing the right engine are also covered.
Multiplayer Web Games Using JavaScript
34 min
Multiplayer Web Games Using JavaScript
Today's Talk is about creating a multiplayer web game using Phaser and Socket.io. The speaker demonstrates how to create a tic-tac-toe game, including creating the table, assigning players, making moves, and determining the next turn. The importance of choosing the right protocol for multiplayer games, such as WebSocket or UDP, is discussed. The Talk also highlights the advantages of using JavaScript for web and mobile games, as well as considerations for network code and code availability.
So You Want to be an Indie Game Developer?
30 min
So You Want to be an Indie Game Developer?
This talk provides insights and advice for aspiring indie game developers. It emphasizes the importance of game design and marketing, as well as the need to stand out in a crowded market. The speaker shares their experience with YouTube and experimenting with startups. Starting as an indie game developer requires self-motivation and a focus on strengths. The talk also highlights the challenges and opportunities in the indie game development industry, and encourages support for Ukrainian game developers.
What Can you Do with WebGPU?
9 min
What Can you Do with WebGPU?
WebGPU is an upcoming web API that provides low-level access to the GPU, offering better performance and enabling new rendering techniques. It allows for the use of compute shaders, which provide more control over memory synchronization and threading, and can be used for general computation on a GPU. WebGPU opens up possibilities for unique effects in games and promises future support for ray tracing in browsers.
The Art of Slots
10 min
The Art of Slots
Slot games have life-changing potential and should provide a secure and fun experience. Total immersion in the theme, visual effects, large wins, and celebrations enhance the player's experience. Creating engaging slot games involves using colors and subject matter to indicate value, guiding players through the game with splash screens, keypads, and buttons, and incorporating characters, animations, and themes to add fun and engagement. It is important to celebrate big wins and provide value to the player while considering their perspective and aiming to provide entertainment and value.
Conversion to Play: The Art of Loading
31 min
Conversion to Play: The Art of Loading
The Talk discusses the art of loading in web games and its impact on success. It provides tips for improving conversion to play, optimizing loading, and creating a clear path to play. Examples of games that improved loading are showcased. The importance of file size and designing games with it in mind is highlighted. The speaker shares challenges in math and coding, as well as their experience with WebXR games and blockchain. Managing time for indie game development is also discussed.
Introduction to WebXR with Babylon.js
86 min
Introduction to WebXR with Babylon.js
Workshop
Gustavo Cordido
Gustavo Cordido
In this workshop, we'll introduce you to the core concepts of building Mixed Reality experiences with WebXR and Balon.js.
You'll learn the following:- How to add 3D mesh objects and buttons to a scene- How to use procedural textures- How to add actions to objects- How to take advantage of the default Cross Reality (XR) experience- How to add physics to a scene
For the first project in this workshop, you'll create an interactive Mixed Reality experience that'll display basketball player stats to fans and coaches. For the second project in this workshop, you'll create a voice activated WebXR app using Balon.js and Azure Speech-to-Text. You'll then deploy the web app using Static Website Hosting provided Azure Blob Storage.
Independence: The Gaming Advantage
4 min
Independence: The Gaming Advantage
Learn how to start a website on Vulture using the Vulture Marketplace or object storage for more customization. Vulture offers a wide range of products and services, including Bare Metal, Optimized Cloud Compute, Block Storage, and Load Balancers. With over 20 locations and popular operating systems, you can easily customize your website. Use code GetNation150 for $150 of free credit and contact Vulture for any inquiries.
Fire-side chat with Ahad Shams
27 min
Fire-side chat with Ahad Shams
The Talk discusses the concept of a more spatial web and the importance of open standards, privacy, and transparency in the development of WebAverse. It emphasizes the engagement with the developer community and the breakthroughs in creating high-fidelity 3D experiences on the web. The Talk also highlights the challenges of building a browser game engine and the support for VRM Fuzz and targeting creators and communities. It mentions the advantages of building 3D experiences on the web and the development of 2D based experiences.