심과 폴리 필의 차이점은 무엇입니까?


406

둘 다 웹 개발 분야에서 사용되는 것 같습니다 (예 : HTML5 Cross Browser Polyfills 참조) .

여기에서 모든 심, 폴백 및 폴리 필을 수집합니다.

또는 es5-shim 프로젝트가 있습니다.

현재 프로젝트에서 여러 가지를 사용하고 있으며 모두 동일한 디렉토리에 고정하고 싶습니다. 그래서이 디렉토리를 무엇이라고 부를 까요 --- shims또는 polyfills?


6
다시 열기 : "이 디렉토리를 무엇이라고해야합니까?"는 의견을 기반으로 할 수 있다고 생각하지만 실제로 질문의 더 큰 맥락은 제공되지 않으며이 질문의 가장 중요한 측면도 아닙니다. 여기에있는 모든 답변은 동의 한 것으로 보이며 사실, 참조 및 특정 전문 지식이 많이 사용됩니다.
nobar

답변:


386
  • 심은 수행은 API 호출의 방수 해당 코드의 어떤 부분이며 추상화 계층을 제공한다. 반드시 웹 애플리케이션 또는 HTML5 / CSS3으로 제한되지는 않습니다.

  • polyfill는 A는 심의 유형 현대 HTML5와 개조 레거시 브라우저 / CSS3 보통 자바 스크립트 나 플래시를 사용하여 기능 있음.

shims디렉토리를 일반으로 유지하려면 특정 질문에 대답하고 디렉토리를 호출하십시오 .


234

틈 메우는 나무

어댑터 패턴에 익숙하면 심이 무엇인지 알 수 있습니다. 심은 API 호출을 가로 채고 호출자와 대상 사이에 추상 계층을 만듭니다. 일반적으로 심은 역 호환성을 위해 사용됩니다. 예를 들어 es5-shim npm 패키지를 사용하면 ES5 (ECMAScript 5) 구문을 작성할 수 있으며 브라우저가 ES5를 실행 중인지 여부는 신경 쓰지 않습니다. 가지고 Date.now를 예로 들어. ES3의 구문이 new Date (). getTime () 인 ES5의 새로운 함수입니다 . 당신이 사용하는 경우 ES5를-심은 당신이 쓸 수 Date.now을 하고 지원에서 실행중인 브라우저가 ES5 경우는 실행됩니다. 그러나 브라우저가 ES3 엔진을 실행중인 경우 es5-shimDate.now에 대한 호출을 차단합니다.대신 새 Date (). getTime ()을 반환하십시오 . 이 차단을 shimming이라고합니다. es5-shim의 관련 소스 코드는 다음과 같습니다.

if (!Date.now) {
    Date.now = function now() {
        return new Date().getTime();
    };
}

폴리 필

폴리 필링은 실제로 특수 버전의 shimming입니다. Polyfill은 API에서 누락 된 기능을 구현하는 것에 관한 것이지만 shim은 기능을 수정하는 것만으로 누락 된 기능을 구현하는 것이 아닙니다. 나는 이것이 모호한 것처럼 보이지만 shim이 더 넓은 용어로 사용되는 경우 polyfill은 이전 브라우저에 대한 하위 호환성을 제공하는 shim을 설명하는 데 사용됩니다. 따라서 심이 오래된 죄를 덮는 데 사용되는 반면, 폴리 필은 미래의 향상을 되 찾는 데 사용됩니다. 예를 들어 IE7에서는 sessionStorage를 지원하지 않지만 sessionstorage npm 패키지 의 polyfill은 데이터를 창의 name 속성에 저장하는 것과 같은 기술을 사용하거나 쿠키를 사용하여 IE7 이상에서이 기능을 추가합니다.


107
따라서 심이 오래된 죄를 덮는 데 사용되는 반면, 폴리 필은 미래의 향상을 되 찾는 데 사용됩니다. 이것은 나에게 모든 것을 요약합니다. 명확한 설명 감사합니다.
JohnnyQ

이 답변은 도움이됩니다. 그러나 두 용어는 종종 es5-shim을 포함하여 웹에서 정확하게 사용되지 않는 것 같습니다. 나는 es5-shim이 당신의 정의에 따라 shim과 polyfills의 혼합이라고 생각합니다.
Matt Browne

와우-> 따라서 심이 오래된 죄를 덮는 데 사용되는 반면, 폴리 필은 미래의 향상을 되찾기 위해 사용됩니다. <-많은 감사합니다!
zeppelin

3
날짜 예는 Polyfill처럼 보입니다. 왜 폴리 필이라고 생각합니까? Date.now는 기본 호출이므로 Polyfill은 브라우저와 동일한 API로 해당 기능을 추가합니다. 심에는 다음과 같은 새로운 API가 제공됩니다 MyShim.Date.now(); . 틀린 경우 수정하십시오.
TatzyXY

99

내가 이해 한 것에서 :

폴리 필은 특정 "예상 된"API가 없는지를 감지하여 수동으로 구현하는 코드입니다. 예 :

if (!Function.prototype.bind) { Function.prototype.bind = ...; }

shim은 기존 API 호출을 가로 채고 다른 동작을 구현하는 코드입니다. 여기서 아이디어는 여러 환경에서 특정 API를 정규화하는 것입니다. 따라서 두 브라우저가 동일한 API를 다르게 구현하면 해당 브라우저 중 하나에서 API 호출을 가로 채서 다른 브라우저와 동작을 조정할 수 있습니다. 또는 브라우저 중 하나의 API에 버그가있는 경우 해당 API에 대한 호출을 다시 가로 챈 다음 버그를 피할 수 있습니다.


66

그의 책 Speaking JavaScript 에서 Axel Rauschmayer 를 인용 :

  • shim은 해당 환경의 수단 만 사용하여 이전 환경에 새 API를 제공하는 라이브러리입니다.
  • 폴리 필은 브라우저 API의 심입니다. 일반적으로 브라우저가 API를 지원하는지 확인합니다. 그렇지 않은 경우 polyfill은 자체 구현을 설치합니다. 따라서 두 경우 모두 API를 사용할 수 있습니다. 폴리 필이라는 용어는 주택 개량 제품에서 비롯됩니다. 레미 샤프 에 따르면 :

    Polyfilla는 미국에서 Spackling Paste로 알려진 영국 제품입니다. 그것을 염두에두고 : 브라우저를 균열이있는 벽으로 생각하십시오. 이 [polyfills]은 균열을 부드럽게하고 브라우저의 매끄러운 벽을 제공합니다.


9

틈 메우는 나무. shim은 해당 환경의 수단 만 사용하여 이전 환경에 새 API를 제공하는 라이브러리입니다.

폴리 필. 2010 년 10 월, Remy Sharp는 "polyfill"이라는 용어에 대해 [Rick Waldron을 통해] 블로그했습니다.

폴리 필은 개발자가 브라우저가 기본적으로 제공 할 것으로 기대하는 기술을 제공하는 코드 (또는 플러그인)입니다. 원한다면 API 환경을 평탄화하십시오.


8

몇 년 전부터 이것에 대해 설명하는 환상적인 기사 :

폴리 필이란 무엇입니까?

이 기사에서 (2)는 다음과 같이 간단히 대조됩니다.

Shim : 추가 할 수있는 코드 조각 (예 : JavaScript일부 기능을 수정하지만 대부분 자체 API가 있음) .

Polyfill : 드롭 할 수있는 것 (예 :) 은 지원되지 않는 기존 브라우저 APIJavaScript 를 모방하기 위해 자동으로 작동합니다 .


1
나는 이것이 일반적인 사용법과 당신이 링크 한 블로그 포스트에서 Remy Sharp가 실제로 말하는 것을 오도하는 것으로 생각합니다. Shim 은 요즘 polyfill 과 동의어로 가장 많이 사용되며 (특히 es5-shimes6-shim 참조 ) Remy는 (와 비교하여 ) 사용자 정의 API에 대해 'shim'이라는 단어 언급한다는 점 특히 중요 합니다shim.gif . 그는 이런 방식으로 단어를 사용하도록 지시하지 않았으며 "나에게" 라고 말함으로써 그의 사용법이 보편적이지 않다는 것을 암묵적으로 인정하고 있습니다.
Mark Amery
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.