1

YouTube에서 (Chrome에서) 비디오를 재생하는 동안 CreateJS로 개발중인 HTML5 게임이 일반적으로하는 프레임 속도의 절반을 실행하고 있음을 발견했습니다.requestAnimationFrame() 호출은 브라우저 탭/창간에 공유됩니까?

자체적으로 데스크톱에서 실행 중 문제가 없습니다. 60fps.

YouTube 동영상을 실행 중이십니까? 30fps!

이상한 점은 다른 컴퓨터에서 문제를 재현 할 수없는 것입니다. 다른 그래픽 카드/드라이버가 requestAnimationFrame에 응답하는 방식과 관련이있을 수 있습니까?

+0

왜 당신은 이것에 놀랐습니까? 그것은 하나의 CPU를 가진 하나의 컴퓨터입니다. 한 번에 그렇게 많이 할 수 있습니다. –

+0

마치 "내 운영 체제가 프로그램 B를 동시에 실행하면 프로그램 A가 50 % 더 느리게 실행됩니다."라고 말하는 것과 같습니다. 우리는 멀티 스레딩 CPU주기, 멀티 코어 시대에 살고 있습니다. 그래서 아니오, RAF가 한 번에 너무 많이하도록 요구하고 있다고 생각하지 않습니다. P – bigp

+0

"멀티 스레딩 CPU주기"가 무엇을 의미하는지조차 알지 못합니다. 멀티 스레딩은 머신에 무한한 리소스가 있음을 의미합니까? 기계가 심하게로드되면 프로그램이 실제로 더 느리게 실행됩니다. –

답변

0

아니요. 다른 브라우저 탭은 RAF 호출을 공유하지 않습니다.

각각 RAF 루프가있는 브라우저 탭이 2 개있는 경우, 집중된 탭은 RAF 루프를 실행하고 초점이 맞지 않는 탭은 RAF가 중지됩니다.

그러나 단일 브라우저 탭에 여러 RAF 호출이있는 경우 모든 RAF 호출이 디스플레이 새로 고침과 동기화 된 단일 실행으로 병합됩니다.

+0

탭이 별도의 창에 있다면 (나란히)?둘 다 전체 프레임 속도로 실행됩니까? – bigp

+0

탭이 브라우저의 별도 인스턴스에 있으면 애니메이션이 계속됩니다. – markE

+0

괜찮습니다. RAF에 대한 통찰력을 가져 주셔서 감사합니다. 불행히도 나는 두 개의 탭을 내가 개별적으로 실행하여 HTML5 게임에서 프레임 속도가 떨어지는 것을 이해하지 못한다. 나는이 질문을 삭제하고 다른 질문에서이 문구를 바꿀 것이라고 생각한다. – bigp

0

RequestAnimationFrame은 그래픽 카드 또는 드라이버 수준에서 작동하지 않습니다. 브라우저 특정 소프트웨어 개념입니다. 브라우저가 처리 파이프 라인에있는 위치에 따라 최적화 된 시간에 일부 렌더링 작업을 수행하도록 요청할 수 있으며, 대체 방법 인 setTimeout보다 더 높은 정밀도로 호출 할 수 있습니다. .

@markE는 탭이 활성화되어 있지 않으면 일시 중지되므로 여러 탭에서 진행되는 RAF와 관련된 성능 문제는 없습니다. 사실, 비활성 탭에서 RAF 기반 애니메이션을 일시 중지하는 기능은이를 도입 한 동기 중 하나였습니다.

그러나 YouTube는 RAF를 사용하지 않습니다. 내가 아는 한 YouTube 동영상은 백그라운드 탭에서 계속 실행됩니다. 그래픽 하위 시스템은 많은 작업을 수행하지만 CPU도 관련되어 있습니다. 픽셀은 어딘가에서 가져와 그래픽 시스템에 공급해야합니다. 멀티 코어 CPU에서 새로운 프로세스는 이론적으로 충분히 활용되지 않은 코어를 사용할 수 있지만 결국 CPU 리소스는 유한합니다. 더 많은 작업을 수행하면할수록 모든 것이 느려지고 특히 브라우저 나 브라우저 탭을 실행하는 특정 스레드에 할애 할 수있는 리소스가 줄어 듭니다. 그래서 예, 당신이 그런 둔화를 보게 될지 전혀 놀라운 것이 아닙니다.

+0

좋은 답변입니다! 탭이 활성화되어 있지 않아도 RAF를 활성화 할 수 있습니까? –

+1

제 생각에는 브라우저 구현 문제입니다. –