From 65d5a89040f8a611b9c533b2b8d45cda17e56f8f Mon Sep 17 00:00:00 2001 From: Paul Armstrong Date: Wed, 14 Jun 2017 15:11:37 -0700 Subject: [PATCH] [fix] Remove requestAnimationFrame from StyleManager Using requestAnimationFrame while registering styles/classes slows down iOS/Mobile Webkit. By removing it, it's possible that we add a little bit of overhead, slowing down current cycles, but should be mostly unnoticed. Fix #517 --- src/apis/StyleSheet/StyleManager.js | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) diff --git a/src/apis/StyleSheet/StyleManager.js b/src/apis/StyleSheet/StyleManager.js index 50ffbca7..83afa15e 100644 --- a/src/apis/StyleSheet/StyleManager.js +++ b/src/apis/StyleSheet/StyleManager.js @@ -1,7 +1,6 @@ import { canUseDOM } from 'fbjs/lib/ExecutionEnvironment'; import generateCss from './generateCss'; import hash from './hash'; -import requestAnimationFrame from 'fbjs/lib/requestAnimationFrame'; import staticCss from './staticCss'; const emptyObject = {}; @@ -126,14 +125,12 @@ export default class StyleManager { className = createClassName(prop, value); this._addToCache(className, prop, value); if (canUseDOM) { - requestAnimationFrame(() => { - const sheet = this.mainSheet.sheet; - // avoid injecting if the rule already exists (e.g., server rendered, hot reload) - if (this.mainSheet.textContent.indexOf(className) === -1) { - const rule = createCssRule(className, prop, value); - sheet.insertRule(rule, sheet.cssRules.length); - } - }); + const sheet = this.mainSheet.sheet; + // avoid injecting if the rule already exists (e.g., server rendered, hot reload) + if (this.mainSheet.textContent.indexOf(className) === -1) { + const rule = createCssRule(className, prop, value); + sheet.insertRule(rule, sheet.cssRules.length); + } } } return className;