Phân biệt microtask và macrotask trong event loop

Chào các bác,

  1. Các bác giúp em phân biệt microtask và macrotask trong hàng đợi queue của eventloop với. Mục đích V8 engine chia ra 2 loại queue này để làm gì? Thứ tự chạy của các task trong các queue này như thế nào?
  2. Khi gọi một hàm async thì làm sao biết nó sẽ vào queue nào? Tại sao promise là microtask, còn setTimeout là macrotask mà không phải ngược lại? Do mặc định ECMAScript tạo ra vậy hay còn lý do nào khác?
  3. setTimeout là một web API hoạt động trên browser, vậy nếu chạy trên môi trường NodeJS thì có gì khác không?

Chúc các bác năm mới vui vẻ :clap:

1 Like

Câu 1)

Các bác giúp em phân biệt microtask và macrotask trong hàng đợi queue của eventloop với. … Thứ tự chạy … như thế nào?

Có 2 loại task queue đó là macroTask Queue và microTask Queue, macroTask còn có tên gọi khác là Task Queue và microTask cũng có tên gọi là Job Queue. Hai task này nhìn chung là như nhau , những task trong Job Queue ưu tiên hơn những task có trong Task Queue. Thứ tự chạy của các task trong hai queue này như sau:

Ở mỗi chu kỳ của event-loop, nó sẽ check xem call stack có rỗng không, nếu rỗng:

  • Lấy một task cũ nhất trong Task Queue ra chạy.
  • Sau khi task trong Task Queue chạy xong, event loop sẽ nhìn vào Job Queue (chứa microTask) và chạy hết tất cả các tasks trong này.
  • Kết thúc chu kỳ event-loop quay lại bước 1 cho đến khi chay hết task queue.

Câu 2)

Khi gọi một hàm async thì làm sao biết nó sẽ vào queue nào?

  • Để đưa một task vào Task Queue ta có một số API vd như setTimeout, setInterval, setImmediate, requestAnimationFrame, I/O callback, UI render v.v

  • Còn nếu muốn đưa task vào Job Queue ta có process.nextTick, Promises, Object.observe, MutationObserver, ququeMicrotask

Tại sao promise là microtask, còn setTimeout là macrotask mà không phải ngược lại?

Việc này là tùy vào implementation sẽ đưa task vào Job Queue hay TaskQueue, theo mình thấy những browser như Edge, Firefox, Safari sẽ khác với Chrome. Chrome đưa task promise vào microTask, và setTimeout vào macroTask. Đọc thêm bài này khá hay https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/

Câu 3)

setTimeout là một web API hoạt động trên browser, vậy nếu chạy trên môi trường NodeJS thì có gì khác không

Kết quả mong đợi khi ta chạy API này đó là phần code trong callback sẽ được đưa vào Task Queue để chạy sau khi timeout. Tuy nhiên thì có thể nodejs nó sẽ có implementation khác so với browser. Sự khác biệt không đáng kể lắm.

10 Likes

Anh giải thích rõ hơn đoạn chu kỳ event loop được không? Search google event loop life cycle mà không thấy liên quan thứ tự chạy. Thanks.

1 Like

mình search thấy bài này, ko biết đúng ý bạn không https://www.voidcanvas.com/nodejs-event-loop/

6 Likes

Theo em tìm hiểu thì macrotask queue hình như có 2 tên gọi: task queue hoặc callback queue ạ.

https://stackoverflow.com/questions/40880416/what-is-the-difference-between-event-loop-queue-and-job-queue#:~:text=The%20key%20thing%20is%20here,first%20synchronous%20code%20is%20executed.&text=then%20promises%20are%20sent%20to,sent%20to%20the%20callback%20queue.

2 Likes

Task cũ nhất là sao anh? Là task nằm ở đầu queue sắp bị deQueue phải không?

83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?