gì xảy ra khi tôi gọi requestAnimationFrame nhiều lần

Question

tôi có nghĩa là kêu gọi nhiều requestAnimationFrame với chức năng tương tự trong một thời gian

function Draw() { /* DoSomething */ } 
function AFunc() { 
    /* prepare something */ 
    requestAnimationFrame(Draw); 
} 
function BFunc() { 
    /* prepare something */ 
    requestAnimationFrame(Draw); 
} 

window.onload(function(){ 
    AFunc(); 
    BFunc(); 
}); 

Điều gì sẽ xảy ra? Nó sẽ sao chép? Nó sẽ được gọi là 2 lần trong cùng một khung? Hoặc nó sẽ được xếp chồng lên nhau và được gọi trên khung khác biệt?

Answer 1

Từ the MDN documentation:

Phương pháp gọi lại được thông qua một đối số duy nhất, một DOMHighResTimeStamp, mà chỉ ra thời điểm hiện tại khi callbacks xếp hàng bởi requestAnimationFrame bắt đầu bắn. Nhiều cuộc gọi lại trong một khung duy nhất, do đó, mỗi lần nhận được cùng một dấu thời gian mặc dù thời gian đã trôi qua trong quá trình tính toán khối lượng công việc của mỗi cuộc gọi lại trước đó. Dấu thời gian này là một số thập phân, tính bằng mili giây, nhưng với độ chính xác tối thiểu là 1ms (1000 µs).

(tôi nhấn mạnh)

Ngoài ra, from the spec:

Khi requestAnimationFrame() phương pháp được gọi là, tác nhân người dùng phải chạy theo các bước sau:

...

3. Nối đối số của phương thức vào danh sách tài liệu của khung hoạt ảnh cal lbacks

và

Khi user agent là chạy callbacks khung hình ảnh động cho một doc Document với timestamp bây giờ, nó phải chạy theo các bước sau:

...

3. Đối với mỗi mục nhập gọi lại, theo thứ tự: gọi lại số gọi lại

Vì vậy, câu hỏi của bạn:

Điều gì sẽ xảy ra? Nó sẽ sao chép? Nó sẽ được gọi là 2 lần trong cùng một khung? Hoặc nó sẽ được xếp chồng lên nhau và được gọi trên khung khác biệt?

Tất cả các cuộc gọi trên cùng nhau cho thấy các cuộc gọi liên tiếp sẽ được thêm vào danh sách gọi lại, tất cả sẽ được thực hiện theo thứ tự được thêm khi trình duyệt chạy chúng, về cơ bản sao chép cuộc gọi đến Draw trong mã của bạn.