Performance Optimizations in 2D Games

แชร์
ฝัง
  • เผยแพร่เมื่อ 24 ธ.ค. 2024

ความคิดเห็น • 62

  • @Frankslaboratory
    @Frankslaboratory  ปีที่แล้ว +29

    You asked for performance optimization techniques, so I did it, any other requests?

    • @CharlotteAndCode
      @CharlotteAndCode ปีที่แล้ว +1

      Go from one level to another.

    • @starscorpion8044
      @starscorpion8044 ปีที่แล้ว +1

      Make a raycasting engine please 🙏🏻

    • @babicunlo3638
      @babicunlo3638 ปีที่แล้ว +2

      select & drag & drop efficiently within canvas

    • @time4062
      @time4062 ปีที่แล้ว

      🎉🎉🎉thanks bro

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว

      @@CharlotteAndCode Good idea

  • @rishabhsinghal6120
    @rishabhsinghal6120 ปีที่แล้ว +1

    Your channel is extremely beginner friendly, and your explanations are very good. Please bring out more such cool videos on these useful topics

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว +1

      Hi Rish. Happy to hear. I'm working on more 2d gamedev projects now. New tutorials will come soon

  • @damelux3798
    @damelux3798 ปีที่แล้ว +1

    Oh yeah !
    We asked, and he delivered

  • @felipexcavalcante
    @felipexcavalcante ปีที่แล้ว

    Great tutorial! I will practice that.

  • @Radu
    @Radu ปีที่แล้ว +1

    Nice work!

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว +1

      Thank you master coder! :)

    • @Radu
      @Radu ปีที่แล้ว

      @@Frankslaboratory You're welcome creative guru! :-)

  • @mbuyelohlebela8320
    @mbuyelohlebela8320 ปีที่แล้ว

    Hello Frank, can you go into detail about polymorphism if possible, lets say for example you have an enemy class using inheritance you create e.g. Aliens, zombies etc. Instead of having an array that updates each type of enemy, use a Enemy Array. I am really interested in what upcasting and down casting in JavaScript looks like.
    Really enjoy your content

  • @MrGilsteiner
    @MrGilsteiner ปีที่แล้ว +1

    Frank, I'd appreciate your opinion about canvas render libraries. I'm facing real woes with Pixi. The latest version is seriously lacking in some very basic aspects. In your experience, is it realistic to go for a engine you build yourself, or just look for another library, e.g MelonJS?

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว +4

      Hi, I'm not up to date with the latest features of these libraries so I don't really know which one is the best. My advice would be to get as familiar as possible with vanilla JS, because then it becomes easy to supplement whatever shortcomings the library has, with your own custom code and then achieve the final result you want that way.

  • @abhishekshrestha2319
    @abhishekshrestha2319 ปีที่แล้ว

    Best channel on youtube❤❤❤❤

  • @gflaap
    @gflaap ปีที่แล้ว +4

    Amazing as always Frank. Do you have a complete Tutorial for this Game?

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว +7

      Hi, the space game I'm showing a gameplay of will be released if people like this video, I have all the code but haven't recorded it yet. If people like it I will flesh it out more, more enemy types, environments etc, as usual.

    • @gflaap
      @gflaap ปีที่แล้ว +2

      @@Frankslaboratory hi Frank, you Need to Release this Tutorial / Series! This is a awesome work! Mayen you can also Release it on Udemy - i would definiteley Subscribe and Pay for it .
      BR fron Germany

  • @yawn8974
    @yawn8974 ปีที่แล้ว

    great tutorial, thanks!!

  • @ifeoluwatemidayo3959
    @ifeoluwatemidayo3959 ปีที่แล้ว

    Good day Frank,pls can you make a video on how to create game asset like Sprite image and audio sound for game. I tried learning this but I keep making mistake

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว +1

      I draw a rough sketch and then have a professional artist draw polished art for me usually. I instruct them what parts need to be separate pieces so I can animate movement and then I use free Dragonbones software to attach it to a skeleton and animate it myself, to create a sprite sheet. I give art in separate pieces in .psd format with my gamedev videos so you can try to make your own animations with it if you want. It takes a while to learn though.

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว

      I will cover how to generate simple game sounds in browser with web audio api soon

  • @time4062
    @time4062 ปีที่แล้ว

    I made it on my computer and now waiting for the next

  • @CharlotteAndCode
    @CharlotteAndCode ปีที่แล้ว

    I'm making a game, and it has five levels, but first I must make the framework for it, so if the player wins a level, they automatically go to another level, but if they lose, they have to replay the level. Once the player wins all 5 levels, they can restart. So far, I've created a level manager class. Any advice?

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว +1

      Nice. I would probably use state management design pattern. How did you design your level manager?

    • @CharlotteAndCode
      @CharlotteAndCode ปีที่แล้ว

      @@Frankslaboratory I'm working on redesigning it. So far it is something like this: export class LevelManager {
      constructor(width, height){
      this.width = width;
      this.height = height;
      this.level = 1;
      this.levels = [new Level1(this.width,this.height),
      new Level2(this.width,this.height),
      new Level3(this.width,this.height),
      new Level4(this.width,this.height),
      new Level5(this.width,this.height),
      ];
      this.currentLevel = this.levels[this.level - 1];
      this.gameStart = false;
      this.gameOver = false;
      this.button = document.getElementById('play-button');

      }


      update(deltaTime) {
      this.currentLevel = this.levels[this.level - 1];
      this.currentLevel.update(deltaTime);
      if(!this.gameOver && this.currentLevel.isCompleted() && this.currentLevel.levelOver) {
      this.gameStart = false;
      if(this.level < this.levels.length){
      this.level++;
      }
      } else {
      this.currentLevel.update(deltaTime);
      }
      }


      draw(context) {
      this.currentLevel = this.levels[this.level - 1];
      if(this.level

  • @alwaysquestionyouropinions1119
    @alwaysquestionyouropinions1119 ปีที่แล้ว

    This is great and very interesting 👍

  • @Coding_Asmr_PraDev
    @Coding_Asmr_PraDev ปีที่แล้ว

    Love your work brother❤

  • @javifontalva7752
    @javifontalva7752 ปีที่แล้ว

    unbe-fu**-lievable. I take my off hat. That was terrific!!!

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว

      I thought people might like a topic like this, if it's popular I will do classes on more techniques. I have a lot to talk about when it comes to performance optimization :)

  • @RomanKnav
    @RomanKnav ปีที่แล้ว

    great tutorial as always Frank! where can I find the source code?

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว +1

      Hi Roman, I didn't release the source code, it's a very simple project, I might release it with the full series in an extended class. Still adding projects in this series of videos

  • @sikkandarmansuri2187
    @sikkandarmansuri2187 ปีที่แล้ว

    second part plz

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว

      Coming soon, I kept adding features, so not sure what I will do with this series. I got a lot of ideas I want to apply and teach on this project.

  • @thiagohe87
    @thiagohe87 ปีที่แล้ว

    Muito bom, conseguir fazer e entender tudo. Obrigado por comparilhar conhecimento. Thanks

  • @fr1endsies
    @fr1endsies ปีที่แล้ว

    my deltaTime = 2.7ms 😶 Thank you for another great video Frank! Much appreciated!

    • @Frankslaboratory
      @Frankslaboratory  ปีที่แล้ว

      You must be using ultra fast gaming screen, right?

  • @drharunttt.9884
    @drharunttt.9884 ปีที่แล้ว

    good

  • @DocBobD
    @DocBobD ปีที่แล้ว

    Legendary

  • @MadaraAzukar
    @MadaraAzukar ปีที่แล้ว +1

    🎉

  • @time4062
    @time4062 ปีที่แล้ว

    Second part

  • @tothebone4613
    @tothebone4613 ปีที่แล้ว

    as awlays amazing

  • @Intellectualmind4
    @Intellectualmind4 ปีที่แล้ว

    🎉🎉🎉🎉

  • @laserak9887
    @laserak9887 10 หลายเดือนก่อน

    144hz screens here.