Introduction

Chúng ta tất cả nhiều cách để hỗ trợ viết javascript cho mọi trình lưu ý phiên bản cũ (IE 8, IE 9...), một trong các chúng là thực hiện Polyfill.Bạn đang xem: Polyfill là gì

What’s a polyfill?


*

Polyfill là một đoạn code nhằm chỉ cho browser những cách để implement các javascript feature. Một khi chúng ta đã thực hiện polyfill cho một function nào đó thì sau đó bọn họ sẽ ko cần lo lắng về bài toán liệu function xuất xắc method ta vừa viết dành được browser support hay không nữa.Bạn đang xem: Polyfill là gì

Polyfill tất cả phương thức vận động khá dễ dàng và đơn giản như sau:

check xem feature dành được browser tư vấn hay khôngnếu browser không support, nó sẽ add code để tư vấn việc implement feature

Lấy lấy ví dụ về method Array.prototype.find, vào trường hợp browser không support Array.prototype.find, nó sẽ hướng dẫn browser phương pháp để 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 cho ở trên)Polyfill library: add nhiều polyfill và một lúc trải qua thư viện

Polyfilling manually

Đầu tiên bọn họ phải tìm kiếm polyfill mà họ cần, có thể thông qua google, bây giờ hầu như các function tốt method mới mà các browser cũ ít hỗ trợ đều gồm sẵn polyfill bên trên MDN.

Bạn đang xem: Sự khác biệt giữa shim và polyfill là gì ? polyfill là gì

Sau khi tìm được polyfill phù hợp, chúng ta có thể showroom nó vào như đoạn code bên trên.

Polyfill library

Using cutting-edge JavaScript features

Ngoài ra bạn có thể sử dụng Babel - là tool với chức năng đó là compile Javascript, trong quy trình compile nó hoàn toàn có thể đọc những file js, tiếp nối convert những file đó về dạng mà lại browser có thể hiểu được.

Xem thêm: Vecto Chỉ Phương Và Vecto Pháp Tuyến Trong Không Gian, Cách Tìm Vecto Pháp Tuyến Của Mặt Phẳng

What if polyfills aren’t enough?

Nếu trong trường đúng theo polyfill vẫn không được để support một feature nào đó, thì chúng ta nên cân nhắc lại một chút:

Liệu bao gồm cần dùng đúng chuẩn feature đấy cho các browser khác biệt không? bạn có thể sử dụng qua 1 feature khác tương tự nhưng đảm bảo an toàn các browser đầy đủ supportHoặc chúng ta có thể xử lý theo hướng khác cơ mà không đề xuất dùng mang lại feature đấy, hay thậm chí còn là không đề nghị đến javascript?

How khổng lồ tell if a browser supports the feature?

Để check xem feature mà họ đang áp dụng được các browser như thế nào hỗ trợ, ta hoàn toàn có thể dùng caniuse.com. Viết javascript feature mà chúng ta muốn check, sau đó bạn có thể xem kết quả, vd như cùng với Array.prototype.find:


*

*

Beware the cost of JavaScript

Khi bọn họ sử dụng polyfill, đồng nghĩa tương quan với việc họ sẽ thêm nhiều dòng code javascript hơn. Một khi số lượng file js vượt lớn, cũng biến thành gây nhiều ảnh hưởng:

Những browser cũ thường được thực hiện trên những khối hệ thống cũ, tức là việc bắt buộc tải số lượng file js phệ sẽ tác động đến performanceSố lượng tệp tin js càng nhiều, quá trình Javascript bundle sẽ càng mất không ít thời gian hơn

Summary

Bài viết nhằm share về phương pháp để support javascript với những browser cũ qua việc thực hiện Polyfill và các thư viện hay các tool liên quan. Nội dung bài viết còn những hạn chế, cảm ơn các bạn đã dành thời gian theo dõi.