Тёмный

JavaScript Visualized - Promise Execution 

Lydia Hallie
Подписаться 70 тыс.
Просмотров 159 тыс.
50% 1

Опубликовано:

 

27 сен 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 505   
@theavocoder
@theavocoder 6 месяцев назад
❤Hello again!! It's been a while since I uploaded to my own RU-vid channel haha. 🔊 I'm aware that the audio is a bit low! Sorry about that, will keep this in mind in the future :) I have many ideas for upcoming videos, but let me know in the comments what you think I should cover next! 👇
@karthikm.1804
@karthikm.1804 6 месяцев назад
"Yes! It's been a while, but I am excited for all the upcoming videos."
@markasena
@markasena 6 месяцев назад
Volume is a bit low on my side. boost it up on your next one!
@EdwinMartin
@EdwinMartin 6 месяцев назад
Hopefully not in 2029 😉
@mohithguptakorangi1766
@mohithguptakorangi1766 6 месяцев назад
How did you create those slides of animations? Please let us know.
@hellomukit
@hellomukit 6 месяцев назад
Great video. I would also like to know, how are those animations are made?
6 месяцев назад
Probably the best explanation of Promise I've ever seen
@rodrigolj
@rodrigolj 6 месяцев назад
I don't know if you want to go full time on this, but until then, I'm just so happy you decided to create content. It gives so much clarity on what JavaScript does, especially for people like me, who have aphantasia.
@pandeyrochak
@pandeyrochak 3 дня назад
Found your channel from GreatFrontend. This is the best Promise explanation on the internet. The animations are top notch 🔥🔥
@pedroalmeida6728
@pedroalmeida6728 6 месяцев назад
The visuals and animations are top notch, amazing work, keep it up!
@pablomendezjimenez2010
@pablomendezjimenez2010 6 месяцев назад
Never seen a video with such clear drawings for explaining JavaScript promises and how they relate to the event driven nature of current JavaScript compilers. You've got a new subscriber!
@dipeshtamang4467
@dipeshtamang4467 4 месяца назад
Visualisation really makes any complex topic easier to understand. Awesome explanation, keep up the good work.
@sunkittsui7957
@sunkittsui7957 6 месяцев назад
This is the most well done and comprehensive video on JS Promises that I have seen so far!
@JohnBuildWebsites
@JohnBuildWebsites 5 месяцев назад
One of the best explanations I've seen. I'm so glad to see in recent years far better communication of confusing or complex ideas in coding. As an older bearded autistic Linux fan myself, I can confidently say simple communication hasn't traditionally been one of my peer groups strengths 😂. So I am glad my daughter will have far better role models explaining these concepts if she chooses to go into software development.
@TheCodingSloth
@TheCodingSloth 6 месяцев назад
wow amazing video Lydia! Really loved the high quality visuals and your teaching style. Keep it up!
@nate_codes
@nate_codes 6 месяцев назад
This was INSANELY well done and highly educational. As someone who felt like I never fully grokked promises, after 4mins of watching a vid I now feel confident in how they fundamentally work. The visuals were amazing, progressive code snippets were perfect, and the script was tight and educational. I love that you basically made a clif notes video for a chunk of EXMA-262!! Insta sub! 👏
@nate_codes
@nate_codes 6 месяцев назад
EMCA-262… DYAC 🤦‍♂️
@lilichao9984
@lilichao9984 5 месяцев назад
@@nate_codes ECMA?
@tobiashaefermann
@tobiashaefermann 6 месяцев назад
Great video as usual! A tiny addition I would make is that the then handler implicitly creates a fulfilled Promise as shown in the video by Lydia if you return a plain value - but the more common case for chaining is that you explicitly return a Promise yourself which usually is pending at first.
@dbsSensei
@dbsSensei 6 месяцев назад
Finally, new video after five years :')
@CsAlchemy-eg6ch
@CsAlchemy-eg6ch 6 месяцев назад
Been so long
@saiprashanth3618
@saiprashanth3618 6 месяцев назад
But, worth the wait.
@codeChuck
@codeChuck 6 месяцев назад
Totally worth it! Great quality content!
@dbsSensei
@dbsSensei 6 месяцев назад
Totally agree
@CsAlchemy-eg6ch
@CsAlchemy-eg6ch 6 месяцев назад
Totally agree
@Bhanuprasad-r3n
@Bhanuprasad-r3n 3 дня назад
One of the best explanation about promises
@arsamhashempour8156
@arsamhashempour8156 4 месяца назад
just 2 days ago I was thinking about lack of a visualized teaching in javaScript and today I found this channel it's great keep going and keep the level of your videos above I think developer community needs more people like you
@vagrawa1
@vagrawa1 2 месяца назад
Hello Lydia. Thanks for all the videos. I hope we have teachers like you everywhere. Watching your videos gives so deep understanding about the topics. Thanks you so much again!!!
@fanyinU
@fanyinU 3 месяца назад
Wow 🚀 This is the BEST explanation of promise concept I've ever seen. The visualization and your explanation work super well together 👍
@alexandrsashin
@alexandrsashin 6 месяцев назад
Your illustrations are eye-catching and easy to understand. I like this approach and want to say "Thank you" for such a great video!
@letmewatch.
@letmewatch. 4 месяца назад
The visualization here is crazy to a point, me- who's very slow to understand, understood every word you said. Please keep doing more of this. I've even subscribed!
@kh0lis
@kh0lis 6 месяцев назад
This video suddenly popup on my feed. Your explanation with visualization is outstanding. Hope you can continue with other topics. Thanks 👍
@akashrajawat3676
@akashrajawat3676 5 месяцев назад
Just WOW!!! I have seen dozens of videos on Event Loop, and it made sense to me because some of them does not explain complete event loop. There is a famous video which tells event loop is simply a Stack and a Queue, and which always confused me when working with callbacks or promises. Thankyou very much for the video and looking forward for topics like "Closure".
@danielqolami
@danielqolami 5 месяцев назад
This is the best explanation I've ever seen on "Promise" subject. thanks for the video.
@A_Saban
@A_Saban 5 месяцев назад
Well done! this visualization is the best I have ever seen for learning how the code works, plus your explanation is easy to understand kinda whish I had it when I learned promises
@PostigIT
@PostigIT 6 месяцев назад
Asynchronous programming is one of the most difficult topics to learn for beginners, because it is difficult to visualize in your head the coherent work of the stack, queues, event loop and web API. Thank you for such a clear explanation of how Promises work. I'm waiting for your new videos. Greetings from Russia! 🕊
@BonBaisers
@BonBaisers 6 месяцев назад
Love it, strait to the point, useful infographics and efficient plan. I think the format is great. Details on "small" topics give the opportunity to beginners understand concepts and experimented people will always learn 1 or 2 things.
@abhirajsinha3186
@abhirajsinha3186 6 месяцев назад
Have been reading your Javascript Visualised series on Medium, you're really underrated. Thank you for making these, hope you continue! Really helpful for beginners
@muhammadusmanshaikh
@muhammadusmanshaikh Месяц назад
This type of explanation is the best. Please keep uploading.
@AMMullan
@AMMullan 5 месяцев назад
Superbly explained - as someone who hasn't really done much JS for a while and wanting to get back into it these kind of clearly explained resources are so useful 👏⭐
@l0upgarou
@l0upgarou 6 месяцев назад
Lydia, I wish I could like and subscribe more than once. Love this format, please please make more videos like this.
@novodip247
@novodip247 6 месяцев назад
I have a frontend interview after 2 days and this popped up in my feed, thanks youtube, Great visualization of promise, really enjoyed how you explained how things work under the hood in Promise.
@libra.
@libra. 6 месяцев назад
been waiting for 5 years, ‼️🗣️🗣️🗣️ legit firee🔥🔥🔥💯💯
@lakshminarayanareddypadart9807
@lakshminarayanareddypadart9807 6 месяцев назад
Please make more videos like this. It makes my learning faster and easier.
@agormanco
@agormanco 5 месяцев назад
Nicely done! I've working with Promises since 2012 or before, but I never understood the details until watching your video in prep for an interview. Thanks!
@dmitrystril1748
@dmitrystril1748 5 месяцев назад
Hey, it's good to see you on youtube, your visualizations got even better! 😀 Thanks! 💡Maybe execution contexts and closures would be good to cover next.
@josemarin359
@josemarin359 5 месяцев назад
Really good video. Even though youtube is crowded with Language specific subjects, the quality of this video makes it special. What I don't see a lot in youtube (maybe you can take the challenge) is about programming developing flow and techniques. Once you master the language the big challenge is about the developing process flow. How to decompose a big problem. Where to start. When to be wary about coupling of functions and data structures, how to create functions that have only one responsibility, data structures, simplicity, scope of a function, top-down approach vs bottom-up approach. I think the format for the video could be to create a medium complex project (several videos) and stress good practices and what could have gone wrong, what are the internal thought process that recreated the flow.
@shivams417
@shivams417 6 месяцев назад
Brilliant work!!, explained easily with story + visualizations, thanks Lydia. I hope u continue to make such Visualized videos for advanced concepts for key frontend techs such as JS, TS, ReactJS and NodeJS.
@flavisff8040
@flavisff8040 Месяц назад
it helped a lot to revise and clear some doubt, thanks for such good content, keep making for some more topic ❤❤
@anon5992
@anon5992 4 месяца назад
I'm so happy this video exists! I've seen many courses that cover this topic but this one has been the most complete the easiest to understand. please teach us more, can i ask for how heap works in javascript video
@praisechinonso-s8d
@praisechinonso-s8d 2 месяца назад
Your channel is a gem
@LukasSmith827
@LukasSmith827 6 месяцев назад
learning through both visualization and text is so underrated. please keep these videos going!
@MikeNugget
@MikeNugget 6 месяцев назад
Wow, that infographics animation is absolutely amazing ❤
@CoreDumpped
@CoreDumpped 6 месяцев назад
What a great video. I loved the animations!
@lucasviga12
@lucasviga12 Месяц назад
an explanation about: call stack and memory heap, or prototypes chain will be cool. Thanks for the video.
@אלעדר
@אלעדר 5 месяцев назад
By far the best explanation of this topic I've even seen
@proplayeriguess
@proplayeriguess 4 месяца назад
this is the best explanation i have ever seen, simply awesome
@CrusaderMen
@CrusaderMen 6 месяцев назад
Thank you Learning by visual is the best way to learn
@ИванРагозин-я8я
@ИванРагозин-я8я 5 месяцев назад
I love you Lydia, make more videos like this, the views, likes are incredible.
@nestorrente
@nestorrente 6 месяцев назад
I've found this video quite interesting! I already had more or less a clear idea of how promises work, but honestly I didn't know the existence of the microtask queue (I thought all future tasks were added to the same queue). I'll share this video with the developers of my team so they can learn from you too 🙂 thanks for this!
@plabmadeeasy
@plabmadeeasy 6 месяцев назад
Those are some beautiful animations! Thanks for the video!
@omak3313
@omak3313 6 месяцев назад
Thank you, Lydia! Visual explanation with animation helps a lot in understanding!
@WbAzmul
@WbAzmul 6 месяцев назад
Thanks for uploading this video. Actually when I stated learning JS , I read your writing on MDN about " Promises & Async/Await" then I came to RU-vid if there is any video on this but it was not there. I got a bit disappointed. Now You upload this video. really happy for that. please make more video on JS.
@stianmaurstad
@stianmaurstad 6 месяцев назад
Thank you Lydia, as a visual learner, these visuals makes it so much easier!
@mahalingappabirajdar5285
@mahalingappabirajdar5285 26 дней назад
Thank you for the great explanations
@TheUnknownFactor
@TheUnknownFactor 5 месяцев назад
Incredible! I was playing-pausing-testing-playing-pausing as the video went on and ended up writing: function createHandler() { console.log('creating success handler'); return () => console.log('.then Resolved!'); } new Promise((resolve, reject) => { console.log('promise function body'); queueMicrotask(() => console.log('microtask before resolve')); resolve(); queueMicrotask(() => console.log('microtask after resolve')); }).then(createHandler()); console.log('regular call stack'); Before the last part of the video I expected ".then Resolved" to occur before "microtask after resolve"; but the last bit about then-handler not being pushed to the microtask queue until the then actually runs kind of makes sense. I was assuming that the resolve itself would push the microtask.
@ilejovcevski79
@ilejovcevski79 4 месяца назад
This was extremely helpful, i hope you keep on making these!
@rajatpatel1148
@rajatpatel1148 6 месяцев назад
Your github repo for javascript is so famous. It is so great to see you on youtube. Goodluck 😊❤️💯
@avrenos
@avrenos 5 месяцев назад
Masha allah sis!! We need more videos like this. It would be great if you start a full JS playlist for Web Development!! Really looking for it! Your teaching style is just superbbb!!
@nekotajni394
@nekotajni394 4 месяца назад
The beautiful Lydia Hallie, this is a pleasure to watch in all regards !
@zardokar
@zardokar 6 месяцев назад
I'm JS Developer and I like your animation for explanation. I hope you create the next videos. Cheer !!
@tahasin2321
@tahasin2321 6 месяцев назад
Finally welcome back after five years with new video ❤❤❤
@SankarshanGhosh
@SankarshanGhosh 3 месяца назад
The promise pun at the start made me subscribe!
@DevMe-f5v
@DevMe-f5v 11 дней назад
I wont skip adds for you, thanks madam
@maryembenyounes523
@maryembenyounes523 5 месяцев назад
This is the best Promise video i've seen and i've seen many. Keep going ❤
@alessandroformica6824
@alessandroformica6824 5 месяцев назад
Learning is fun this way! Looking forward to subscribing to one of your next courses ❤
@ricTGL
@ricTGL 6 месяцев назад
Hello Lydia! This video was super useful to me! It is always the same, you think you know something until someone shows you that you don't with fancy animations! My two cents on how to improve (it was a super good video btw): Felt that you went a bit fast though, and even though the animation was almost always clear there were sometimes I had to pause and go back to kind of understand what was going on. Other than that, I missed a bit extra explanation on what the call stack, event loop and so on are. Might be a good idea that you make a video on that so you can reference that one in future videos. Keep going, you're doing great!
@sumantramukherjee2064
@sumantramukherjee2064 5 месяцев назад
So lucid explanations! Thanks much. 😊😊
@SydneyDomingo-q4n
@SydneyDomingo-q4n 5 месяцев назад
You should already be thinking about your next upload while i subscribe😀great work!
@lottexy
@lottexy 6 месяцев назад
holy damn finally!! i remember reading ur posts, glad to see you have videos
@lonesoul9103
@lonesoul9103 Месяц назад
You are the best. Please upload more videos
@DouglasGubert
@DouglasGubert 6 месяцев назад
Awesome visualization! Makes the concept so much easier to grasp :)
@halith_smh
@halith_smh 6 месяцев назад
Kindly create JS full course, your explanation is amazing and easy to understand
@CrsAVC
@CrsAVC 22 дня назад
Great video, it helped me visualize better what is this JS Promises thing about. I'm new to the coding world and this is one of the topics I have not fully grasped yet. I would've loved you explained a little further about what happens when you chain the '.then', are they stacked in the microtasks queue? and what about if it wasn't the end of the script? and what about the reject part of the Promise? and what about the 'await' keyword I often see it is used? Anyway, great video, thank you for sharing! I hope you could clarify all these for those like me that are new to coding, and maybe using some real world scenarios as examples :)
@_dp3po_881
@_dp3po_881 6 месяцев назад
best explanation I've ever seen. well done.
@StefanHayden
@StefanHayden 6 месяцев назад
amazing visuals! Would love a BTS on how you built those UI!
@ankitsenjaliya1808
@ankitsenjaliya1808 5 месяцев назад
This video is a master piece.Thanks for your detailed explanation.
@felipe4181
@felipe4181 5 месяцев назад
So clear explanation! please make more videos for JS!
@kevinb1594
@kevinb1594 5 месяцев назад
Amazing work. These visual breakdowns would be great for showing the complexity of getting certain APIs correctly wired up, ie WebRTC / WebAudio
@dasdchen
@dasdchen 6 месяцев назад
Wonderful explanation!I was puzzled about the inner workings of Axios, and I don't know if I understood it correctly. I would like to see that in your channel if it's possible. 😊❣
@Gazwai92
@Gazwai92 6 месяцев назад
The visualisations are great, one of the better explanations around promises 👍
@pablojavierjimenez
@pablojavierjimenez 6 месяцев назад
Fantastic video and explanation 👏🏼👏🏼👏🏼. I can't say again my joke "we all always use promise, but no one understands promise" 😝
@DanPlayPl
@DanPlayPl 6 месяцев назад
For far best explanation of promises i've seen
@kdshare6765
@kdshare6765 6 месяцев назад
Excellent, I am very glad to watch this high quality video ❤
@fernando-kw
@fernando-kw 5 месяцев назад
This is AWESOME, great explanation and video quality 🎉 brave! thanks
@edgeeffect
@edgeeffect 5 месяцев назад
The thing that literally blew my mind with promises was that I'd heard FP people go on about "monads" for sooooooo long along with that ridiculous quote designed to intimidate anyone who doesn't understand... I remember after a few weeks of messing around with promises that it suddenly dawned on me that promises in JS were basically monads and my mind was blown not by the fact that my "great mind" had grasped this complex topic but that the complex topic itself was actually really simple. ... I love to troll functional programmers... "oh yeah, I'm a functional programmer too... I use JS" :) :) :) :)
@Surajk_umar01
@Surajk_umar01 27 дней назад
amazing explaination
@amjadshadid90
@amjadshadid90 6 месяцев назад
Great video, please try to share more content on javascript. Your explanation is very clear
@amirthavalliselvam1844
@amirthavalliselvam1844 5 месяцев назад
Greate video I've ever seen. clear explaination
@AR7editing
@AR7editing 6 месяцев назад
I watched your course on Frontend Masters, 10/10.
@sirhcleunam
@sirhcleunam 6 месяцев назад
Nice!! Very interesting explanation with video animation, it's easy for a newbie like me to understand. Thank you!
@vanta6lack
@vanta6lack 2 месяца назад
thank you for the video. It is really helpful!
@yonigoldberg634
@yonigoldberg634 6 месяцев назад
Awesome video. May I ask which software you are using for these beautiful visuals?
@youri_golo
@youri_golo 6 месяцев назад
Thanks Hermione!
@naoufaljrh3891
@naoufaljrh3891 5 месяцев назад
please keep doing this, this is just great !
@OliverSwales
@OliverSwales 5 месяцев назад
Wow amazing explanation and great video! Thanks
@CptTrips83
@CptTrips83 4 месяца назад
That was really helpful. Thanks
@danielwilkowski5899
@danielwilkowski5899 5 месяцев назад
top-notch, 10/10, very high quality content. instant subscribe.
@dvlpr
@dvlpr 6 месяцев назад
This is a great explanation!
@johnkeck
@johnkeck 3 дня назад
This video is very helpful! But in the challenge, at one point you seem to have an empty call stack while you have a lambda on the microtask queue (viz., `result => console.log(result)`). It has me wondering why that lambda isn't executed before the final `console.log(3)`. Please explain!
@krzemian
@krzemian 6 месяцев назад
Awesome, this will definitely make its way into the TOP course pages soon
@fahimhossain6109
@fahimhossain6109 6 месяцев назад
Hey, We need more good stuff like this, seriously we need,
Далее
Being Competent With Coding Is More Fun
11:13
Просмотров 80 тыс.
JavaScript Promises  -- Tutorial for Beginners
37:05
Просмотров 124 тыс.
JavaScript Visualized - Execution Contexts
11:41
Просмотров 58 тыс.
How I Made JavaScript BLAZINGLY FAST
10:10
Просмотров 219 тыс.
Postgres just got even faster
26:42
Просмотров 29 тыс.
I took the #1 Tech Exam and it was BRUTAL
18:28
Просмотров 1,2 млн
The 3 Laws of Writing Readable Code
5:28
Просмотров 579 тыс.
How principled coders outperform the competition
11:11