Tôi đọc bài viết dưới đây gợi ý sử dụng các hàm mảng có sẵn trong JavaScript. Tôi luôn nghe nói rằng những phương pháp đó chậm hơn đáng kể so với vòng lặp for
tích hợp, nhưng tôi chưa bao giờ thực sự tự mình đo lường nó
Đơn giản hóa JavaScript của bạn — Sử dụng. bản đồ[],. giảm [] và. lọc[]
Nếu bạn chưa nghe nói về. bản đồ[],. giảm [] và. filter[] trong JavaScript, bạn có thể muốn học cách sử dụng nó
trung bình. com
Vì vậy, tôi nghĩ rằng bây giờ là một thời điểm tốt như bất kỳ. Vì vậy, chúng ta hãy chạy một số bài kiểm tra
đường cơ sở
Máy tôi đang chạy mã là MacBook Pro có 2. Bộ xử lý Intel Core i7 Quad-Core 5GHz và bộ nhớ DDR3 16GB 1600 MHz. Phiên bản nút của tôi là 12. 14. 0
Mặc dù độ dài mảng tối đa là 2³², nhưng máy tính của tôi thực sự không thể tạo mảng có độ dài đó mà không gặp lỗi JavaScript heap out of memory
. Dựa trên thử nghiệm cục bộ, mảng chiều dài 50 triệu là cao nhất tôi có thể đi
Tiêu chuẩn
Các chức năng này sẽ được đánh giá theo hai cách
- mức sử dụng bộ nhớ — được đo bằng cách sử dụng
process.memoryUsage[].heapUsed
- tốc độ thực hiện — được đo bằng đối tượng
Date
và toán cấp một
Kịch bản
Tập lệnh tạo 500 mảng với gia số 100K, đo thời gian thực thi của mỗi mã và xuất ra tệp CSV
Các thí sinh là ai?
filter
for
forEach
for / in
- ________số 8_______
map
Bây giờ, hãy xem mỗi chức năng thực hiện như thế nào. Ai vui mừng về kết quả?
Ảnh của Camylla Battani trên Bapt. Cô ấy chắc chắn là
Lọc
Tốc độ tăng tuyến tính
Biểu đồ bộ nhớ cho thấy khoảng cách giữa mỗi đỉnh rút ngắn đáng kể sau 33M chiều dài. [Điều này rất thú vị, nhưng tôi vẫn chưa hiểu tại sao điều này lại xảy ra. ]
Vì
Tốc độ duy trì dưới 20ms cho đến 33. 9M. Sau đó, nó nhảy lên tới 510ms và tăng dần lên 782ms ở 50M
Bộ nhớ cho thấy một mô hình tương tự, với các đỉnh được siết chặt cũng vào khoảng 33M
Cho mỗi
Tốc độ tăng tuyến tính
Trí nhớ tuân theo một khuôn mẫu tương tự [bạn sẽ nghe tôi nói điều này một vài lần nữa]
Tại
Tốc độ tăng tuyến tính nhưng ồn hơn so với các chức năng khác
Trí nhớ không theo khuôn mẫu. Thực sự có sự sụt giảm trong việc sử dụng bộ nhớ vào khoảng 43M
cho của
Tốc độ tuân theo một mô hình tương tự như vòng lặp for
. Sự tăng đột biến xảy ra ở 33. 6M. Trước khi tăng đột biến, tốc độ duy trì dưới 50 mili giây
Bộ nhớ theo mô hình bình thường
Bản đồ
Tốc độ tăng tuyến tính với mức tăng đột biến [bạn đoán nó. ] 33. 4M
Bộ nhớ theo các mẫu trước đó như trước
Kết quả tốc độ
Hãy so sánh tốc độ cho từng chức năng
Cho đến nay, JavaScript heap out of memory
1 và map
thực hiện tệ hơn. Hãy loại bỏ cả hai cái đó để có cái nhìn rõ ràng hơn về bốn cái còn lại
for
là nhanh nhất cho đến khi chúng ta đạt khoảng 33. Chiều dài 5M, nhưng trở thành người chậm nhất trong quá khứ, trong đó JavaScript heap out of memory
4 trở thành người chiến thắng rõ ràng về tốc độ
Cả for
và JavaScript heap out of memory
4 đều đạt một điểm ở đó tốc độ tăng mạnh, trong đó forEach
và filter
tăng tuyến tính trong toàn bộ bài kiểm tra
Kết quả bộ nhớ
Mặc dù biểu đồ rất nhiễu, nhưng nhìn chung chúng ta có thể thấy rằng for
, JavaScript heap out of memory
4 và forEach
sử dụng ít bộ nhớ hơn so với phần còn lại
Lời phán quyết
Dựa trên dữ liệu tốc độ và bộ nhớ, vòng lặp for
xuất hiện hôm nay với tư cách là người chiến thắng. Đây là cách nhanh nhất cho hầu hết các trường hợp sử dụng phổ biến [e. g. mảng có chiều dài dưới 33 triệu] và hiệu quả bộ nhớ hơn so với phần còn lại
Tất nhiên, để sử dụng lập trình hàng ngày, bất kỳ phương pháp nào trong số này sẽ đủ nhanh. Dưới 1 triệu, tất cả trừ map
và process.memoryUsage[].heapUsed
4 có thể kết thúc trong khoảng 10 mili giây
Có một vài câu hỏi mở mà tôi hy vọng sẽ đi sâu vào một bài viết trong tương lai. [tất nhiên, tôi hoan nghênh mọi thông tin chi tiết]
- Tại sao các vòng lặp
for
vàprocess.memoryUsage[].heapUsed
6 lại chạm đến một điểm quan trọng khiến tốc độ giảm mạnh? - Tại sao biểu đồ trí nhớ lại thay đổi theo _______2_______7 tại cùng điểm tới hạn như #1?
- Điều gì làm cho
map
chậm hơn đáng kể so với vòng lặpfor
? . [Bài kiểm tra khác cho lần sau. ] - Tại sao
process.memoryUsage[].heapUsed
4 hoạt động kém hơn nhiều so vớiprocess.memoryUsage[].heapUsed
6?
Cảm ơn vì đã đọc. Đây là một thử nghiệm cực kỳ thú vị đã đẩy hệ thống làm mát máy tính của tôi đến giới hạn [nó thực sự rất nóng]. Hãy thả cho tôi một bình luận