-
Notifications
You must be signed in to change notification settings - Fork 547
Strengthen requestAnimationFrame() spec for VSYNC / refresh rate matching in HTML 5.2 #785
Comments
@plehegar assigning you to take a first look as the person who might know best. Feel free to pass on, or others please fell free to take it if PLH is busy. |
Work in this area is needed. Please do address the issues raised.
As just as a very interesting FYI. On Windows, all rAF animations in all web browsers have a two frame input lag caused by how all browsers interact with the GPU. Apparently what is happening is that vsync triggers the rAF callback, but 'what was drawn' is not presented until the next vsync, but at that point, it is too late to make it to the screen (because the Windows OS composites). What was drawn in the rAF callback actually makes it to the screen one entire frame later. It sure would be nice if web browser vendors took notice, and (under Windows), presented what was drawn in a rAF callback immediately, instead of waiting for the next vsync (which then delays an entire frame). |
The two biggies are likely:
Currently, Microsoft's EDGE browser doesn't run at 100Hz nor 120Hz -- in fact, it supports fewer refresh rates than Microsoft's Internet Explorer. The developers at Microsoft should get a BENQ XL2720Z which can support custom refresh rates in 1Hz increments from 50Hz through 144Hz, to do validation testing. Chrome does it almost perfectly (even 240fps @ 240Hz! Video https://www.youtube.com/watch?v=oJakpZbvm3I#t=4m0s -- this is a YouTube video of www.testufo.com/frameskipping in Chrome browser on a 240Hz monitor! Opera / FireFox / Safari can do any refresh rate too (Albiet Chrome is the clear winner at the moment), as they ran successfully at 120fps@120Hz on a 120Hz monitor. Microsoft IE 10/11 goes up to 105fps (my tests apppear to show a hardlimit of 105, no matter how slow or fast CPU or GPU is, even on a GEFORCE GTX TITAN). Microsoft EDGE doesn't even do 100fps@100Hz nor 120fps@120Hz. |
FireFox Update: I am pleased that since the earlier 120Hz Browser Tests done -- FireFox has dramatically improved fluidity (elimination of jank/judder) and it now stays smooth even up to around ~70% of a refresh cycle spent inside requestAnimationFrame() at least on Windows systems. EDGE Update: Alas, Microsoft Edge 15 in the Windows Creator's Update, still does not work correctly. It does not remove its own internal artifical cap on the rate of requestAnimationFrame(), still running at 60fps at 120Hz -- and 72fps at 144Hz. There is a huge growth in gaming monitors, and there are now over 100 models of gaming monitors on the market (GSYNC and FreeSync). They are becoming more common, with several models now available at ordinary places like the Staples office-supplies store, Best Buy, etc. |
I see that W3C Editor's Draft (18 April 2017), section 7.1.4.2 Processing Model, uses this text:
There appears to be fluff words ("....would benefit from having its rendering updated depends on various factors...") that could easily be shortened with some good English rewriting. Implied assumptions Being Made We're running on battery power 120Hz mobile phones Wording doesn't mention matching framerate to refresh rate Wording is Problematic for Input Lag Reducing Edge Cases Wording should not dictate a preference of framerate-slowdown algorithm. This should be developer choice As a long-term future plan, consider the eSports use case for a future VSYNC OFF mode The mention of milliseconds (about 16.7ms) may be counterproductive Consider future variable refresh rate standards However, matching update frequency to refresh rate (Or vice versa, in the case of VRR displays), is definitely indeed the recommended method for the smoothest, jank-free judder-free operation. The existing W3C HTML 5.2 DRAFT 7 wording is very clearly written flawed with more than half-a-dozen ugly implied (accidental) assumptions (see below newer post for bullet list), so I propose a rewording of that particular paragraph. [EDIT: Proposed update text has been moved to new post below] |
CHANGE 1 of 2 Another consideration: The wording relating to timing requestAnimationFrame HTML 5.2 Draft 8 feels worse and less consistent/lower-quality (visual animation-wise recommendation of match-to-refreshrate) than current higher-quality browser practice (e.g. current versions of Chrome & FireFox). Even IE/Edge manages to surpass current HTML 5.2 Draft 8 wording, so let's not set the bar that low. Thus, since this is github, and I apparently am allowed to submit a pull request (that should compel discussion on this :) ...) I'm going to attempt to submit a pull request that changes: Proposal to CHANGE this (7.1.4.2):
Into this:
Improvements
While not perfect wording, and may not completely solve #785, I think this wording is a big improvement for many reasons. @chaals / @siusin -- Can you assign this github issue to me? |
CHANGE 2 of 2 Right now, Chrome/FireFox/Opera is compliant already with my proposed changes, with only a minor change needed by Microsoft IE/Edge needed (remove the arbitrary hard-coded internal cap). That said, browser vendors have frequently errored into this territory in the last five years (And Microsoft EDGE still does, as of Windows 10 Creator's Update), so I've made an additional wording update to make this more airtight, as there are some developers in this world surprised "There are displays above 60Hz?" -- so unfortunately it has to be mentioned. 2nd Change (in addition to earlier change) CHANGED:
INTO:
You'll also notice I changed "coalesce timer callbacks together" into "coalesce callbacks together". The requestAnimationFrame() is not a timer per se in the specific case of Chrome and FireFox, they synchronize to an external trigger -- the VSYNC signal has often multiple non-timer methods of detection on multiple different platforms -- and can be a different technique in different rendering pipelines in the same browser (e.g. hardware versus software)
While a monitor refresh rate is often sort of like a timer signal -- it's not always a program timer. So I removed the word "timer" (as that word only sometimes true, not always true) while also adding 1 sentence about arbitrary limits. |
I did talk to a few industry representatives (gaming industry, display related, display engineers). So far they've agreed the changes "keeps doors open" far better, as my previous long description states. Feel free to trial-balloon my suggestion around to other people who have an intimate understanding of this topic matter... My experience includes a peer reviewed paper on similar subject matter and also past experience writing industry standards documents, along with past experience submitting VSYNC-related and refresh-related bug reports in BugZilla-type systems to Chrome/FireFox (that got successfully fixed, e.g. this, this, this, and a few dozen others. I'm username "mdrejhon" and "blurbusters" on various bug tracking systems) As a result, I believe I'm a great candidate to participate in improving W3C standardization involving this sphere of update-frequencies including requestAnimationFrame() given my extensive knowledge of display technologies. I'd like to participate in future work, possibly #375. If not sure, please read my earlier (bigger) post from a few days ago -- to realize the complexity of the huge number of use cases that makes the orignal wording flawed. |
I have commited to my fork. EDIT: I've been contacted by @chaals -- now privately communicating to go through the proper channels & application process to be invited in this little corner of standardization expertise. That said, further discussion is welcome regarding my proposed patch EDIT2: I've successfully joined the W3C Web Platform Working Group (as an Invited Expert) and look forward to future collaboration in this specific sphere of expertise. The commit appears ready for official review |
For testing purposes, I purchased a new 240Hz gaming monitor (Acer Predator XB252Q) and did browser tests on it. Between late 2016 and April 2017 there are five new 240Hz gaming monitors on the market that are capable of a native 240Hz refresh rate (not "fake frames" / not interpolated). (Interesting video cable bandwidth note: The bandwidth of 4K 60Hz is the same as 1080p 240Hz) The current versions of Chrome and FireFox synchronized perfectly in TestUFO motion tests at 240fps (on a NVIDIA GPU accelerated desktop) without using much CPU or GPU at all. However, Microsoft Edge exhibited framerate-divisor results on requestAnimationFrame() callback rate.
In Microsoft Edge, scrolling runs at full frame rate, so the updaterate for scrolling is different from the artificially-capped callback rate for requestAnimationFrame(). The new commit discourages an arbitrary artificial cap in unconstrained situations (An example of an unconstrained situation would be a desktop computer on 120Hz-and-up monitors). (BTW, in an extreme test, I ran Chrome with the command line option "--disable-gpu-vsync" and Chrome managed to run requestAnimationFrame almost 2,000 frames per second on a five year old gaming computer with NVIDIA card -- for those readers doubting browsers are fast enough to keep up) Here is a zip file of all Microsoft Edge screenshots, for downloading. |
@duckware, following up: Propose for inclusion in #785:
I am also familiar with this. Prevailing practice clearly appears to be heading in the direction you're indicating. In theory, this warrants a separate github issue, but I could make a second pull request if there's industry agreement. We'll have to fish it out at least to a few outsiders as I'm not as dependant on this detail. I definitely know correct handling of this parameter is critical to much better stutter-detection heuristic algorithms in TestUFO too (in theory, it's also possible #375 someday makes that unnecessary, but regardless -- this matter is clearly a flaw/inconsistency that needs to be fixed). It's super easy to mathematically detect stutters in Chrome because the frame-drops and stutters clearly show up as aberrations in Performance.now() microsecond timer readings (a single stutter can interfere with scientific motion tests running in browsers) -- but it would be preferable to trust the parameter instead. To me, it is amazing that today, Chrome can support precision motion tests with enough Performance.now() accuracy that I feel confident which frames made it to which refresh cycle (even confirmed by co-relation to my high-speed camera tests) -- enough self-analysis accuracy to feel confident I'm getting an exact frame delivered to an exact chosen refresh cycle. This wasn't something JavaScript/ECMAScript was designed to be able to do but is already being done by both vsynctester (your creation) and testufo (my creation). This was formerly the exclusive domain of executable files such as "PixPerAn" or "DisplayMate Motion Bitmaps Edition" as well as other software that runs with $30K lab equipment (e.g. MotionMaster) where one single stutter invalidates a specific test run. Now already being done today in Chrome! I think THIS part belongs as a separate (second) commit under this #785. So your minor recommendation change will strengthen the standard further, IMHO. Now it's a wording matter, and I'd like your assistance on this, @duckware. (I've reached out to duckware by email too) Propose moving this to #375:
This probably could be addressed as part of #375 to make browsers accelerate compositing (reduced lag at more stutter risk) or delay compositing to minmize stutter. For a long time, compositing was a very slow operation, but right now, midrange Geforce cards can composite all windows and framebuffers in less than one millisecond. According to Microsoft Research, there's a very human-noticeable difference between 100Hz and 1000Hz when it comes to touchscreen, as seen in their YouTube video. A cursor lagging behind by 1/100sec versus a cursor lagging behind 1/1000sec can be quite noticeable during fast drawing operations. Especially when browser apps are used on touchscreens (e.g. pencil sketching app), there's much more lag on touchscreen Windows monitors than on Apple iPad touchscreens, due to the slower Windows 10 WDM compositing than Apple's low-latency iPad compositing. I believe the iPad probably composites in the same refresh cycle as app's creating of frame buffer (e.g. HTML5 canvas or WebGL canvas), since nowadays GPUs are fast enough to draw (3D graphics, even!) AND composite in the same refresh cycle. While Windows WDM has long been stuck with compositing in the next refresh cycle (adding another refresh cycle of lag) -- browser compositing, THEN windows compositing -- when ideally it could have all been done in the same refresh cycle even on a 5-year old Intel Integrated GPU. And consider, modern GPUs can now composite at up to half a terabyte per second on a GTX Titan (4K now composited in less than a millisecond on the fastest GPU on the market, and experimental 8K120Hz managed to run at full framerate in Google Chrome on TestUFO on an experimental display at CES 2017 in a clandestine "does it work?" test)... So the idea that compositing belongs in a separate subsequent refresh cycle is now an outdated idea... The advantage of the Windows 10 approach is requestAnimationFrame() can have nearly a full refresh cycle of drawing, without worrying about additional delays caused by compositing. This can make things smoother especially on slower GPUs, but as you already pointed out -- increases input latency. Ideally, browser apps should choose (as executable files are currently able to). Today, compositing is approaching near negligible overhead on modern GPUs, even mobile GPUs -- e.g. the current A7s and up manages to composite in less than a millisecond. Even browser capability (without Javascript access to it) is already emerging in a hidden way: Chrome seems to provide command-line options that affects this calculus partially, so making it a simpler matter (for some browser vendors) to consider letting JavaScript level be able to control this... That said, I think this part of the change belongs under #375 as a VSYNC API related topic. I think it's an excellent idea to touch upon Javascript ability to decide how much latency they want (stutter-versus-fluidity tradeoffs, etc) just as native applications currently are able to nowadays, and even useragents (Chrome) able to via command line options (such as --disable-gpu-vsync) that should eventually be able to (in some form) be exposed to the script level. Once we're satisfied with #785 (easy, no new API), as an Invited Expert with some pre-existing contacts at Blur Busters, I may be able to invite some industry representatives (e.g. Microsoft, Google, Valve Software, Epic Megagames, 2K, Oculus, etc) to comment on #375 (harder, new APIs) standardization matters. Please note, since it's new APIs added to HTML, I am not sure if we can get enough traction on #375 by HTML 5.2 but certainly by HTML 5.3. |
Thanks for merging the commit. So this is now part of HTML 5.2 DRAFT 8. Current status of browsers as of 5/1/2017: -- PASS: Blink/Gecko/Webkit aka Chrome/Opera/FireFox/Safari are the ones that are currently compliant. (Chrome/FireFox even work full framerate on 240Hz monitors.) -- FAIL: Trident/EdgeHTML aka IE/Edge has the arbitrary hardcoded cap (probably 1-line code) that becomes hit in unconstrained situations such as high-performance desktops. As soon as I exceed exactly 105Hz, the framerate suddenly halves (even at <1% CPU). EDIT -- An article on Blur Busters about a VSYNC API has been created to help generate further industry discussion on this topic matter. |
WebKit also has interest in extending requestAnimationFrame given that the newly announced iPads Pro have both variable refresh-rate displays, with up to 120Hz screen updates. However, we have to balance giving developers access to higher refresh rates with power and security considerations. First, we avoided simply allowing rAF to fire at 120Hz on the new iPads because it would have significant impacts on battery life for almost no visible benefit on most pages. I think anything > 60Hz needs to be opt-in. Second, I think it's almost more important to allow developers to opt in to lower-frequency rAF, by telling the browser that their animation only needs, say, 24fps, which would allow for significant power savings by reducing the number of process wake-ups to avoid rads which do nothing. Third, we have to avoid making it easier for content to do timing attacks (which usually measure how long some specific set of drawing commands take). Disabling VSYNC would make these kinds of attack much easier. |
Hello,
Note: For those unaware
I am the author of:
http://www.blurbusters.com/blur-busters-working-on-changes-to-html-5-2/
And I submitted a change to HTML 5.2 for the 120Hz era:
#785
I should note that on desktop computers, some WebKit based browsers already
support for 120Hz requestAnimationFrame, so it appears to be browser-vendor
specific.
When Chrome was using WebKit, it was working great with 120Hz. In fact, it
works great with 240Hz too (five new true 240Hz gaming monitors have hit
the market in the last few months, including the BenQ Zowie XL2546 and the
ASUS ROG PG258Q).
*>>"First, we avoided simply allowing rAF to fire at 120Hz on the new iPads
because it would have significant impacts on battery life for almost no
visible benefit on most pages. I think anything > 60Hz needs to be opt-in."*
Disabling VSYNC can be permission-based (for security reasons as well as battery-consumption reasons, as indicated). What you suggest is a very theoretical very rare kind of certain timing attacks are theoretically possible (e.g. timing the length of draw operations) but this is something already possible with shader benchmarking as well as forcing animation frames to take longer than 1/60sec (to time draw operations without needing VSYNC OFF). However, WebGL is far more insecure than supporting VSYNC OFF, but this is being mentioned anyway for completeness' sake -- alongside full screen mode security considerations -- and another rationale for permission-based operation for requesting VSYNC OFF.
Workarounds exist such as adding random jitter (random microseconds) to VSYNC OFF can also reduce security considerations too (*to becoming far safer than WebGL or alternate techniques, for example*). However, generally supporting fixed-rate 120fps/144fps/240fps should not be permission-based; the existence of a high-Hz monitor is defacto permission.
Personally, I disagree about end-user opt-in except when a "Power Saver"
mode is enabled. It can be configurable, and can be scaled back, e.g.
power management, but it should be 120Hz-permitted-by-default. rAF at a
higher rate should be made available unconditionally "IF AND ONLY IF"
(A) the screen is already 120Hz
(B) hardware acceleration is available
Today, GPUs can do 120Hz for almost no extra power consumption than 60Hz,
according to my power-consumption tests and Moore's Law still marches on.
Desktop Chrome browser can run at 2000 frames per second with the command
line "--disable-gpu-vsync", so rendering at 120 frames per second does not
use much more battery than 60 frames per second.
I feel that the plain fact is if the user has a 120Hz display, the user has
strongly and loudly declared a very strong opt-in for 120Hz, and therefore.
Metaphorically, we should not be the policeman to prevent 120 frames per
second on the end user's 120Hz display. I feel it is tantamount to
limiting framerate to 30fps on a 60Hz display.
Too often, standards designers design by committee, often never having seen
the use-case before (e.g. never having seen 120Hz). I'm very familiar with
this: People who have often never having seen 30fps-vs-60fps in 1990, and
now today, often never having seen 60fps-vs-120fps in year 2017. One
declares an assumed cap, and the user experience is affected. (Back in
year 1992, I programmed a 30fps-versus-60fps app to prove the human eye
could see the difference, and put it on a BBS)
Yes, "Power Saver Mode" could include framerate slowdowns (even all the way
down to 15 frames per second, where it actually makes a real difference
compared to 60fps-vs-120fps)
Yes, when pages become static (no scrolling, no animations), system can
lower refresh rate to save power regardless of 60Hz or 120Hz. The idle
moments between scrolls and between animations can be made quite
power miserly.
Moral of story: Gain everyday 120Hz experience first, and most will agree
asking user permission for it is silly.
*>>"*Second, I think it's almost more important to allow developers to opt
in to *lower*-frequency rAF, by telling the browser that their animation
only needs, say, 24fps, which would allow for significant power savings by
reducing the number of process wake-ups to avoid rads which do nothing."
Yes... I think this is important too.
However, I want to respond to the "almost more important" phrase, which
warrants a long reply due to the possible "red herring" factor.
For example -- have you seen 120fps before? Many people have not yet. But
as owner of Blur Busters, we are intimately familiar with it. It's
amazingly a huger difference than the current 3:2 pulldown we use to
display 24fps on a 60Hz display. There's half as much motion blur during
fast swipe-scrolling, making it much easier to read text while the browser
screen scrolling. With properly perfectly synchronized scrolling (stutter
free smooth scrolling -- e.g. up/down arrow key in desktop browsers, or
finger scrolling on newest phones/tablets) -- the move from 60fps to 120fps
makes a much more visible user experience improvement than removing 3:2
pulldown from 24fps videos. (BTW, I'm the developer of the world's first
open-sourced 3:2 pulldown detection algorithm -- back in 1999 for the
"dScaler" deinterlacing app). Yes, the "24p" playback fluidity is
wonderful, but "120Hz scrolling" is even more amazing-er. Personally, get
a few 120Hz devices, play with them, THEN make a decision by consensus. I
think you'll agree with me by then, that none of us should cap to 60fps and
none of us should ask the user for permission to do 120fps.
The user experience improvement of finding text faster during scrolling, is
tremendously huge, since the doubled refresh rate mathematically halves
eye-tracking-based motion blur (for a demonstration of this, see
www.testufo.com/eyetracking -- an optical illusion I invented). It's also
written in several scientific papers that the sample-and-hold effect
(eye-tracking across statically displayed frames, blurs the frame across
the retinas).
However, the power management aspects of slowing framerate from 60Hz to
24Hz, during movie playback, can actually add a few tens extra minutes to
the playback time (That said, in my experience, the H.264 / H.265 decoding
uses more power than the refresh rate difference between 24Hz and 60Hz),
But yes, what's important is Variable Refresh Rate support:
- Synchronize to the framerate of video (fixed custom refresh rate)
- Synchronize to the framerate of video games (dynamically varying
framerate).
.......This eliminates stutter; see software simulation of stutter-free
varying framerate at www.testufo.com/stutter&demo=gsync if you don't have
experience with FreeSync, GSYNC, VESA Adaptive-Sync, or HDMI 2.1 Variable
Refresh Rate. Now that Apple has VRR support, this will bring VRR into the
mainstream and we may need to support WebGL canvas /
requestAnimationFrame() at a variable refresh rate in the future.
Basically, refresh cycles are delivered immediately at the instant of the
exit of those respective canvas-refresh functions, keeping time
presentation of screen in sync with render time, reducing stutter in the
light of continuously variable refresh rate situations. The refresh rate
can change over 100 times a second in this situation.
It's possible that iPads will only support selectable variable refresh rate
(app-selectable, once per startup of video playback) but the LCD controller
also supports dynamic variable refresh rate (refresh rate changes every
single refresh cycle). I'm not sure of iOS 11 supports continuously
dynamic variable refresh rate for video games (much like NVIDIA GSYNC and
AMD FreeSync, HDMI 2.1 VRR, and VESA Adaptive-Sync standards) but knowing
Apple, they will eventually enable this support for iPad video games.
So one needs to support two things simultaneously and separately:
(1) Ability to sync to a specific refresh rate (request Hz synchronization
to a fixed-framerate source, like video)
(2) Ability to continually vary the refresh rate (refresh the display
exactly on completion on renders)
Most VRR displays will support both (1) and (2) but some may only support
(1) due to an artificial OS limitation (e.g. iOS11 supporting (1) then
iOS12 supporting both (1) and (2) ....).
*(Side Question: Does iOS11 supports both (1)+(2) or only (1) via API
support?*
Also responsibility may not even be in the browser at all except to select
the synchronization source. (e.g. two simultaneous videos). What browser
standards designers should probably do is:
- Enable variable refresh rate in full screen mode only (both fixed-Hz and
dynamic-Hz)
- Full screen mode should sync to the framerate of the first <video> tag or
<canvas> tag.
Basically, design this into the HTML standard, and force browser vendors to
follow it.
Tricky situations:
- Multiple videos and multiple canvas
- Multiple windows side by side
Potential Simplifications:
- Enable VRR support only in full screen mode
Possible rules:
- Browser vendor can choose to sync the Hz to the dominant viewport (first
<video> or first <canvas>) to sync to the update rate of those
automatically.
- Things like requestAnimationFrame() is a trickier case that needs a
specific sets of rules. By default, it should run at a fixed Hz (highest
Hz possible of display, 120Hz, when not in a power saver mode). But should
be able (at browser vendor's choosing) to dynamically sync Hz whenever
framerate slows down. The browser programmer should also be able to
decide to specify a fixed frequency (e.g. 24fps, 30fps, 60fps, etc) and the
Hz will sync exactly to framerate. (Just as it does today on GSYNC and
FreeSync).
Current prevailing practice on PC:
In videogames, many videogames aren't even aware they're running at a
variable refresh rate. Because there's no difference between framerate and
refreshrate, they are the same thing when it comes to a
dynamically-changing VRR display. At least when running in VRR range (e.g.
30fps-144fps on a 144Hz GSYNC display -- and 30fps-240fps on a 240Hz GSYNC
display). If the game runs at 43.7 frames per second, the display is
43.7Hz, there's no difference between frame rate and refresh rate in that
situation, and the refresh rate can change every single refresh cycle /
every single frame.
Cheers,
Mark Rejhon
|
Current prevailing practice on PC:
In videogames, many videogames aren't even aware they're running at a
variable refresh rate. Because there's no difference between framerate and
refreshrate, they are the same thing when it comes to a
dynamically-changing VRR display. At least when running in VRR range (e.g.
30fps-144fps on a 144Hz GSYNC display -- and 30fps-240fps on a 240Hz GSYNC
display). If the game runs at 43.7 frames per second, the display is
43.7Hz, there's no difference between frame rate and refresh rate in that
situation, and the refresh rate can change every single refresh cycle /
every single frame.
In other words, on a variable refresh display, *individual refresh cycles
are triggered by software* (e.g. graphics driver) -- like the completion of
a draw cycle, or an OpenGL glFlush() -- or theoretically the return from
requestAnimationFrame() -- or the completion of a video frame from the
video decoder.
*Important Questions about iOS 11 ProMotion refresh workflow*
So on this note, before we decide on standardization, I have some important
questions about how iOS 11 handles ProMotion:
(A) Does ProMotion sync rendering to display?
*aka iPad tells display "I want to run at 24Hz, and I'll deliver video
frames synchronously"*
(B) Does ProMotion sync display to rendering?
(like GSYNC, FreeSync, HDMI 2.1 VRR, VESA Adaptive-Sync)
*aka iPad tells display "Please refresh immediately every time I deliver
this frame buffer"*
(C) Does ProMotion support continuously dynamic variable frame rate?
(like GSYNC, FreeSync, HDMI 2.1 VRR, VESA Adaptive-Sync)
*aka iPad can change refresh rate every frame render.*
We probably need to answer all the above questions before we decide exactly
how to standardize this in HTML 5.2. Ideally, I think we should
standardize for all possible eventualities.
Also it's theoretically possible both (A) and (B) could be a yes -- my
experience is GSYNC and FreeSync displays are capable of any random fixed
refresh rate too, in addition to letting software trigger individual
refresh cycles.
Thanks,
Mark Rejhon
…On Tue, Jun 6, 2017 at 10:46 AM, Mark Rejhon ***@***.***> wrote:
Hello,
Note: For those unaware
I am the author of: http://www.blurbusters.com/blur-busters-working-on-
changes-to-html-5-2/
And I submitted a change to HTML 5.2 for the 120Hz era:
#785
I should note that on desktop computers, some WebKit based browsers
already support for 120Hz requestAnimationFrame, so it appears to be
browser-vendor specific.
When Chrome was using WebKit, it was working great with 120Hz. In fact,
it works great with 240Hz too (five new true 240Hz gaming monitors have hit
the market in the last few months, including the BenQ Zowie XL2546 and the
ASUS ROG PG258Q).
*>>"First, we avoided simply allowing rAF to fire at 120Hz on the new
iPads because it would have significant impacts on battery life for almost
no visible benefit on most pages. I think anything > 60Hz needs to be
opt-in."*
Personally, I disagree about end-user opt-in except when a "Power Saver"
mode is enabled. It can be configurable, and can be scaled back, e.g.
power management, but it should be 120Hz-permitted-by-default. rAF at a
higher rate should be made available unconditionally "IF AND ONLY IF"
(A) the screen is already 120Hz
(B) hardware acceleration is available
Today, GPUs can do 120Hz for almost no extra power consumption than 60Hz,
according to my power-consumption tests and Moore's Law still marches on.
Desktop Chrome browser can run at 2000 frames per second with the command
line "--disable-gpu-vsync", so rendering at 120 frames per second does not
use much more battery than 60 frames per second.
I feel that the plain fact is if the user has a 120Hz display, the user
has strongly and loudly declared a very strong opt-in for 120Hz, and
therefore. Metaphorically, we should not be the policeman to prevent 120
frames per second on the end user's 120Hz display. I feel it is tantamount
to limiting framerate to 30fps on a 60Hz display.
Too often, standards designers design by committee, often never having
seen the use-case before (e.g. never having seen 120Hz). I'm very familiar
with this: People who have often never having seen 30fps-vs-60fps in 1990,
and now today, often never having seen 60fps-vs-120fps in year 2017. One
declares an assumed cap, and the user experience is affected. (Back in
year 1992, I programmed a 30fps-versus-60fps app to prove the human eye
could see the difference, and put it on a BBS)
Yes, "Power Saver Mode" could include framerate slowdowns (even all the
way down to 15 frames per second, where it actually makes a real difference
compared to 60fps-vs-120fps)
Moral of story: Gain everyday 120Hz experience first, and most will agree
asking user permission for it is silly.
*>>"*Second, I think it's almost more important to allow developers to
opt in to *lower*-frequency rAF, by telling the browser that their
animation only needs, say, 24fps, which would allow for significant power
savings by reducing the number of process wake-ups to avoid rads which do
nothing."
Yes... I think this is important too.
However, I want to respond to the "almost more important" phrase, which
warrants a long reply due to the possible "red herring" factor.
For example -- have you seen 120fps before? Many people have not yet.
But as owner of Blur Busters, we are intimately familiar with it. It's
amazingly a huger difference than the current 3:2 pulldown we use to
display 24fps on a 60Hz display. There's half as much motion blur during
fast swipe-scrolling, making it much easier to read text while the browser
screen scrolling. With properly perfectly synchronized scrolling (stutter
free smooth scrolling -- e.g. up/down arrow key in desktop browsers, or
finger scrolling on newest phones/tablets) -- the move from 60fps to 120fps
makes a much more visible user experience improvement than removing 3:2
pulldown from 24fps videos. (BTW, I'm the developer of the world's first
open-sourced 3:2 pulldown detection algorithm -- back in 1999 for the
"dScaler" deinterlacing app). Yes, the "24p" playback fluidity is
wonderful, but "120Hz scrolling" is even more amazing-er. Personally, get
a few 120Hz devices, play with them, THEN make a decision by consensus. I
think you'll agree with me by then, that none of us should cap to 60fps and
none of us should ask the user for permission to do 120fps.
The user experience improvement of finding text faster during scrolling,
is tremendously huge, since the doubled refresh rate mathematically halves
eye-tracking-based motion blur (for a demonstration of this, see
www.testufo.com/eyetracking -- an optical illusion I invented). It's
also written in several scientific papers that the sample-and-hold effect
(eye-tracking across statically displayed frames, blurs the frame across
the retinas).
However, the power management aspects of slowing framerate from 60Hz to
24Hz, during movie playback, can actually add a few tens extra minutes to
the playback time (That said, in my experience, the H.264 / H.265 decoding
uses more power than the refresh rate difference between 24Hz and 60Hz),
But yes, what's important is Variable Refresh Rate support:
- Synchronize to the framerate of video (fixed custom refresh rate)
- Synchronize to the framerate of video games (dynamically varying
framerate).
.......This eliminates stutter; see software simulation of stutter-free
varying framerate at www.testufo.com/stutter&demo=gsync if you don't have
experience with FreeSync, GSYNC, VESA Adaptive-Sync, or HDMI 2.1 Variable
Refresh Rate. Now that Apple has VRR support, this will bring VRR into the
mainstream and we may need to support WebGL canvas /
requestAnimationFrame() at a variable refresh rate in the future.
Basically, refresh cycles are delivered immediately at the instant of the
exit of those respective canvas-refresh functions, keeping time
presentation of screen in sync with render time, reducing stutter in the
light of continuously variable refresh rate situations. The refresh rate
can change over 100 times a second in this situation.
It's possible that iPads will only support selectable variable refresh
rate (app-selectable, once per startup of video playback) but the LCD
controller also supports dynamic variable refresh rate (refresh rate
changes every single refresh cycle). I'm not sure of iOS 11 supports
continuously dynamic variable refresh rate for video games (much like
NVIDIA GSYNC and AMD FreeSync, HDMI 2.1 VRR, and VESA Adaptive-Sync
standards) but knowing Apple, they will eventually enable this support for
iPad video games.
So one needs to support two things simultaneously and separately:
(1) Ability to sync to a specific refresh rate (request Hz synchronization
to a fixed-framerate source, like video)
(2) Ability to continually vary the refresh rate (refresh the display
exactly on completion on renders)
Most VRR displays will support both (1) and (2) but some may only support
(1) due to an artificial OS limitation (e.g. iOS11 supporting (1) then
iOS12 supporting both (1) and (2) ....).
*(Side Question: Does iOS11 supports both (1)+(2) or only (1) via API
support?*
Also responsibility may not even be in the browser at all except to select
the synchronization source. (e.g. two simultaneous videos). What browser
standards designers should probably do is:
- Enable variable refresh rate in full screen mode only (both fixed-Hz and
dynamic-Hz)
- Full screen mode should sync to the framerate of the first <video> tag
or <canvas> tag.
Basically, design this into the HTML standard, and force browser vendors
to follow it.
Tricky situations:
- Multiple videos and multiple canvas
- Multiple windows side by side
Potential Simplifications:
- Enable VRR support only in full screen mode
Possible rules:
- Browser vendor can choose to sync the Hz to the dominant viewport (first
<video> or first <canvas>) to sync to the update rate of those
automatically.
- Things like requestAnimationFrame() is a trickier case that needs a
specific sets of rules. By default, it should run at a fixed Hz (highest
Hz possible of display, 120Hz, when not in a power saver mode). But should
be able (at browser vendor's choosing) to dynamically sync Hz whenever
framerate slows down. The browser programmer should also be able to
decide to specify a fixed frequency (e.g. 24fps, 30fps, 60fps, etc) and the
Hz will sync exactly to framerate. (Just as it does today on GSYNC and
FreeSync).
Current prevailing practice on PC:
In videogames, many videogames aren't even aware they're running at a
variable refresh rate. Because there's no difference between framerate and
refreshrate, they are the same thing when it comes to a
dynamically-changing VRR display. At least when running in VRR range (e.g.
30fps-144fps on a 144Hz GSYNC display -- and 30fps-240fps on a 240Hz GSYNC
display). If the game runs at 43.7 frames per second, the display is
43.7Hz, there's no difference between frame rate and refresh rate in that
situation, and the refresh rate can change every single refresh cycle /
every single frame.
Cheers,
Mark Rejhon
|
Moved discussion to #375 Please note #375 description was completely rewritten (after this 785), so #375 is much more recent than 785. Here are some important comments to catch up on: Proposed new API is written here: PHASE 1 and PHASE 2. Comments are encouraged in those new w3c github threads over there. June 6th, 2017:
Important: Further replies should go to #375.(The HTML5.2 modification commit was successfully accepted -- see original post at the very top of #785 -- so further VSYNC related changes are under scope of #375) |
Hello all,
If there is anything I can do for W3C to create new motion-fluidity or
jank-verification tests, that are also suitable for high refresh rates -- I
am ready to help.
I also did a successful 480 Hz test in FireFox:
http://www.blurbusters.com/4k-120hz-with-bonus-240hz-and-480hz-modes/
It is time for a new rAF() compliance benchmark web browsers within 6
months for their high-refresh-rate supports. Browsers that follow the
HTML 5.2 standard running full-refresh-rate requestAnimationFrame() when on
an A/C powered computer running in high priority mode. This is when power
constraints do not matter and frame rate caps [e.g. like those found in IE,
Edge] should not apply. This is important for scientific & educational
testing, and for writing peer reviewed papers (I already have one. Also,
Viewpixx now has a 1440Hz DLP research projector, but that is currently out
of my price budget at the moment.
Regarding requestAnimationFrame support for high-refresh rates for
scientific motion testing: I'm pleased to mention that FireFox apparently
succeeded a 480 Hz test once I forced FireFox to disable it automatic CPU
power management (via Minimum CPU = 100% via OS). Using the peer reviewed
test technique, improvements are still indeed human-eye visible -- but
that's offtopic.
I am going to re-benchmark all web browsers before the end of the years
with brand new tests for 120Hz, 240Hz -- and now our new 480Hz capability.
This will be the new HTML 5.2 rAF() compliance test.
Thanks,
Mark Rejhon
…On Tue, Jun 6, 2017 at 10:46 AM, Mark Rejhon ***@***.***> wrote:
Hello,
Note: For those unaware
I am the author of: http://www.blurbusters.com/blur-busters-working-on-
changes-to-html-5-2/
And I submitted a change to HTML 5.2 for the 120Hz era:
#785
I should note that on desktop computers, some WebKit based browsers
already support for 120Hz requestAnimationFrame, so it appears to be
browser-vendor specific.
When Chrome was using WebKit, it was working great with 120Hz. In fact,
it works great with 240Hz too (five new true 240Hz gaming monitors have hit
the market in the last few months, including the BenQ Zowie XL2546 and the
ASUS ROG PG258Q).
*>>"First, we avoided simply allowing rAF to fire at 120Hz on the new
iPads because it would have significant impacts on battery life for almost
no visible benefit on most pages. I think anything > 60Hz needs to be
opt-in."*
Personally, I disagree about end-user opt-in except when a "Power Saver"
mode is enabled. It can be configurable, and can be scaled back, e.g.
power management, but it should be 120Hz-permitted-by-default. rAF at a
higher rate should be made available unconditionally "IF AND ONLY IF"
(A) the screen is already 120Hz
(B) hardware acceleration is available
Today, GPUs can do 120Hz for almost no extra power consumption than 60Hz,
according to my power-consumption tests and Moore's Law still marches on.
Desktop Chrome browser can run at 2000 frames per second with the command
line "--disable-gpu-vsync", so rendering at 120 frames per second does not
use much more battery than 60 frames per second.
I feel that the plain fact is if the user has a 120Hz display, the user
has strongly and loudly declared a very strong opt-in for 120Hz, and
therefore. Metaphorically, we should not be the policeman to prevent 120
frames per second on the end user's 120Hz display. I feel it is tantamount
to limiting framerate to 30fps on a 60Hz display.
Too often, standards designers design by committee, often never having
seen the use-case before (e.g. never having seen 120Hz). I'm very familiar
with this: People who have often never having seen 30fps-vs-60fps in 1990,
and now today, often never having seen 60fps-vs-120fps in year 2017. One
declares an assumed cap, and the user experience is affected. (Back in
year 1992, I programmed a 30fps-versus-60fps app to prove the human eye
could see the difference, and put it on a BBS)
Yes, "Power Saver Mode" could include framerate slowdowns (even all the
way down to 15 frames per second, where it actually makes a real difference
compared to 60fps-vs-120fps)
Moral of story: Gain everyday 120Hz experience first, and most will agree
asking user permission for it is silly.
*>>"*Second, I think it's almost more important to allow developers to
opt in to *lower*-frequency rAF, by telling the browser that their
animation only needs, say, 24fps, which would allow for significant power
savings by reducing the number of process wake-ups to avoid rads which do
nothing."
Yes... I think this is important too.
However, I want to respond to the "almost more important" phrase, which
warrants a long reply due to the possible "red herring" factor.
For example -- have you seen 120fps before? Many people have not yet.
But as owner of Blur Busters, we are intimately familiar with it. It's
amazingly a huger difference than the current 3:2 pulldown we use to
display 24fps on a 60Hz display. There's half as much motion blur during
fast swipe-scrolling, making it much easier to read text while the browser
screen scrolling. With properly perfectly synchronized scrolling (stutter
free smooth scrolling -- e.g. up/down arrow key in desktop browsers, or
finger scrolling on newest phones/tablets) -- the move from 60fps to 120fps
makes a much more visible user experience improvement than removing 3:2
pulldown from 24fps videos. (BTW, I'm the developer of the world's first
open-sourced 3:2 pulldown detection algorithm -- back in 1999 for the
"dScaler" deinterlacing app). Yes, the "24p" playback fluidity is
wonderful, but "120Hz scrolling" is even more amazing-er. Personally, get
a few 120Hz devices, play with them, THEN make a decision by consensus. I
think you'll agree with me by then, that none of us should cap to 60fps and
none of us should ask the user for permission to do 120fps.
The user experience improvement of finding text faster during scrolling,
is tremendously huge, since the doubled refresh rate mathematically halves
eye-tracking-based motion blur (for a demonstration of this, see
www.testufo.com/eyetracking -- an optical illusion I invented). It's
also written in several scientific papers that the sample-and-hold effect
(eye-tracking across statically displayed frames, blurs the frame across
the retinas).
However, the power management aspects of slowing framerate from 60Hz to
24Hz, during movie playback, can actually add a few tens extra minutes to
the playback time (That said, in my experience, the H.264 / H.265 decoding
uses more power than the refresh rate difference between 24Hz and 60Hz),
But yes, what's important is Variable Refresh Rate support:
- Synchronize to the framerate of video (fixed custom refresh rate)
- Synchronize to the framerate of video games (dynamically varying
framerate).
.......This eliminates stutter; see software simulation of stutter-free
varying framerate at www.testufo.com/stutter&demo=gsync if you don't have
experience with FreeSync, GSYNC, VESA Adaptive-Sync, or HDMI 2.1 Variable
Refresh Rate. Now that Apple has VRR support, this will bring VRR into the
mainstream and we may need to support WebGL canvas /
requestAnimationFrame() at a variable refresh rate in the future.
Basically, refresh cycles are delivered immediately at the instant of the
exit of those respective canvas-refresh functions, keeping time
presentation of screen in sync with render time, reducing stutter in the
light of continuously variable refresh rate situations. The refresh rate
can change over 100 times a second in this situation.
It's possible that iPads will only support selectable variable refresh
rate (app-selectable, once per startup of video playback) but the LCD
controller also supports dynamic variable refresh rate (refresh rate
changes every single refresh cycle). I'm not sure of iOS 11 supports
continuously dynamic variable refresh rate for video games (much like
NVIDIA GSYNC and AMD FreeSync, HDMI 2.1 VRR, and VESA Adaptive-Sync
standards) but knowing Apple, they will eventually enable this support for
iPad video games.
So one needs to support two things simultaneously and separately:
(1) Ability to sync to a specific refresh rate (request Hz synchronization
to a fixed-framerate source, like video)
(2) Ability to continually vary the refresh rate (refresh the display
exactly on completion on renders)
Most VRR displays will support both (1) and (2) but some may only support
(1) due to an artificial OS limitation (e.g. iOS11 supporting (1) then
iOS12 supporting both (1) and (2) ....).
*(Side Question: Does iOS11 supports both (1)+(2) or only (1) via API
support?*
Also responsibility may not even be in the browser at all except to select
the synchronization source. (e.g. two simultaneous videos). What browser
standards designers should probably do is:
- Enable variable refresh rate in full screen mode only (both fixed-Hz and
dynamic-Hz)
- Full screen mode should sync to the framerate of the first <video> tag
or <canvas> tag.
Basically, design this into the HTML standard, and force browser vendors
to follow it.
Tricky situations:
- Multiple videos and multiple canvas
- Multiple windows side by side
Potential Simplifications:
- Enable VRR support only in full screen mode
Possible rules:
- Browser vendor can choose to sync the Hz to the dominant viewport (first
<video> or first <canvas>) to sync to the update rate of those
automatically.
- Things like requestAnimationFrame() is a trickier case that needs a
specific sets of rules. By default, it should run at a fixed Hz (highest
Hz possible of display, 120Hz, when not in a power saver mode). But should
be able (at browser vendor's choosing) to dynamically sync Hz whenever
framerate slows down. The browser programmer should also be able to
decide to specify a fixed frequency (e.g. 24fps, 30fps, 60fps, etc) and the
Hz will sync exactly to framerate. (Just as it does today on GSYNC and
FreeSync).
Current prevailing practice on PC:
In videogames, many videogames aren't even aware they're running at a
variable refresh rate. Because there's no difference between framerate and
refreshrate, they are the same thing when it comes to a
dynamically-changing VRR display. At least when running in VRR range (e.g.
30fps-144fps on a 144Hz GSYNC display -- and 30fps-240fps on a 240Hz GSYNC
display). If the game runs at 43.7 frames per second, the display is
43.7Hz, there's no difference between frame rate and refresh rate in that
situation, and the refresh rate can change every single refresh cycle /
every single frame.
Cheers,
Mark Rejhon
|
UPDATE: Change committed on #785. Please see #375 instead (rewritten/newer) for further standardization efforts on this.
PROBLEM
The older W3C "Animation Timing" spec had a better definition (https://www.w3.org/TR/animation-timing/) Section 5 says "The expectation is that the user agent will run tasks from the animation task source at at a regular interval matching the display's refresh rate. Running tasks at a lower rate can result in animations not appearing smooth. Running tasks at a higher rate can cause extra computation to occur without a user-visible benefit."
-- However the newer W3C HTML 5.1 no longer correctly describes the desire to match requestAnimationFrame() exactly to the refresh rate.
DETAIL
http://www.testufo.com/browser.html
https://connect.microsoft.com/IE/feedback/details/794072/internet-explorer-animations-fails-on-120hz-computer-monitors-works-at-60hz-75hz-100hz?siteID=rGMTN56tf_w-1PqoBW8wrx7DKpzuXQ.Wbg
http://www.vsynctester.com/howtocomputevsync.html and at http://www.testufo.com/browser.html
http://www.vsynctester.com/firefoxisbroken.html
http://www.blurbusters.com/blur-busters-120hz-web-browser-tests/
Stutter began to occur in some browsers even at 10% CPU, while Chrome remained stutter-resistant all the way to 75% CPU used up (e.g. 12ms inside requestAnimationFrame() during a 1/60sec period). This disparity is unreasonable.
WHY IT IS IMPORTANT
EASY SOLUTIONS
COMPLIANCE TESTING WEBSITES FOR requestAnimationFrame()
SUPERSEDES (IN PART): #422, #375, #159
The text was updated successfully, but these errors were encountered: