Максимально полная информация, нигде такого не видел. Пришел после видео про event loop, где тоже все было рассказано очень подробно и хорошо. Был приятно удивлен настолько содержательным примерами. Спасибо, не останавливайтесь!
Елена, Вы просто богиня понятных объяснений! Спасибо Вам, что берете такие актуальные и сложные темы и так подробно их разбираете! Очень приятно смотреть Ваши видео!
Спасибо, теперь стало понятно, что такое макро и микротаски. Как- то смотрела видео-интервью фронтенд разработчика, так они там такую путаницу навели, что я подумала, будто микротаски - это все, что в стек идёт, а макротаски - в очередь.
У Вас очень классные видео и подача. Всегда с интересом смотрю. Но задачи разбираемые Вами пока очень сложны для меня :) Надеюсь вскоре до них дорасту.
большое спасибо! очень хорошо объясняете👍 Сколько лет живу, а не знал такую фичу про setImmideite 😅 33:00 вывод: start bar foo zoo foo-2 baz node -v: v16.9 в 16 ноде process.nextTick выводится строго после промисов) Видимо не стоит на него полагаться т.к. поведение от версии ноды зависит
У меня установлена v16.12 и собственно урок я с ней записывала. Проверила также 16.9 nextTick идёт первым. Есть ли у вас ссылка на документацию в подтверждение ваших слов или дайте ссылку на ваш код, что запускали?
если быть точнее, версия ноды у меня: 16.9.1 Ссылку не получается дать, уже 3й раз сообщение ютуб удаляет. Зайдите на stackoverflow question 67949576. У человека Win10 node v14.17.0 и nextTick запускается после промисов. Все его примеры у меня так же ведут себя (Win11) Видимо это баг винды)
Интересно, что если создать package.json и поставить "type": "module", то снова будет выводится start bar foo zoo foo2 baz. Видимо в первый раз в этом было дело
в eventLoop сначала берутся callbacks из таймаута, после callbacks из операций i/o, после берутся callbacks из setImmediate, потому при чтении из файловой системы в cb сначала отработает immediate, а после таймаут
В первом примере из секции закрепляем знания не совсем так получается, там callback на I/O не всегда отрабатывает перед setTimeout callback-ом, так что вывод идет 50/50 и слово "timer" может быть выведено раньше, чем "text-open". Скорее всего это зависит от того, на какой стадии event loop мы находимся, так как у timeouts & i/o callbacks в event loop разные стадии.
Ребята, те кто только начал изучать JS, не советую смотреть вам это сейчас. Лучше слушать когда уже ты Junior + минимум. А так Елена молодец. Очень важная тема, которую максимально детально разжевала. Елена выходите за меня замуж! 😀
Большое спасибо за такую доступную подачу материала, это очень важно объяснять так, чтобы было понятно абсолютно каждому. Подскажите еще пожалуйста, а на каких языках программирования Вам приходится писать в вашей компании, ну или какие фреймворки используете?
О, интересно, не читала эту книгу. Но читала две другие идеальный программист и чистый код, помню осталась очень довольна. Надо будет придержать в уме про чистую архитектуру!
Так, а что именно относится к мироктаскам, макротаскам? не совсем понял. И почему setInterval относится к api, а не к макротаскам? И для чего конкретно нужен nextTick?
Спасибо, круто объяснила очень. Не очень понятно почему рекурсия засорила стек, а цикл нет. Я правильно понимаю, что в случае цикла консоль после выполнения тут же очищалась из стека, и по этому в стеке всегда было не больше 1й записи. А в случае с рукурсией в стек записывалась f(), затем консоль которая после выполнения сразу очищалась, и после этого снова f() и так пока стек не засорится полностью, да?
Стек предназначен для функций, по факту цикл это не функция. Это некоторый код внутри функции, он может выполняться долго и тем самым функция в стеке будет просто подольше находиться. console.log - это функция, поэтому кладется в стек, т.к. внутри нее нет других функций, то она сразу оттуда уходит. Если бы были внутри функции они бы выше положились. Т.е. базовая функция не может завершить свое выполнение до тех пор пока весь код внутри нее не отработает и все функции внутри нее не завершатся тоже.
Вопрос отличный! ;) В прошлом видео не было разбора macro и micro задач, т.е. в целом деления очередей, была одна очередь для простоты + там был упор на браузер, здесь nodejs (появляются доп. методы такие как process.nextTick, setImmediate), но в тоже время если без них то в браузере похожая логика (нет очереди next tick) и я тут тоже про него упоминала (про браузер).
@@theoty-js Ого! В шахматы пока не планировала учиться, однако возьму на заметку, что если что могу вам написать. ❤️ А так очень мечтаю научиться нормально на пианино играть, вот это прямо моя мечта. :)))
@@webelart с приятным людям рад идти навстречу 😉🤗 шахматы это интересная головоломка, для разработчиков самое 😊 тактика, стратегия, просчёт... Главное вникнуть, а там пошло - поехало)
Ochen' horoshie primeri, no obyasnenie tolko s pomosch'y console - kone4no ne mnogim bydet ponyatno. Mojno bili bi sdelat' naprimer 3 kolonki - macro | micro | main ---> i zasovivat' calls tyda. (nextTick eto to je microtask to je - mojno v printsepi ne razdelyat' ego na "nextTick - Queue", no on pobejdaet Promise - t k y nego higher priority) Voobs4e o4en priyatno videt' takoi content od devyshki - girls power !!!
Думаете по разному. В браузере когда запускается JS тоже есть движок для запуска и там используется и они вроде как одинаковые с nodejs. Но если есть доп информация делитесь. В любом случае и в браузере и в nodejs event loop есть.
привет! спрасибо за труд и работу, но для этой темы нужно больше визуализации, что когда и куда попадает, т.к. на собеседованиях эту тему спрашивают очень глубоко в детелях. вот пример хорошей визуализации ua-cam.com/video/vIZs5tH-HGQ/v-deo.html
У меня было видео с визуализацией ua-cam.com/video/3naT39judvQ/v-deo.html. И даже там я более подробно рассказываю про устройство js heap, web api и то, как работает event loop. По тому что вы скинули, человек не покрыл огромное количество деталей и по факту разобрал только setTimeout. Что касается текущего видео, то оно покрывает event loop очень подробно со всеми очередями и кучей особенностей, чего в скинутом вами видео даже близко нет.
Привет! Начинаю со стека, чтобы изложение было последовательным. Изучать стек можно по разному: можно на примерах и на словах, можно на тарелках, можно консоль Google Chrome открыть и показать как происходит складывание, а ещё можно с помощью одного моего видео ua-cam.com/video/i5PfPoX88wI/v-deo.html, очень крутое кстати. В общем, как удобно и понятно, так и нужно его изучать. ❤️
Спасибо за объяснение, очень подробно и понятно, рекомендую новичкам к просмотру. В русскоязычном Ютуб такие лекции редкость. Спасибо, Лена!
Максимально полная информация, нигде такого не видел. Пришел после видео про event loop, где тоже все было рассказано очень подробно и хорошо. Был приятно удивлен настолько содержательным примерами. Спасибо, не останавливайтесь!
Лучший разбор Event loop
Прикольная девчуля :)
Спасибо, когда читал, не получалось понять, но после вашего видео все разложилось по полочкам.
Большое спасибо за объяснение!! Это объяснение сильно отличается от других на просторах интернета, стало намного понятнее.
ёхо-хо ! почему я раньше не смотрел этот ролик ? Лена, спасибо за разжёвывание с примерами )
Елена, Вы просто богиня понятных объяснений! Спасибо Вам, что берете такие актуальные и сложные темы и так подробно их разбираете! Очень приятно смотреть Ваши видео!
Спасибо за урок! Все супер понятно, доступно и наглядно! Большое спасибо!
Я просто в восторге, очень хорошо, что много примеров и за счет этого очень понятно!
Просто супер - вместо 1000000 заумных объяснений просто взяли и провели за руку. Круто! Спасибо!
Это очень грамотная и наглядная подача материала, именно то, что я искал)
Спасибо, теперь стало понятно, что такое макро и микротаски. Как- то смотрела видео-интервью фронтенд разработчика, так они там такую путаницу навели, что я подумала, будто микротаски - это все, что в стек идёт, а макротаски - в очередь.
Thank you. Very cool explanation of such a difficult topic as Event Loop. Asynchronous code is an Achilles' heel for many people ♻
Очень подробный и понятный разбор. Спасибо большое за проделанную работу!
Это шикарный разбор!
Спасибо вам огромное!
Огромное спасибо за такой детальный разбор и интересные примеры с понятным объяснением!
Ооо, спасибо!)))Недавно только у Вас видео по Event loop-у пересматривал)) а тут еще расширенная версия))
Ну только сегодня же гуглил)) супер попадание, спасибо
Очень важная тема. Спасибо! (Event loop)
Ваще Красотка 👍 как у тебя классно получается доносить инфу 😍
Классная и очень важная тема. Спасибо!
Лайк! Ты большая умничка..)
Спасибо за видео! Очень полезные уроки, а сложные темы так легко и глубоко объясняются =)
У Вас очень классные видео и подача.
Всегда с интересом смотрю.
Но задачи разбираемые Вами пока очень сложны для меня :)
Надеюсь вскоре до них дорасту.
Постепенно всё будет, если что задавайте вопросы. ❤️ Cпасибо большое за отзыв!
I love you 💞Thank you for the great lecture. I love you.
это💣 Спасибо большое!)
подписался сразу после этого видео
спасибо за видео даже не глядя лайк, всё видео у тебя супер!
большое спасибо! очень хорошо объясняете👍 Сколько лет живу, а не знал такую фичу про setImmideite 😅
33:00
вывод: start bar foo zoo foo-2 baz
node -v: v16.9
в 16 ноде process.nextTick выводится строго после промисов)
Видимо не стоит на него полагаться т.к. поведение от версии ноды зависит
У меня установлена v16.12 и собственно урок я с ней записывала. Проверила также 16.9 nextTick идёт первым. Есть ли у вас ссылка на документацию в подтверждение ваших слов или дайте ссылку на ваш код, что запускали?
если быть точнее, версия ноды у меня: 16.9.1
Ссылку не получается дать, уже 3й раз сообщение ютуб удаляет. Зайдите на stackoverflow question 67949576. У человека Win10 node v14.17.0 и nextTick запускается после промисов. Все его примеры у меня так же ведут себя (Win11) Видимо это баг винды)
@@ИванИвпнов-п6ь У меня на Windows 11 та же ситуация, выводит start bar foo zoo foo2 baz. Версия ноды v18.12.1 Видимо это особенность win11
А нет, создала новый чистый проект и перепроверила там, выводит как на видео. То есть дело не в Windows, с чем-то другим такое поведение связано было)
Интересно, что если создать package.json и поставить "type": "module", то снова будет выводится start bar foo zoo foo2 baz. Видимо в первый раз в этом было дело
в eventLoop сначала берутся callbacks из таймаута, после callbacks из операций i/o, после берутся callbacks из setImmediate, потому при чтении из файловой системы в cb сначала отработает immediate, а после таймаут
Вау! Спасибо большое! Это лучшее, что я видел по данной тематике!
Какая вы молодец!
Огромное спасибо :)
Очень хорошая подача и задачи. Однозначно лайк.
Больше JavaScripta !!!
В первом примере из секции закрепляем знания не совсем так получается, там callback на I/O не всегда отрабатывает перед setTimeout callback-ом, так что вывод идет 50/50 и слово "timer" может быть выведено раньше, чем "text-open". Скорее всего это зависит от того, на какой стадии event loop мы находимся, так как у timeouts & i/o callbacks в event loop разные стадии.
Супер урок!!Спасибо!!
Thanks for a such clear and detailed explanation. Well done.
Как всегда интересно и познавательно. Спасибо!
спасибо большое, отличное видео
@@alianmanpi35 ❤️
19:30 отличный момент упомянула. Мне на собеседовании попался пример обычного синхронного кода в промисе и я завис. Просто никогда не видел такого
У меня такая же ситуация была однажды на собеседовании :DD
Богиня!
Топ контент, благодарю))
Спасибо! Хорошее видео и подача материала!
Успехов :)
❤️❤️❤️
Крутой видос! Спаисбо! А насколько применима к браузерной части моменты с начала до конца главы с микротасками?
@@kottofey1 применима. Единственное там не все методы. Только часть методов не доступно. Все что есть в браузере работает также.
Ребята, те кто только начал изучать JS, не советую смотреть вам это сейчас. Лучше слушать когда уже ты Junior + минимум. А так Елена молодец. Очень важная тема, которую максимально детально разжевала. Елена выходите за меня замуж! 😀
😘
Большое спасибо за такую доступную подачу материала, это очень важно объяснять так, чтобы было понятно абсолютно каждому. Подскажите еще пожалуйста, а на каких языках программирования Вам приходится писать в вашей компании, ну или какие фреймворки используете?
Основной язык JavaScript, а вместе с ним куча всего preact, graphql, zustand, nodejs, koa, typescript, theme-ui, sanity, fastly, CI и т.д.
@@webelart понял, спасибо за ответ)
Лен, интересно было бы послушать про чистую архитектуру дядюшки боба, с реализацией для ноды, а то что-то так и не могу подробно понять что там да как
О, интересно, не читала эту книгу. Но читала две другие идеальный программист и чистый код, помню осталась очень довольна. Надо будет придержать в уме про чистую архитектуру!
@@webelart смотрел вот это видео, но местами не все понял, ua-cam.com/video/CnailTcJV_U/v-deo.html
Ого, спасибо за новый видос!
Но я еще на промисах сижу🥴
О, промисы - это конфетка. Разбирайтесь, держу с вами кулачки на понимание! ❤️
А как обрабатывается код до call stack, кода создаешь переменные даешь им значения, примитивные и реферальные типа, где они хранятся и так далее?
Спасибо!
Так, а что именно относится к мироктаскам, макротаскам? не совсем понял. И почему setInterval относится к api, а не к макротаскам? И для чего конкретно нужен nextTick?
Спасибо, круто объяснила очень. Не очень понятно почему рекурсия засорила стек, а цикл нет.
Я правильно понимаю, что в случае цикла консоль после выполнения тут же очищалась из стека, и по этому в стеке всегда было не больше 1й записи.
А в случае с рукурсией в стек записывалась f(), затем консоль которая после выполнения сразу очищалась, и после этого снова f() и так пока стек не засорится полностью, да?
Стек предназначен для функций, по факту цикл это не функция. Это некоторый код внутри функции, он может выполняться долго и тем самым функция в стеке будет просто подольше находиться. console.log - это функция, поэтому кладется в стек, т.к. внутри нее нет других функций, то она сразу оттуда уходит. Если бы были внутри функции они бы выше положились. Т.е. базовая функция не может завершить свое выполнение до тех пор пока весь код внутри нее не отработает и все функции внутри нее не завершатся тоже.
Привет, а почему ты не пользуешься autosuggestion в VSCode?
Иногда использую, но в основном просто набираю, так привычнее :)
@@webelart ну с ними код же быстрее пишется, необычно писать код без подсказок))
Круто
Здравствуйте Елена. Сделайте пожалуйста урок по API Яндекс.Карт.
комментарий для продвижения этого видео!
як раз шукав матеріал по івент лупу, дякую)
Простите за глупый вопрос , разбор event loop здесь и в вашем другом видео это разные вещи или одно и тоже ?
Вопрос отличный! ;) В прошлом видео не было разбора macro и micro задач, т.е. в целом деления очередей, была одна очередь для простоты + там был упор на браузер, здесь nodejs (появляются доп. методы такие как process.nextTick, setImmediate), но в тоже время если без них то в браузере похожая логика (нет очереди next tick) и я тут тоже про него упоминала (про браузер).
@@webelart Спасибо за ответ, обожаю ваши видео
Спасибо за классные видео!!! Хотелось спросить, где вы изучали «внутренности» джса и принципы работы его движка?
Елена , в шахматы играешь?
Не, в шахматы нет. Но я в шашки могу! 😁
@@webelart могу научить, ты нас учишь и я готов добром ответить :) увлекательная игра, не оторваться👍..в шашках тоже думать надо😉
@@theoty-js Ого! В шахматы пока не планировала учиться, однако возьму на заметку, что если что могу вам написать. ❤️ А так очень мечтаю научиться нормально на пианино играть, вот это прямо моя мечта. :)))
@@theoty-js Спасибо большое за предложение!!! 🤗
@@webelart с приятным людям рад идти навстречу 😉🤗 шахматы это интересная головоломка, для разработчиков самое 😊 тактика, стратегия, просчёт... Главное вникнуть, а там пошло - поехало)
Я пока только скачал курс "как стать программистом JS за месяц" так что мне все сложно и непонятно. Через месяц загляну, ахахаххаа
Интересно было посмотреть... Блондинка. vs node js
Привет, Елена.
Привет, Сергей! 🙃
Ochen' horoshie primeri, no obyasnenie tolko s pomosch'y console - kone4no ne mnogim bydet ponyatno.
Mojno bili bi sdelat' naprimer 3 kolonki - macro | micro | main ---> i zasovivat' calls tyda.
(nextTick eto to je microtask to je - mojno v printsepi ne razdelyat' ego na "nextTick - Queue", no on pobejdaet Promise - t k y nego higher priority)
Voobs4e o4en priyatno videt' takoi content od devyshki - girls power !!!
Ноде)))
Я не уверен, но разве устройство event loop в nodejs и в браузере это не разные вещи 😮
Думаете по разному. В браузере когда запускается JS тоже есть движок для запуска и там используется и они вроде как одинаковые с nodejs. Но если есть доп информация делитесь. В любом случае и в браузере и в nodejs event loop есть.
@@webelart Они похожи по принципу, но отличаются. В браузере там макротаски и микротаски, в Node.js там вместо макротасок идёт последовательность фаз
Привет)
Привет, привет! :)
привет! спрасибо за труд и работу, но для этой темы нужно больше визуализации, что когда и куда попадает, т.к. на собеседованиях эту тему спрашивают очень глубоко в детелях. вот пример хорошей визуализации ua-cam.com/video/vIZs5tH-HGQ/v-deo.html
У меня было видео с визуализацией ua-cam.com/video/3naT39judvQ/v-deo.html. И даже там я более подробно рассказываю про устройство js heap, web api и то, как работает event loop. По тому что вы скинули, человек не покрыл огромное количество деталей и по факту разобрал только setTimeout. Что касается текущего видео, то оно покрывает event loop очень подробно со всеми очередями и кучей особенностей, чего в скинутом вами видео даже близко нет.
@@webelart понял. спасибо! недавно стал Вашим подписчиком. всё посмотрю/изучу. ещё раз спасибо за Вашу работу. продолжайте пж-та
@@serdotsenko ❤️😘
НОДИJS
НодЕ ухотре режит(
Привет.А зачем ты так подробно рассказываешь про stack ?Начинающие всё равно ничего не поймут.Стэк нужно изучать в ассемблере чтобы понять что к чему
Привет! Начинаю со стека, чтобы изложение было последовательным.
Изучать стек можно по разному: можно на примерах и на словах, можно на тарелках, можно консоль Google Chrome открыть и показать как происходит складывание, а ещё можно с помощью одного моего видео ua-cam.com/video/i5PfPoX88wI/v-deo.html, очень крутое кстати. В общем, как удобно и понятно, так и нужно его изучать. ❤️
пора перехолдить на английский!