Web Workers là gì? Công cụ tăng hiệu năng trang web mạnh mẽ

Рет қаралды 11,557

HoleTex

Күн бұрын

Пікірлер: 34

@khaitrung28 2 ай бұрын

Hay quá anh, kiến thức này đã được tiếp thu ❤‍🔥

@vuinhtien6513 2 ай бұрын

hay quá, mong bạn ra thêm video dễ hiểu và có demo như này

@youngtee_01 2 ай бұрын

nội dung chất lượng quá anh ! cảm ơn a 🤞🤞

@newhorizon7215 2 ай бұрын

Video rất hay. Mong anh ra nhiều video về việc tối ưu như này

@bug_hunter_001 2 ай бұрын

kiến thức đã được tiếp thu, cám ơn anh rất nhiều ạ

@atovan3236 2 ай бұрын

Video rất hữu ích a ơi :DD

@chuongtran2208 2 ай бұрын

Cảm ơn anh, video rất hay ạ!

@vubuiminh2804 2 ай бұрын

Bổ ích quá anh ơi

@narasheo4229 2 ай бұрын

video rat huu ich, thank a

@huyvunguyen7128 2 ай бұрын

Video hay thật sự

@t_himmel6524 2 ай бұрын

quá hayy a ạ❤❤

@hauladv 2 ай бұрын

hưu ích quá anh, mà nextjs mình có cần dùng web workders không anh nhỉ?

@QuanNguyenViet-zt6zb 2 ай бұрын

Ví dụ nếu áp dụng trong dữ liệu data từ BE và lọc dữ liệu bên FE mà quá lớn thì mình có thể áp dụng worker vào tính toán cho nhanh đúng ko ạ.

@HuyPham-ov1qd 2 ай бұрын

Cảm ơn anh về video. Em có thắc mắc: Vì JS là đơn luồng nên nó sẽ nhờ môi trường của nó xử lý những tác vụ bất đồng bộ (Web API, Node JS Libuv) vậy thì những môi trường này sẽ handle giúp chúng ta về việc multi thread giống như WebWorker này phải không a.

@conghieu3299 2 ай бұрын

Không bạn ơi, Bạn có thể tìm hiểu về Event loop. Bản chất vẫn là đơn luồng, máy tính sử dụng 1 thread để handle. Nó chỉ non-blocking các Micro/Macro task và các tác vụ được xử lý rất nhanh nên bạn cảm thấy như không có độ trễ thôi. Còn thread ở đây là computer thread.

@nguyenminhtan5474 2 ай бұрын

@@conghieu3299Non blocking main thread chứ enviroment thread thì nó muốn xử lý đơn hay đa luồng gì cũng được chứ nhỉ?

@khanh.nguyen 2 ай бұрын

Cơ bản là đúng bạn, ví dụ khi event loop chạy qua 1 lệnh fetch (là một Web API) trong call stack, lệnh fetch này sẽ được đẩy sang cho môi trường (trình duyệt, node js), sau đó event loop sẽ tiếp tục thực hiện các công việc khác trong call stack, còn việc gửi HTTP request qua mạng như thế nào, bắt các sự kiện lỗi như thế nào đều do môi trường xử lý, chỉ khi nào có kết quả (hoặc lỗi) thì kết quả (hoặc lỗi) đó sẽ được đẩy vào micro task queue, sau khi call stack trống thì event loop sẽ lấy kết quả trong micro task queue đưa vào call stack để xứ lý tiếp.

@HuyPham-ov1qd 2 ай бұрын

@@conghieu3299 Cảm ơn bạn đã chia sẽ, đúng là event loop có cơ chế đơn luồng nhưng nó chỉ đơn luồng trong việc phân bổ request cho các thread thích hợp. Nếu có 1 request yêu cầu 1 tác vụ phức tạp thì event loop sẽ giao cho thread trong libuv thread pool hoặc worker thread xử lý. Ý kiến cá nhân của mình: Nếu JS là đơn luồng và nhờ 1 bên đơn luồng khác xử lý tác vụ phức tap thì sẽ hơi lấn cấn, nên mình nghĩ bên dưới sẽ có logic multi thread. Về ý Micro/macro bạn có nói ở trên: Nếu như có 1 macro task thực hiện fibo(45) như video thì việc "rất nhanh gần như không có độ trễ" là rất khó.

@conghieu3299 2 ай бұрын

@@HuyPham-ov1qd "Nếu có 1 request yêu cầu 1 tác vụ phức tạp thì event loop sẽ giao cho thread trong libuv thread pool hoặc worker thread xử lý". Node có libuv hỗ trợ I/O, crypto, zlib,... mình đồng ý cái này có chạy ở thread khác và trả kết quả qua callback, còn Worker thread thì mình phải tạo tay (khai báo new Worker) chứ event loop không tạo mới worker. Cả microtasks và macrotasks đều chạy trên cùng một thread nơi event loop đang hoạt động. 1 thread khác sẽ có 1 vùng nhớ (ram) khác (có share nhưng cần config) và chỉ giao tiếp được qua post message. Và mỗi worker thread sẽ có 1 event loop riêng biệt. fibo(45) n lâu khi chạy trên main thread nên mới gây ra block đó b, còn khi chạy trên thread khác thì main thread k sao. Tóm lại: event có hỗ trợ đa luồng một số tác vụ: I/O, crypto, zlib,... Ngoài ra muốn chạy đa luồng cần khai báo. Luồng mới có event loop độc lập, memoies với luồng main. Không tham chiếu được đến biến của các luồng khác nhau.

@nemo213-99 2 ай бұрын

hay anh ạ, Cho em hỏi trong thực tế sẽ ứng dụng web workers vào đâu ạ. Vì e thấy nó chỉ áp dụng cho các bài toán tính toán phức tạp, thì trên FE đa số k cần care mà để cho BE xử lý ạ

@kno.99 2 ай бұрын

Web worker bị hạn chế một vài thứ, ví dụ như không thể trực tiếp tương tác với DOM. Nên có thể ứng dụng nó vào việc thực thi các untrusted code mặc dù giải pháp này không quá hoàn hảo

@codetoanbug99 2 ай бұрын

anh ơi anh làm về chủ đề Rxjs với redux đi a

@phantrungkien3049 2 ай бұрын

cái này có áp dụng vào node or nestjs ko a

@CuongNguyen-oj1lc 2 ай бұрын

lúc chạy chỉ là song song với main thread chưa chưa phải là chạy song song nhiều worker 1 lúc để xử lý đúng không anh. đoạn 14:00 thấy nó lên từng cái một.

@holetex 2 ай бұрын

Nó chạy đồng thời đó em, xong từng cái 1 vì có cái mình nhấn trước nhấn sau nên nó ko kết thúc đồng thời. Còn bên main thread thì với đoạn code đó nó chạy tuần tự xong cái này mới tới cái tiếp

@chungbui5594 2 ай бұрын

@@holetexe thấy thực tế nó vẫn phài đợi xong từng cái từng cái một á a, a check lại thử ạ

@holetex 2 ай бұрын

@@chungbui5594 anh mới check kĩ lại, em nói đúng rồi, trong ví dụ anh sử dụng useRef nên nó luôn tham chiếu tới cùng 1 worker khi component bị re-render. Đối với mỗi 1 worker thì sẽ chạy tuần tự, nó chỉ chạy song song khi mình tạo nhiều worker với keywork new Worker thôi