Performance Optimizations for JavaScript Games

Make your games and animations run faster. Build a game with me and learn how to manage memory allocation better with object pool design pattern. Create detailed animated games that run smoothly even on the oldest machines. Object pool design pattern explained line by line and implemented in a 2D game development project.

Check out some of my EXTENDED classes with BONUS lessons and more free 2D game art assets
🌟Udemy: https://www.udemy.com/course/build-animated-physics-game-with-javascript/?referralCode=B4482AF631243104650B
🌟 Skillshare (free 1 month trial that includes all my extended classes including this one):
https://www.skillshare.com/en/r/profile/Frank-Dvorak/507488567?gr_tch_ref=on&gr_trp=on

This project is beginner friendly. Basic knowledge of HTML, CSS & JavaScript is needed to get the maximum value.

🎨 Download Project Art assets 🎨
** All art assets for this class were made by me or by artists I hired, there is NO copyright, you can download and use these freely for any project you want! Click the LIKE on the video if you want more free game art soon! 😀
Background: https://www.frankslaboratory.co.uk/downloads/113/bg1.png
Asteroid: https://www.frankslaboratory.co.uk/downloads/113/asteroid.png

Bonus images, environmental art, HQ separate pieces in PSD format etc:

Today we will learn:
– How to implement object pool design pattern
– How to draw, animate and rotate objects on HTML5 canvas element
– How to apply object oriented programming principles to keep code well organised and easy to read.

For more vanilla JavaScript GAME DEVELOPMENT check out this playlist:
https://youtube.com/playlist?list=PLYElE_rzEw_uryBrrzu2E626MY4zoXvx2

⭐️Tutorial Contents ⭐️
00:00 Make animated games with JavaScript
00:47 What is the advantage of object pool design pattern?
03:49 Object oriented code structure
05:10 Game class
08:54 Asteroid class
12:06 Object pool array
17:43 How to draw images on canvas
20:38 How to animate multiple HTML5 canvas objects
22:00 Periodic triggers with requestAnimationFrame
27:56 Object pool design pattern
35:28 Tips & Tricks
37:58 How to rotate images with HTML5 canvas

Let’s be friends
👍 You can message me on TWITTER https://twitter.com/code_laboratory
👍 Check out some of my source code on CODEPEN https://codepen.io/franksLaboratory

The description of this video may contain affiliate links, which means that if you buy one of the products that I recommend, I’ll receive a small commission without any additional cost for you. This helps to support the channel and allows me to continue making videos like this. Thank you for the support!
#frankslaboratory