Using the Gamepad API for a better gaming experience on the web

Slides for my JavaScript and Friends Conference 2020 talk.

This talk explores the usage and impact of the Gamepad API in the web gaming space. The Gamepad API lets you connect and use various gaming controllers with browsers, but since this API is in very early stages, tracking different controller inputs across browsers becomes extremely challenging.

For this very purpose I have released an open source library which provides support for button press, axis movement events as well as vibration play effect in browsers. We’ll be focusing on how we can leverage this library for providing better gaming experiences to consumers on the web.

Transcript

1. Using the Gamepad API for a better gaming experience on the web Arun Michael Dsouza arunmichaeldsouza.com
 @amdsouza92 JavaScript and Friends 2020
2. github.com/arunmichaeldsouza
3. The Web Platform
4. Image source: freepik.com
6. Image source: nocookie.net
7. Image source: mobilefreetoplay.com, windowscentral.com
8. Gamepad API bit.ly/gamepad_api
9. Image source: freepik.com
10. Image source: caniuse.com
12. Gamepad Interface bit.ly/gamepad_interface
15. Standard Gamepad Layout
17. Events?
18. bit.ly/gamepad_connected_event
19. bit.ly/gamepad_disconnected_event
23. Image source: red-gate.com/
24. Image source: hacks.mozilla.org
25. bit.ly/javascript_layout_thrashing
26. requestAnimationFrame( )
28. The Game Loop
29. Image Source: mozdevs.github.io bit.ly/anatomy_of_a_videogame
37. bit.ly/joypad_js
38. Connect/Disconnect
39. Button Press/Axis Movement
40. Button Press/Axis Movement
41. Vibration Effect
42. Settings
43. Browsers Support
45. bit.ly/joypad_js
46. arunmichaeldsouza.com/blog/web-platform's-hidden-gems-(series) arunmichaeldsouza.com/blog/using-joypad.js-for-a-better-gaming- experience-on-the-web arunmichaeldsouza.com/blog/web-platform's-hidden-gems--- gamepad-api Further Reading
47. Thank you Arun Michael Dsouza arunmichaeldsouza.com
 @amdsouza92 JavaScript and Friends 2020