Use hasOwnProperty to check for object properties

I've been doing some performance profiling of Aphrodite and noticed that even after updating to inline-style-prefixer 3.0.0, the prefixValue function was still more expensive than I expected. After looking at the CPU profile and the lines highlighted here, it seems that checking for the existence of these object properties using `foo[bar]` is much more expensive than checking using `foo.hasOwnProperty(bar)`.
robinweser · Mar 6, 2017 · c1cde7a · c1cde7a
1 parent 11ba89c
commit c1cde7a
Show file tree

Hide file tree

Showing 15 changed files with 20 additions and 21 deletions.
diff --git a/modules/dynamic/createPrefixer.js b/modules/dynamic/createPrefixer.js
@@ -111,7 +111,7 @@ export default function createPrefixer(
           }
 
           // add prefixes to properties
-          if (this._requiresPrefix[property]) {
+          if (this._requiresPrefix.hasOwnProperty(property)) {
             style[this._browserInfo.jsPrefix + capitalizeString(property)] = value
             if (!this._keepUnprefixed) {
               delete style[property]

diff --git a/modules/dynamic/plugins/flexboxIE.js b/modules/dynamic/plugins/flexboxIE.js
@@ -36,7 +36,7 @@ export default function flexboxIE(
 PluginMetaData
 ): ?Array<any> | ?any {
   if (
-    (alternativeProps[property] ||
+    (alternativeProps.hasOwnProperty(property) ||
       property === 'display' && typeof value === 'string' && value.indexOf('flex') > -1) &&
       ((browserName === 'ie_mob' || browserName === 'ie') && browserVersion === 10)
   ) {
@@ -45,10 +45,10 @@ PluginMetaData
     if (!keepUnprefixed && !Array.isArray(style[property])) {
       delete style[property]
     }
-    if (property === 'display' && alternativeValues[value]) {
+    if (property === 'display' && alternativeValues.hasOwnProperty(value)) {
       return getPrefixedValue(cssPrefix + alternativeValues[value], value, keepUnprefixed)
     }
-    if (alternativeProps[property]) {
+    if (alternativeProps.hasOwnProperty(property)) {
       style[alternativeProps[property]] = alternativeValues[value] || value
     }
   }

diff --git a/modules/dynamic/plugins/flexboxOld.js b/modules/dynamic/plugins/flexboxOld.js
@@ -70,10 +70,10 @@ PluginMetaData
         style.WebkitBoxDirection = 'normal'
       }
     }
-    if (property === 'display' && alternativeValues[value]) {
+    if (property === 'display' && alternativeValues.hasOwnProperty(value)) {
       return getPrefixedValue(cssPrefix + alternativeValues[value], value, keepUnprefixed)
     }
-    if (alternativeProps[property]) {
+    if (alternativeProps.hasOwnProperty(property)) {
       style[alternativeProps[property]] = alternativeValues[value] || value
     }
   }

diff --git a/modules/dynamic/plugins/sizing.js b/modules/dynamic/plugins/sizing.js
@@ -29,7 +29,7 @@ export default function sizing(
 ): ?Array<any> | ?any {
   // This might change in the future
   // Keep an eye on it
-  if (properties[property] && values[value]) {
+  if (properties.hasOwnProperty(property) && values.hasOwnProperty(value)) {
     return getPrefixedValue(cssPrefix + value, value, keepUnprefixed)
   }
 }
diff --git a/modules/dynamic/plugins/transition.js b/modules/dynamic/plugins/transition.js
@@ -19,7 +19,7 @@ export default function transition(
   style: Object,
   { cssPrefix, keepUnprefixed, requiresPrefix }: PluginMetaData
 ): ?Array<any> | ?any {
-  if (typeof value === 'string' && properties[property]) {
+  if (typeof value === 'string' && properties.hasOwnProperty(property)) {
     // memoize the prefix array for later use
     if (!requiresPrefixDashCased) {
       requiresPrefixDashCased = Object.keys(requiresPrefix).map(prop => hyphenateProperty(prop))

diff --git a/modules/generator/generateDynamicPrefixMap.js b/modules/generator/generateDynamicPrefixMap.js
@@ -37,7 +37,7 @@ export default function generateDynamicPrefixMap(browserList: Object): Object {
 
   for (let i = 0, len = browsers.length; i < len; ++i) {
     const browser = browsers[i]
-    if (!prefixMap[browser]) {
+    if (!prefixMap.hasOwnProperty(browser)) {
       prefixMap[browser] = {}
     }
 

diff --git a/modules/generator/generatePluginList.js b/modules/generator/generatePluginList.js
@@ -8,7 +8,7 @@ export default function getRecommendedPlugins(browserList: Object): Array<string
     const browserSupportByPlugin = pluginMap[plugin]
 
     for (const browser in browserSupportByPlugin) {
-      if (browserList[browser]) {
+      if (browserList.hasOwnProperty(browser)) {
         const browserVersion = browserSupportByPlugin[browser]
 
         if (browserList[browser] < browserVersion) {

diff --git a/modules/static/plugins/cursor.js b/modules/static/plugins/cursor.js
@@ -9,7 +9,7 @@ const values = {
 }
 
 export default function cursor(property: string, value: any): ?Array<string> {
-  if (property === 'cursor' && values[value]) {
+  if (property === 'cursor' && values.hasOwnProperty(value)) {
     return prefixes.map(prefix => prefix + value)
   }
 }
diff --git a/modules/static/plugins/flex.js b/modules/static/plugins/flex.js
@@ -5,7 +5,7 @@ const values = {
 }
 
 export default function flex(property: string, value: any): ?Array<string> {
-  if (property === 'display' && values[value]) {
+  if (property === 'display' && values.hasOwnProperty(value)) {
     return ['-webkit-box', '-moz-box', `-ms-${value}box`, `-webkit-${value}`, value]
   }
 }
diff --git a/modules/static/plugins/flexboxIE.js b/modules/static/plugins/flexboxIE.js
@@ -17,7 +17,7 @@ const alternativeProps = {
 }
 
 export default function flexboxIE(property: string, value: any, style: Object): void {
-  if (alternativeProps[property]) {
+  if (alternativeProps.hasOwnProperty(property)) {
     style[alternativeProps[property]] = alternativeValues[value] || value
   }
 }
diff --git a/modules/static/plugins/flexboxOld.js b/modules/static/plugins/flexboxOld.js
@@ -27,7 +27,7 @@ export default function flexboxOld(property: string, value: any, style: Object):
       style.WebkitBoxDirection = 'normal'
     }
   }
-  if (alternativeProps[property]) {
+  if (alternativeProps.hasOwnProperty(property)) {
     style[alternativeProps[property]] = alternativeValues[value] || value
   }
 }
diff --git a/modules/static/plugins/sizing.js b/modules/static/plugins/sizing.js
@@ -19,7 +19,7 @@ const values = {
 }
 
 export default function sizing(property: string, value: any): ?Array<any> {
-  if (properties[property] && values[value]) {
+  if (properties.hasOwnProperty(property) && values.hasOwnProperty(value)) {
     return prefixes.map(prefix => prefix + value)
   }
 }
diff --git a/modules/static/plugins/transition.js b/modules/static/plugins/transition.js
@@ -57,7 +57,7 @@ export default function transition(
   propertyPrefixMap: Object
 ): ?string {
   // also check for already prefixed transitions
-  if (typeof value === 'string' && properties[property]) {
+  if (typeof value === 'string' && properties.hasOwnProperty(property)) {
     const outputValue = prefixValue(value, propertyPrefixMap)
     // if the property is already prefixed
     const webkitOutput = outputValue

diff --git a/modules/utils/getBrowserInformation.js b/modules/utils/getBrowserInformation.js
@@ -48,7 +48,7 @@ function getBrowserName(browserInfo: Object): ?string {
   }
 
   for (const browser in browserByCanIuseAlias) {
-    if (browserInfo[browser]) {
+    if (browserInfo.hasOwnProperty(browser)) {
       return browserByCanIuseAlias[browser]
     }
   }
@@ -63,7 +63,7 @@ export default function getBrowserInformation(userAgent: string): Object | boole
   const browserInfo = bowser._detect(userAgent)
 
   for (const browser in prefixByBrowser) {
-    if (browserInfo[browser]) {
+    if (browserInfo.hasOwnProperty(browser)) {
       const prefix = prefixByBrowser[browser]
 
       browserInfo.jsPrefix = prefix

diff --git a/modules/utils/prefixProperty.js b/modules/utils/prefixProperty.js
@@ -6,9 +6,8 @@ export default function prefixProperty(
   property: string,
   style: Object
 ): void {
-  const requiredPrefixes = prefixProperties[property]
-
-  if (requiredPrefixes) {
+  if (prefixProperties.hasOwnProperty(property)) {
+    const requiredPrefixes = prefixProperties[property]
     for (let i = 0, len = requiredPrefixes.length; i < len; ++i) {
       style[requiredPrefixes[i] + capitalizeString(property)] = style[property]
     }