Mục lục nội dung
Introduction
Chúng ta có nhiều cách để hỗ trợ viết javascript cho những trình duyệt phiên bản cũ (IE 8, IE 9…), một trong số chúng là sử dụng Polyfill.Bạn đang xem: Polyfill là gì
What’s a polyfill?
Polyfill là một đoạn code để chỉ cho browser những cách để implement các javascript feature. Một khi chúng ta đã sử dụng polyfill cho một function nào đó thì sau đó chúng ta sẽ không cần lo lắng về việc liệu function hay method ta vừa viết có được browser support hay không nữa.
Bạn đang xem: Polyfill là gì
Polyfill có phương thức hoạt động khá đơn giản như sau:
check xem feature có được browser support hay khôngnếu browser không support, nó sẽ add code để support việc implement featurecheck xem feature có được browser tư vấn hay khôngnếu browser không tư vấn, nó sẽ add code để tư vấn việc implement featureLấy ví dụ về method Array. prototype.find, trong trường hợp browser không tư vấn Array. prototype.find, nó sẽ hướng dẫn browser cách để implement :
Using Polyfills
Về cơ bản, có 2 cách để sử dụng polyfill :Polyfill manually: theo cách thủ công (giống như ta làm ở trên)Polyfill library: add nhiều polyfill cùng một lúc thông qua thư viện
Polyfilling manually
: theo cách bằng tay thủ công ( giống như ta làm ở trên ) : add nhiều polyfill cùng một lúc trải qua thư việnĐầu tiên tất cả chúng ta phải search polyfill mà tất cả chúng ta cần, hoàn toàn có thể trải qua google, hiện giờ hầu hết những function hay method mới mà những browser cũ ít tương hỗ đều có sẵn polyfill trên MDN .Sau khi tìm được polyfill tương thích, tất cả chúng ta hoàn toàn có thể add nó vào như đoạn code bên trên .
Polyfill library
Lưu ý polyfill là một phần của shim. Shim là một thư viện cung cấp các API riêng biệt hoàn toàn cho các browser cũ mà không hỗ trợ các API cùng tên.
Xem thêm: Tìm Hiểu Ưu Nhược Điểm Của Phần Mềm Whatsapp Là Gì, Whatsapp Là Gì
Using cutting-edge JavaScript features
Ngoài ra tất cả chúng ta hoàn toàn có thể sử dụng Babel – là tool với công dụng chính là compile Javascript, trong quy trình compile nó hoàn toàn có thể đọc những file js, sau đó convert những file đó về dạng mà browser hoàn toàn có thể hiểu được .
What if polyfills aren’t enough?
Nếu trong trường hợp polyfill vẫn không đủ để tư vấn một feature nào đó, thì tất cả chúng ta nên xem xét lại một chút ít :Liệu có cần dùng chính xác feature đấy cho các browser khác nhau không? chúng ta có thể sử dụng sang 1 feature khác tương đương nhưng đảm bảo các browser đều supportHoặc chúng ta có thể xử lý theo hướng khác mà không cần dùng đến feature đấy, hay thậm chí là không cần đến javascript?Liệu có cần dùng đúng chuẩn feature đấy cho những browser khác nhau không ? tất cả chúng ta hoàn toàn có thể sử dụng sang 1 feature khác tương tự nhưng bảo vệ những browser đều supportHoặc tất cả chúng ta hoàn toàn có thể giải quyết và xử lý theo hướng khác mà không cần dùng đến feature đấy, hay thậm chí còn là không cần đến javascript ?
Không có giải pháp nào là tối ưu, tùy từng trường hợp mà chúng ta có thể sử dụng các hướng giải quyết khác nhau sao cho phù hợp nhất.
Xem thêm: Experiences Là Gì, Nghĩa Của Từ Experience, Experience Là Gì, Nghĩa Của Từ Experience
How to tell if a browser supports the feature?
Để check xem feature mà tất cả chúng ta đang sử dụng được những browser nào tương hỗ, ta hoàn toàn có thể dùng caniuse.com. Viết javascript feature mà tất cả chúng ta muốn check, sau đó tất cả chúng ta hoàn toàn có thể xem tác dụng, vd như với Array. prototype.find :
Beware the cost of JavaScript
Khi tất cả chúng ta sử dụng polyfill, đồng nghĩa tương quan với việc tất cả chúng ta sẽ thêm nhiều dòng code javascript hơn. Một khi số lượng file js quá lớn, cũng sẽ gây nhiều tác động ảnh hưởng :Những browser cũ thường được sử dụng trên những hệ thống cũ, có nghĩa là việc phải tải số lượng file js lớn sẽ ảnh hưởng đến performanceSố lượng file js càng nhiều, quá trình Javascript bundle sẽ càng mất nhiều thời gian hơn
Summary
Những browser cũ thường được sử dụng trên những mạng lưới hệ thống cũ, có nghĩa là việc phải tải số lượng file js lớn sẽ tác động ảnh hưởng đến performanceSố lượng file js càng nhiều, quy trình Javascript bundle sẽ càng mất nhiều thời hạn hơn
Bài viết nhằm chia sẻ về cách để support javascript với các browser cũ qua việc sử dụng Polyfill và các thư viện hay các tool liên quan. Bài viết còn nhiều hạn chế, cảm ơn bạn đã dành thời gian theo dõi.
Source: https://mindovermetal.org
Category: Wiki là gì
