JavaScript Event Loop -- Visualized!

Поділитися
Вставка
  • Опубліковано 24 жов 2024

КОМЕНТАРІ • 207

  • @ColorCodeio
    @ColorCodeio  2 місяці тому +24

    Episode 18: Event Loop 🎩🎥💛➰🎉

    • @anjalii1102
      @anjalii1102 2 місяці тому +1

      Tony Stark teaching JS ❤

  • @anshvj
    @anshvj 2 місяці тому +14

    lowkey might be the best channel for every js developer

  • @MohammedBouhaouche
    @MohammedBouhaouche Місяць тому +2

    This is pure GOLD you rock, man ! how come I just stumbled on this channel, the content you have is crazy, please keep going 🙏🙏

  • @ptk2k
    @ptk2k День тому +1

    I just want to express my utmost respect to you, Sina! 🙌 I've watched all the videos in this series over the last couple of days, and man, this is by far the best content I’ve ever come across for explaining JavaScript concepts so clearly. I’ve had trouble understanding JS before, but after going through your videos, everything finally clicked! You’ve made it so much clearer for me. Keep up the amazing work, Great Wizard Sina - I salute you! 🧙‍♂✨

  • @hasithapriyasad
    @hasithapriyasad 2 місяці тому +14

    I already know this concept, but your way of teaching is top notch. well-done man

  • @JeezySlots
    @JeezySlots 2 місяці тому +7

    coming here after watching legendary "Wth is event loop?" video...I must say, that legendary video laid the foundation and you built the building on top. Top notch, thank you.

    • @ColorCodeio
      @ColorCodeio  2 місяці тому +1

      Awesome to hear. And yes that video is pretty legendary!

  • @Salaralali
    @Salaralali 2 місяці тому +8

    one of the best (if not the best) Videos on UA-cam for the JS community. Masterpiece! 👏

  • @zunnoorainrafi5985
    @zunnoorainrafi5985 2 місяці тому +1

    Seriously, now I understand event loop.
    Your explanation + animation = amazing😍

  • @gamingcurse5217
    @gamingcurse5217 2 місяці тому +6

    You are the role model, I will never thank you enough for the effort you do my 100 hats off for you sir

  • @sabukuna
    @sabukuna 2 місяці тому +13

    siiinnaaaaaa!!! a video about deep copy and shallow copy would be noice.

  • @shashankphiske3678
    @shashankphiske3678 2 місяці тому +1

    Great Video, need an entire in-depth javascript playlist with this great level of teaching

  • @Bunnyfromhell92
    @Bunnyfromhell92 8 днів тому +1

    The only video on the JS event loop that the internet needs!

    • @ColorCodeio
      @ColorCodeio  7 днів тому

      There are other good ones out there but thank you!

  • @khedr433
    @khedr433 2 місяці тому +10

    You deserve more views, this is such an underrated channel!

  • @ivlis.w8630
    @ivlis.w8630 8 днів тому +1

    Missed your videos, might have to rewatch them all again to get up to date again 😅

  • @Євген-д7д
    @Євген-д7д 2 місяці тому +4

    This channel is a hidden gem! I've heard a bit about event loop before, but the animation (and gags) made it look so simple. I'm definitely checking out other videos about JS

  • @harshp7328
    @harshp7328 2 місяці тому +1

    Thank you SIr, this video is very helpful for me to crack my first ever interview ❤

  • @abdallahazme4757
    @abdallahazme4757 2 місяці тому +4

    Producing this level of quality is no easy task. It requires numerous other APIs and event queues to add tasks and manage the loop through the tasks after the call stacks and timing are right.
    Thanks a lot man. And I suggest to change this playlist to 50 things you didnt know about javascript 😂😂😂😂

  • @georgii_v
    @georgii_v Місяць тому +1

    OMG! Who are you? wizard? How do you do that? Unbelievable! This is the best EVER explanation on the Russian / English internet! Please DO NOT stop! Thanks! Thanks a lot! Can't even imagine how much time you spent on that video!

  • @wisdompeters4521
    @wisdompeters4521 24 дні тому +1

    You're truly the best... Say no more! Takes Sensei

  • @seephor
    @seephor 2 місяці тому +1

    Probably the best explanation of the topics on UA-cam. Excellent job. This video is way underrated.

  • @BrackProgrammerNOLA
    @BrackProgrammerNOLA 2 місяці тому

    MISSED YOU BRO.....I've been developing via JS for about 17v months. I've come really far! You've been a big part of my developer education. APPRECIATE YOU!

  • @Neth-g9v
    @Neth-g9v 2 місяці тому +2

    When the world needed him the most, he returned!!!

  • @VloggerFJC
    @VloggerFJC 2 місяці тому +2

    Thank you for this video. You are the first person who could explain this topic on a really easy to understand way.
    Thank you for your videos. They really helped me to understand JS better.

  • @Default_-ij5oc
    @Default_-ij5oc Місяць тому +1

    you are a live saver my guy please never give up on the channel

  • @TheFuture36520
    @TheFuture36520 2 місяці тому +1

    I love how you explained the concept visually and your ideas on how to implement the concept.
    I've struggled with understanding asynchronous function.

  • @jsonslim
    @jsonslim 10 днів тому +1

    This is my favorite explanation so far!

  • @parsaaza767
    @parsaaza767 Місяць тому

    If you're looking for a great explanation of how the event loop works, this video will definitely deepen your understanding! Thank you Sina.❤

  • @dariaiankovskaia980
    @dariaiankovskaia980 2 місяці тому +1

    can't wait to watch this! Glad you are back! Thank you!

  • @amirhosseinmajidy575
    @amirhosseinmajidy575 Місяць тому

    you are the best teacher of javascript. plz make a video about advance javascript module.

  • @elyoaprogrammer
    @elyoaprogrammer 2 місяці тому +1

    Excellent video about this key JS mechanism used by all the modern frameworks to perform the DOM update. One more reason why it’s important to know about it

  • @mahfoudh_arous
    @mahfoudh_arous 2 місяці тому +1

    Can't thank you enough, Sina, for explaining such a complex and advance concept in a such clear and fun way 👏👏👏🎩🎩🎩🌹🌹🌹

    • @ColorCodeio
      @ColorCodeio  2 місяці тому +1

      Thank you as always for your comments!

  • @vaishnavipampatwar6569
    @vaishnavipampatwar6569 7 днів тому +1

    Amazing..Please keep posting Videos..Thanks!

  • @yaess7384
    @yaess7384 2 місяці тому +1

    Discovered you a while ago. Back when I was learning JS fundamentals, and I can still learn a lot from you. Honestly, I would love to see a video that goes more in-depth of using devtools and debbuging the stuff, like you would do in real-life project. It's easy to understand it on simple examples but diving into new codebase that is maintained for a long time, it's a real challenge to understand what's happening.
    Cheers

  • @Pluvo2for1
    @Pluvo2for1 2 місяці тому +1

    You did this complicated topic really well. Thank you!

  • @siya.abc123
    @siya.abc123 2 місяці тому +1

    19:37 Bro! 😂
    Today I solved an issue by using setTimeout of 0 and I didn't fully understand why it worked. Thank you for this! I'm subscribing

  • @bmehder
    @bmehder 2 місяці тому +2

    This is how a video is done people. Looking forward to FP stuff.

    • @ColorCodeio
      @ColorCodeio  2 місяці тому

      Thanks brother. As always!

  • @mirjalol49
    @mirjalol49 2 місяці тому +2

    you and Lydia Hallie are doin best thing in the world

  • @Mohamed-x3o
    @Mohamed-x3o 2 місяці тому

    UA-cam alg could do a much better job of pushing this channel. Top tier explanation as always.

  • @KARTHIKEYANR-b1n
    @KARTHIKEYANR-b1n 2 місяці тому +2

    🔥🔥One of the videos that makes me more interested about js.✨Amazing explanation and we see the animations and work that you have put to make this video.Thank you 👍

  • @marcosfabianchongmegchun7668
    @marcosfabianchongmegchun7668 Місяць тому

    Listen, your video is one of the best (if not the best) I have watched about the event loop concept, thank you so much, You earn a new subscriber!

  • @jakobo5521
    @jakobo5521 2 місяці тому

    The way that you have explained this is just amazing. I was struggling for some time to understand this concept but now I get it. Many thanks for sharing such knowledge with us. Take care :)

  • @abdelazizemad9708
    @abdelazizemad9708 Місяць тому

    Sir , I literally watched over 10 videos and researched several docs , plz keep making videos like this , if possible , can you do full scale (HTML + CSS + JAVASCRIPT ) projects , you are excellent

  • @TechGlamazon
    @TechGlamazon 2 місяці тому +1

    It's going to be the most watched Event Loop video. what an explanation, what an high quality content in all aspects + funny. what's better then that ?

  • @ajiteshmishra0005
    @ajiteshmishra0005 2 місяці тому +3

    After a long time
    You are uploading video
    Waiting eagerly

  • @chloenewman758
    @chloenewman758 6 днів тому +1

    Thank you sooooooo much for your super duper clearest explanation!!!

  • @mostafavii
    @mostafavii 2 місяці тому +1

    And finally the episode I waited too long to here from you

  • @leftinashes
    @leftinashes 2 місяці тому +1

    Bravo! This was my introduction to your channel and I thoroughly enjoyed it. I really appreciate your "Double Impact" intro! Your content is great and I'll be watching more for sure! Cheers...

  • @thewebdev8928
    @thewebdev8928 2 місяці тому

    I love this series and your humor

  • @tag243
    @tag243 7 годин тому

    THIS IS BRILLIANT!

  • @oleksandrfomin326
    @oleksandrfomin326 Місяць тому

    Extremely talented teacher

  • @2difficult2do
    @2difficult2do 2 місяці тому +1

    Thank you. I was waiting for this video because your way of teaching made evething clear ☝️😼👍.

  • @moamen_khaled-l4k
    @moamen_khaled-l4k Місяць тому

    Please make a playlist for beginners javascript.... U are a great teacher and want to learn more.. From u Thanku for this playlist

  • @cheekypigg
    @cheekypigg 2 місяці тому +1

    He’s back 🙌

  • @amirafshar9516
    @amirafshar9516 2 місяці тому +2

    Duuuude that was greaaaat, thanks for enlightening me :D ❤

  • @RaffayDoesTech
    @RaffayDoesTech 2 місяці тому +1

    loved it man, youtube doesnt appreciate you enough, you are one of the best educators out there, dont forget me when you hit a milli

  • @asanka.abewickrama
    @asanka.abewickrama 2 місяці тому +1

    Thank you for video. Understood the concept.

  • @kamrulislam3841
    @kamrulislam3841 Місяць тому

    Man your energy level 🔥
    It always goosebumps me whenever you hit the core point❤️

  • @karimbouche3563
    @karimbouche3563 2 місяці тому +1

    I just discover this channel ,and it was excellent explanatory video of a miss understood concept , so thanks bro ,and it is please to see your face 😊

  • @cloudgreenhorn452
    @cloudgreenhorn452 2 місяці тому

    Color me impressed. Great delivery of this topic.

  • @madhavanand756
    @madhavanand756 2 місяці тому +2

    Woohoo our JavaScript's John Sina is back 😉
    How about design pattern in JavaScript series ?

  • @kunalsharma-kg6sk
    @kunalsharma-kg6sk 2 місяці тому

    I'm little bit confuse that did event loop also handle the sync code in stack or just check the stack and queue continuously to execute the async code ?
    our content is truly inspiring! The way you break things down is impressive-I'm learning so much. Keep it up!

  • @Jefy95
    @Jefy95 2 місяці тому +1

    Thank you for video 😃 !!!!!!!!!!!!! The explanations were clear and very understandable.😁😁

  • @mdyousufgazi4030
    @mdyousufgazi4030 2 місяці тому +3

    welcome back. as always explanation is top notch

  • @alanmurillo3966
    @alanmurillo3966 2 місяці тому +1

    I was waiting for this one, amazing

  • @t1germetal
    @t1germetal 2 місяці тому +1

    Great delivery and tons of useful information. Thank you!

  • @tahahusnain654
    @tahahusnain654 2 місяці тому +1

    The best man very well explained.

  • @junhuama68
    @junhuama68 2 місяці тому

    This is so much fun to watch!

  • @mucatcode3468
    @mucatcode3468 2 місяці тому +1

    Thank you very much sir .

  • @ndilionel
    @ndilionel 2 місяці тому

    Clearly explained. Thanks

  • @chamodtharakaperera
    @chamodtharakaperera 2 місяці тому +1

    You are the best! Thank you!

  • @AshleyMcFadden-y4n
    @AshleyMcFadden-y4n 2 місяці тому +1

    You are doing Gods work!

  • @joeangello2016
    @joeangello2016 2 місяці тому +5

    Would it be better to watch this video before episode 11 of you video series, to be specific before the Asynchronous JavaScript, Promises, Async Await and Fetch videos?

    • @offYears
      @offYears 2 місяці тому +1

      imo no, but the older vids are worth a rewatch once you've seen this if you didn't have the conceptual picture before

  • @Sales-ki7lx
    @Sales-ki7lx 2 дні тому +1

    That was awesome

  • @karthiknataraj317
    @karthiknataraj317 2 місяці тому +1

    Well done RDJ

  • @verdaderoken
    @verdaderoken 2 місяці тому +1

    This is so entertaining. Thanks!!!!!

  • @yutubl
    @yutubl 2 місяці тому

    @callstack: I think it helps understanding, that "the callstack " is more likely a main callstack. In case of executing an async call to a timer() function with a delayed callback function, the original main callstack might be (copied/splitted), so that the timer() function after the timer counters run down still knows the context where to call back when running the callback function (so that the callback function has access to local variables).

  • @randymartin9040
    @randymartin9040 Місяць тому

    Great explanation thank you!

  • @abahiduh3246
    @abahiduh3246 2 місяці тому +2

    WONDERFUL WONDERFUL WONDERFUL..... now I know.
    Pls consider...
    1.Design patterns of the gang of four for JavaScript
    2. Data structures and Algorithms
    the design pattern u did previously ( factory function $ constructor function was SUPER qoli😂

  • @barneylaurance1865
    @barneylaurance1865 2 місяці тому

    In the examples where the engine is running a JS script that calls some functions, there should also be an entry in the stack to represent that script as a whole. It acts like another function. I think showing this would have been helpful especially in example 7 at 18:52 to show why the console.log(2) can't be added to the task call stack right away. The event loop only adds something to the stack if the stack is empty, and in this case it isn't really empty because the script is still running.

  • @reninmohan2303
    @reninmohan2303 2 місяці тому

    You really have done it excellent explanation

  • @sanmarchen
    @sanmarchen 3 години тому

    Какого хрена здесь так мало просмотров? Это же изумительно прекрасное визуальное объяснение!

  • @anilrpinto
    @anilrpinto Місяць тому

    I just watched the video, enjoy the light hearted approach at teaching core and complex concepts. I do have a question about the part at Micro task queue (20:30~), You said the Promise.. then() would get executed in the call stack first, but what if the fetch actually took 5 seconds but the setTimeout() took just 1 sec?

  • @MohamedFouad-j5i
    @MohamedFouad-j5i 2 місяці тому +1

    Amazing playlist ❤

  • @HalissonSkalee-u8j
    @HalissonSkalee-u8j 4 дні тому +1

    great job!

  • @mr.nobody4159
    @mr.nobody4159 2 місяці тому +2

    Been waiting

  • @pini01ru
    @pini01ru 2 місяці тому +1

    Amazing!

  • @matt112fly
    @matt112fly Місяць тому

    very cool, just what i was looking for :)

  • @mohammadabbas1623
    @mohammadabbas1623 2 місяці тому

    only person i love to learn from

  • @UnholySwiss
    @UnholySwiss 2 місяці тому +1

    top explanation

  • @rasoul7396
    @rasoul7396 2 місяці тому

    سینا چقدر خفن بصری‌سازی کردی. کاش این ویدئو رو ۱۰ سال پیش میدیدم

  • @dr.slowdeath1852
    @dr.slowdeath1852 2 місяці тому

    Yessir thank you so much!
    Could we please have one on destructuring and maps im struggling to wrap my thick skull aroud that and your way of explaining seems to do the trick 😅😅😅

  • @DanielMaduka-jy9jv
    @DanielMaduka-jy9jv Місяць тому

    Thank you so much for your content,your topics has helped me alot ❤❤

  • @zunnoorainrafi5985
    @zunnoorainrafi5985 2 місяці тому

    Hi Teacher,
    How are you?
    What are your thoughts on learning DSA (linked list,stacks,graph,trees, sorting algorithms, searching algorithms etc) ?
    Is it necessary for becoming a successful software engineer?

  • @audaryarathod3052
    @audaryarathod3052 2 місяці тому

    Great explanation.

  • @mohammadkhakhsoor2068
    @mohammadkhakhsoor2068 Місяць тому +1

    Need a comprehensive vid about devtools specially for debugging thanks ❤

  • @taofeeqomotolani2311
    @taofeeqomotolani2311 2 місяці тому

    Amazing explanation

  • @Abhinand28
    @Abhinand28 2 місяці тому +1

    Thanks 😀

  • @newgen8136
    @newgen8136 2 місяці тому +1

    Thank you

  • @proteus1
    @proteus1 Місяць тому +1

    Do you have videos of learning the basics of Language? You have a good channel, but for someone like me, there would be a difficulty in undestanding the foundations.

  • @vaishnavipampatwar885
    @vaishnavipampatwar885 26 днів тому

    Cool explanation!