SORU
8 NİSAN 2013, PAZARTESİ


Nasıl tarayıcılar Duraklat/SEKME veya pencere etkin değil, Javascript değişir?

Arka plan: yaptığım bir kullanıcı arayüzü eğer insanlar dikkat olup olmadığını tespit etmek için gereken testleri. Ama, bu sorudeğilthe page visibility API hakkında.

Özellikle, eğer geçerli sekmeyi etkin değilse Javascript kodumu nasıl etkileneceğini bilmek istiyorum, ya da tarayıcı penceresini aktif, farklı tarayıcılarda değil. Aşağıdaki şimdiye kadar gerçekleri biliyorum:

Şu soru var:

  • Mobil tarayıcılar dışında, masaüstü tarayıcılar hiç bir sekme etkin olduğunda, JS yürütmeye Ara? Ne zaman ve hangi tarayıcıları?
  • Hangi tarayıcılar setInterval tekrar azaltın. Sadece yüzdelik bir sınırı ya da azalır? Örneğin, eğer 5000ms tekrar karşı 10ms bir tekrar etmem gerekirse, her ne kadar etkilenecek?
  • Bu değişiklikler olursapencerenet değil, sadece sekmesini karşı mı? (OS API gerektirir olarak tespit etmek zor olurdu herhalde.)
  • Aktif bir sekmede gözlenen olmaz başka bir etkisi var mı? Aksi takdirde doğru (söz konusu Yasemin testleri gibi) yürütülür her şeyi berbat edebilirler mi?

CEVAP
16 NİSAN 2013, Salı


Testi

Bu amaç için özel bir test yazdım:
Frame Rate Distribution: setInterval vs requestAnimationFrame

Not: Bu test, oldukça yoğun CPU. requestAnimationFrame IE tarafından desteklenen 9 - ve Opera 12-.

Test setInterval requestAnimationFrame farklı tarayıcılarda çalıştırmak için gereken gerçek zamanlı günlükleri, ve bir dağıtım şeklinde sonuç verir. *10 farklı Ayarları altında çalışır nasıl görmek için milisaniye sayısını değiştirebilirsiniz. setTimeout benzer gecikmeler açısından setInterval için çalışıyor. requestAnimationFrame genelde 60fps tarayıcıya bağlı olarak varsayılan. Farklı bir sekmeye geçtiğinizde olur ya da etkin olmayan bir pencerenin ne olduğunu görmek için, sadece sayfa açmak, farklı bir sekmeye geçin ve bir süre bekleyin. Etkin olmayan bir sekmede bu işlevler için gereken gerçek zaman oturum devam edecek.

Test İki

Bunu test etmek için başka bir yolu zaman damgası art arda setInterval requestAnimationFrame ile günlük ve bir müstakil konsolunda görüntülemek için. SEKME veya pencere devre dışı yaptığınız zaman güncelleme nasıl olduğunu görebilirsiniz (ya da eğer hiç güncelleme ise).

Sonuçları

Internet Explorer
IE sekme etkin olduğunda setInterval gecikme sınırı yok, ama etkin olmayan sekmeleri requestAnimationFrame duraklatır. Pencere odak dışı olup olmaması önemli değildir.

Krom
Chrome sekme etkin olduğunda etrafında 1000ms setInterval minimum aralığı sınırlar. Eğer aralığı belirtilen aralıkta çalışır 1000ms, daha yüksek ise. Eğer pencere odak dışında ise, aralığı sınırlıdır sadece farklı bir sekmeye geçtiğinizde fark etmez. requestAnimationFrame sekme etkin olduğunda duraklatıldı.

// Provides control over the minimum timer interval for background tabs.
const double kBackgroundTabTimerInterval = 1.0;

https://codereview.chromium.org/6546021/patch/1001/2001

Firefox
Chrome için benzer, Firefox sekme (pencere) etkin olmadığında setInterval etrafında 1000ms minimum aralığı sınırlar. Ancak, requestAnimationFrame sekme etkin olduğunda yavaş katlanarak, her Kare 1'ler, 2'ler, 4'ler, 8'ler ve alma ile çalışır.

// The default shortest interval/timeout we permit
#define DEFAULT_MIN_TIMEOUT_VALUE 4 // 4ms
#define DEFAULT_MIN_BACKGROUND_TIMEOUT_VALUE 1000 // 1000ms

https://hg.mozilla.org/releases/mozilla-release/file/0bf1cadfb004/dom/base/nsGlobalWindow.cpp#l296

Safari
Sadece Chrome, Safari caps 26* *sekmesini devre dışı olduğunda 1000ms. requestAnimationFrame sıra duraklatıldı.

Opera
Y motoru kabul edilmesinden bu yana, Opera, Chrome gibi aynı davranışı sergiler. setInterval 1000ms ile sınırlıdır ve requestAnimationFrame sekme etkin olduğunda duraklatıldı.

Özet

Etkin olmayan sekmeler için aralıklarla yinelenen:

           setInterval     requestAnimationFrame
IE
9-         not affected    not supported
10         not affected    paused

Chrome
9-         not affected    not supported
10         not affected    paused
11         >=1000ms        paused

Firefox
3-         not affected    not supported
4          not affected    1s
5          >=1000ms        2ns (n = number of frames since inactivity)

Safari
5-         not affected    not supported
6          not affected    paused
7          >=1000ms        paused

Opera
12-        not affected    not supported
15         >=1000ms        paused

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Android Police

    Android Poli

    21 NİSAN 2010
  • Dom Esposito

    Dom Esposito

    26 Mayıs 2011
  • jonathepianist

    jonathepiani

    31 Temmuz 2008