Web Club :: Polyfill(폴리필)

Polyfill : 충전솜

폴리필의 사전적 의미는 충전솜입니다.

예를 들어 베개의 솜이 꺼졌을 때 다시 솜을 살리기 위해 넣는 충전솜처럼 대체 방안을 강구한다는 의미로 해석될 수 있습니다.

Polyfill, Shims, Fallback이란 것들은 용어는 달라도 각각의 목적은 브라우저별로 다름(차이)없는 기능 구현이 목적입니다.

즉, 크로스 브라우징을 염두한 것입니다.

Polyfill 이란?

폴리필(polyfill)은 개발자가 특정 기능이 지원되지 않는 브라우저를 위해 사용할 수 있는 코드 조각이나 플러그인을 말합니다.

폴리필은 HTML5 및 CSS3와 오래된 브라우저 사이의 간격을 메꾸는 역할을 담당하고 있습니다.

HTML5 Cross Browser Polyfills

Modernizr 에서 정리하여 제공하고 있는 각종 폴리필 목록을 참고하면 원하는 기술을 선택하는데 도움이 될 것입니다.

주요한 Polyfill List

html5shiv : HTML5의 섹셔닝 요소(예: <header>, <nav>)를 지원하지 않는 브라우저를 위한 라이브러리
selectivizr : CSS3의 의사 클래스(pseudo-class)와 속성 선택자들을 IE6~8에서 지원하기 위한 라이브러리
Respond : 반응형 웹의 필수 속성중에 하나인 미디어쿼리를 IE6~8에서 지원하기 위한 라이브러리
Placeholder : HTML5의 플레이스홀더(placeholder)의 지원을 통일하기 위해서 제공하는 라이브러리
mediaelement.js : HTML5의 <video>와 <audio> 요소들을 모든 브라우저에서 하나의 파일로 같은 UI를 제공하기 위한 라이브러리
css3pie : CSS3의 border-radius와 box-shadow, liner-gradient를 IE6~9 브라우저에서 지원하기 위한 라이브러리

Mozilla 측에서도 폴리필을 손쉽게 사용하도록 방안을 모색하고 있는데 Polyfill을 사용하는 보다 쉬운 방법을 참고해보길 바랍니다.

Web Club