mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-11-15 19:59:35 +00:00
vector.js: Use idle callback (not rAF) for computed style read
requestAnimationFrame (rAF) is called before styles are computed. Performing a style read there can require a forced style recalcution which interrupts the browser's natural rendering life cycle. To gracefully observe layout of the page without inducing the cost to render it, it should be accessed after rendering. A suitable API to schedule time there is requestIdleCallback. In any event, if the code that needs this measurement executes very early for some reason, it is still computed on-demand which means it can't cause any functional regression. Change-Id: I0d8d3a0b158fa3d9e0895760d0691757f918d91d
This commit is contained in:
parent
42f1a3d605
commit
9b2bcbbcae
|
@ -9,7 +9,6 @@ $( function () {
|
|||
*/
|
||||
var $cactions = $( '#p-cactions' ),
|
||||
$tabContainer = $( '#p-views ul' ),
|
||||
rAF = window.requestAnimationFrame || setTimeout,
|
||||
// Avoid forced style calculation during page load
|
||||
initialCactionsWidth = function () {
|
||||
var width = $cactions.width();
|
||||
|
@ -19,7 +18,7 @@ $( function () {
|
|||
return width;
|
||||
};
|
||||
|
||||
rAF( initialCactionsWidth );
|
||||
mw.requestIdleCallback( initialCactionsWidth );
|
||||
|
||||
/**
|
||||
* Focus search input at the very end
|
||||
|
|
Loading…
Reference in a new issue