Paul Irish 님의 requestAnimationFrame shim을 사용하는 브라우저는 무엇입니까?

Question

폴 아이리쉬에는 requestAnimationFrame for Smart Animating이라는 게시물이 있습니다. 이제 Paul은 현명한 사람입니다. 저는이 아이디어의 적용 범위를 이해하려고 노력하고 있습니다.

그는 HTML5 애니메이션을 말한다 -이 같은 requestAnimationFrame 심 사용해야 이해할 수

// shim layer with setTimeout fallback 
window.requestAnimFrame = (function(){ 
    return window.requestAnimationFrame  || 
     window.webkitRequestAnimationFrame || 
     window.mozRequestAnimationFrame || 
     function(callback){ 
     window.setTimeout(callback, 1000/60); 
     }; 
})(); 


// usage: 
// instead of setInterval(render, 16) .... 

(function animloop(){ 
    requestAnimFrame(animloop); 
    render(); 
})(); 
// place the rAF *before* the render() to assure as close to 
// 60fps with the setTimeout fallback. 

합니다. We can apply this in a JSFiddle like this이며 결과가 매우 좋습니다.

하지만 if I rip out the shim layer function이면 Chrome 31 및 Firefox 24에서는 정상적으로 작동합니다.

그래서 compatibility for the RequestAnimationFrame function을 보면 브라우저가 매우 오랫동안이 기능을 사용하고있는 것처럼 보입니다.

내 질문 - 우리는 어떤 브라우저에서 Paul Irish의 요청을 사용하고 있습니까? AnimimationFrame shim? 당신은 그것을 추출 할 수 있고 여전히 작동하며, 브라우저가 오랫동안 그것을 가지고있는 것처럼 보입니다.

Answer 1

이전 버전의 브라우저를 지원하려면 polyfill/shim이 필요합니다.

최신 Firefox와 Chrome에서 프리픽스없이 작동합니다. 파이어 폭스는 new policy not to prefix 기술을 보유하고 있으며, 이는 아마도 좋은 일일 것입니다. 크롬에서도 마찬가지입니다. proposal이 있습니다.

그러나 오래된 브라우저 (그리고 놀랍게도 큰 그룹의 사용자 do)를 실행하면 polyfill이 필요합니다. (이 또한 크롬 부분과 IE10 대 IE9 설명 전체 작년에 포함되어 있지만) 여기

Source

우리는 나이가 크롬 버전을 IE8, 10 다음 상단에 IE9을보고 . 지역에 따라 다양하게 적용될 수 있으므로 신청서와 관련이 있다고 생각되는 지역을 테스트 해보십시오.

Answer 2

당신은 IE8, IE9, 안드로이드 브라우저를위한 polyfill이 필요합니다. 그리고 당신이 판단을해야 할 오래된 것들이 많이 필요합니다.

여기 caniuse.com에 미친 덕분에 대해 현재 지원 : 그것은 심의를 필요로하므로 모서리에 노란색 플래그

뭐든지 접두사를 사용합니다. 빨간색이면 setTimeout 대체가 필요합니다.

그러나 핵심 포인트 ... 곧, 예, 곧, polyfill은 훨씬 작아 질 것입니다. 그리고 지금부터는 너무 오래 있지 않아 rAF를 직접 사용할 수 있습니다.