perf: optimize handling of inherited styles

software-mansion · Jan 18, 2020 · 363c1b4 · 363c1b4
1 parent 279c3fc
commit 363c1b4
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 25 deletions.
diff --git a/__tests__/__snapshots__/css.test.tsx.snap b/__tests__/__snapshots__/css.test.tsx.snap
@@ -157,12 +157,10 @@ exports[`supports CSS in style element 1`] = `
 >
   <RNSVGGroup
     font={Object {}}
-    propList={Array []}
   >
     <RNSVGDefs />
     <RNSVGGroup
       font={Object {}}
-      propList={Array []}
     >
       <RNSVGRect
         fill={4294901760}
@@ -183,7 +181,6 @@ exports[`supports CSS in style element 1`] = `
     </RNSVGGroup>
     <RNSVGGroup
       font={Object {}}
-      propList={Array []}
     >
       <RNSVGRect
         fill={4294901760}

diff --git a/ios/RNSVGRenderable.m b/ios/RNSVGRenderable.m
@@ -572,7 +572,7 @@ - (void)mergeProperties:(__kindof RNSVGRenderable *)target
     }
     self.merging = true;
 
-    NSMutableArray* attributeList = [self.propList mutableCopy];
+    NSMutableArray* attributeList = self.propList ? [self.propList mutableCopy] : [[NSMutableArray alloc] init];
     _originProperties = [[NSMutableDictionary alloc] init];
 
     for (NSString *key in targetAttributeList) {

diff --git a/src/lib/extract/extractFill.ts b/src/lib/extract/extractFill.ts
@@ -13,20 +13,20 @@ const defaultFill = colorNames.black;
 export default function extractFill(
   o: extractedProps,
   props: FillProps,
-  styleProperties: string[],
+  inherited: string[],
 ) {
   const { fill, fillRule, fillOpacity } = props;
   if (fill != null) {
-    styleProperties.push('fill');
+    inherited.push('fill');
     o.fill =
       !fill && typeof fill !== 'number' ? defaultFill : extractBrush(fill);
   }
   if (fillOpacity != null) {
-    styleProperties.push('fillOpacity');
+    inherited.push('fillOpacity');
     o.fillOpacity = extractOpacity(fillOpacity);
   }
   if (fillRule != null) {
-    styleProperties.push('fillRule');
+    inherited.push('fillRule');
     o.fillRule = fillRule && fillRules[fillRule] === 0 ? 0 : 1;
   }
 }
diff --git a/src/lib/extract/extractProps.ts b/src/lib/extract/extractProps.ts
@@ -71,16 +71,19 @@ export default function extractProps(
     markerEnd = marker,
     transform,
   } = props;
-  const styleProperties: string[] = [];
-  const transformProps = props2transform(props);
-  const matrix = transformToMatrix(transformProps, transform);
-  const extracted: extractedProps = {
-    propList: styleProperties,
-  };
+  const extracted: extractedProps = {};
+
+  const inherited: string[] = [];
   extractResponder(extracted, props, ref);
-  extractFill(extracted, props, styleProperties);
-  extractStroke(extracted, props, styleProperties);
+  extractFill(extracted, props, inherited);
+  extractStroke(extracted, props, inherited);
 
+  if (inherited.length) {
+    extracted.propList = inherited;
+  }
+
+  const transformProps = props2transform(props);
+  const matrix = transformToMatrix(transformProps, transform);
   if (matrix !== null) {
     extracted.matrix = matrix;
   }

diff --git a/src/lib/extract/extractStroke.ts b/src/lib/extract/extractStroke.ts
@@ -27,7 +27,7 @@ const vectorEffects = {
 export default function extractStroke(
   o: extractedProps,
   props: StrokeProps,
-  styleProperties: string[],
+  inherited: string[],
 ) {
   const {
     stroke,
@@ -42,19 +42,19 @@ export default function extractStroke(
   } = props;
 
   if (stroke != null) {
-    styleProperties.push('stroke');
+    inherited.push('stroke');
     o.stroke = extractBrush(stroke);
   }
   if (strokeWidth != null) {
-    styleProperties.push('strokeWidth');
+    inherited.push('strokeWidth');
     o.strokeWidth = strokeWidth;
   }
   if (strokeOpacity != null) {
-    styleProperties.push('strokeOpacity');
+    inherited.push('strokeOpacity');
     o.strokeOpacity = extractOpacity(strokeOpacity);
   }
   if (strokeDasharray != null) {
-    styleProperties.push('strokeDasharray');
+    inherited.push('strokeDasharray');
     const strokeDash =
       !strokeDasharray || strokeDasharray === 'none'
         ? null
@@ -65,20 +65,20 @@ export default function extractStroke(
         : strokeDash;
   }
   if (strokeDashoffset != null) {
-    styleProperties.push('strokeDashoffset');
+    inherited.push('strokeDashoffset');
     o.strokeDashoffset =
       strokeDasharray && strokeDashoffset ? +strokeDashoffset || 0 : null;
   }
   if (strokeLinecap != null) {
-    styleProperties.push('strokeLinecap');
+    inherited.push('strokeLinecap');
     o.strokeLinecap = (strokeLinecap && caps[strokeLinecap]) || 0;
   }
   if (strokeLinejoin != null) {
-    styleProperties.push('strokeLinejoin');
+    inherited.push('strokeLinejoin');
     o.strokeLinejoin = (strokeLinejoin && joins[strokeLinejoin]) || 0;
   }
   if (strokeMiterlimit != null) {
-    styleProperties.push('strokeMiterlimit');
+    inherited.push('strokeMiterlimit');
     o.strokeMiterlimit =
       (strokeMiterlimit && typeof strokeMiterlimit !== 'number'
         ? parseFloat(strokeMiterlimit)