Có nên sử dụng Modernizr và HTML5 Shiv cùng nhau ?

Modernizr và HTML5 Shiv mà 2 thư viện không thể thiếu cho bất kỳ website nào  nhằm hỗ trợ giải quyết các vấn đề về cross browser cụ thể là đối với việc hiển thị website trên các trình duyệt cũ như IE 6,7,8 và các version cũ của chrome hay firefox. Vậy sử dụng Modernizr và HTML5 thế nào cho đúng ?

Trước tiên chúng ta tìm hiểu qua xem Modernizr và HTML5 Shiv là gì ?

Modernizr là gì  ?

Modernizr là thư viện JavaScript nhỏ tự động phát hiện sự tồn tại của các công nghệ web hiện đại trong các trình duyệt của người dùng. Cụ thể các công nghệ như canvas, webgl, csstransforms csstransforms3d và mọi thứ sẽ được truyền dưới dạng class name và được đặt vào trong thuộc tính class trong thẻ <html>

Một ví dụ điển hình đặt ra để đễ hiểu hơn về Modernizr như sau:
Nếu trang web của bạn hiển thị trên trình duyệt IE7 và nó ko hoàn toàn hiểu được các thuộc tính CSS3 cụ thể như thuộc tính box-shadow vậy Modernizr sẽ giúp bạn add 1 class .no-boxshadow vào thẻ <html> và việc còn lại của bạn là dùng class .no-boxshadow để sửa lại css cho các element bị mất box-shadow do trình duyệt IE7 không hộ trợ. Thật tuyệt vời phải không 😀

HTML5 Shiv là gì  ?

HTML5 Shiv là thư viện JavaScript nhỏ cho phép các trình duyệt cũ như Internet Explorer 6-9, Safari 4.x (iPhone 3.x), và Firefox 3.x có thể hiểu được các thẻ HTML mới  trong HTML5.

Vậy HTML5 Shiv hoạt động như nào ?
Rất đơn giản HTML5 Shiv chỉ đơn giản là nó sẽ đi tìm tất cả các thẻ HTML mới của HTML5 và chuyển nó sang 1 thẻ mà tất cả các trình duyệt đều hiểu đó là thẻ <div> 🙂

Có nên cùng sử dụng Modernizr và HTML5 Shiv ?

Câu trả lời là không ! vì các phiên bản mới nhất của Modernizr đã được tích hợp sẵn HTML5 Shiv

Nguồn tham khảo:
https://modernizr.com/
https://github.com/aFarkas/html5shiv