Improve tokenstream performance, implement prettier

Author: jacobp100

.eslintrc.js

@@ -1,3 +1,3 @@
 module.exports = {
-  extends: 'airbnb-base',
+  extends: ["airbnb-base", "prettier"]
 };

package.json

@@ -1,6 +1,6 @@
 {
   "name": "css-to-react-native",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "Convert CSS text to a React Native stylesheet object",
   "main": "dist/index.js",
   "scripts": {
@@ -35,8 +35,10 @@
     "babel-preset-es2015": "^6.18.0",
     "eslint": "^3.9.1",
     "eslint-config-airbnb-base": "^10.0.1",
+    "eslint-config-prettier": "^2.9.0",
     "eslint-plugin-import": "^2.2.0",
-    "jest": "^17.0.0"
+    "jest": "^17.0.0",
+    "prettier": "^1.10.2"
   },
   "dependencies": {
     "css-color-keywords": "^1.0.0",

src/TokenStream.js

@@ -1,84 +1,74 @@
-const SYMBOL_BASE_MATCH = 'SYMBOL_BASE_MATCH';
-const SYMBOL_MATCH = 'SYMBOL_MATCH';
+const SYMBOL_MATCH = "SYMBOL_MATCH";
 
 module.exports = class TokenStream {
   constructor(nodes, parent) {
+    this.index = 0;
     this.nodes = nodes;
-    this.parent = parent;
-    this.lastFunction = null;
+    this.functionName = parent != null ? parent.value : null;
     this.lastValue = null;
-  }
-
-  get node() {
-    return this.nodes[0];
+    this.rewindIndex = -1;
   }
 
   hasTokens() {
-    return this.nodes.length > 0;
-  }
-
-  lookAhead() {
-    return new TokenStream(this.nodes.slice(1), this.parent);
+    return this.index <= this.nodes.length - 1;
   }
 
-  [SYMBOL_BASE_MATCH](...tokenDescriptors) {
-    const node = this.node;
+  [SYMBOL_MATCH](...tokenDescriptors) {
+    if (!this.hasTokens()) return null;
 
-    if (!node) return null;
+    const node = this.nodes[this.index];
 
     for (let i = 0; i < tokenDescriptors.length; i += 1) {
       const tokenDescriptor = tokenDescriptors[i];
       const value = tokenDescriptor(node);
-      if (value !== null) return value;
+      if (value !== null) {
+        this.index += 1;
+        this.lastValue = value;
+        return value;
+      }
     }
 
     return null;
   }
 
-  [SYMBOL_MATCH](...tokenDescriptors) {
-    const value = this[SYMBOL_BASE_MATCH](...tokenDescriptors);
-    if (value === null) return null;
-    this.nodes = this.nodes.slice(1);
-    this.lastFunction = null;
-    this.lastValue = value;
-    return value;
-  }
-
-  test(...tokenDescriptors) {
-    return this[SYMBOL_BASE_MATCH](...tokenDescriptors) !== null;
-  }
-
   matches(...tokenDescriptors) {
     return this[SYMBOL_MATCH](...tokenDescriptors) !== null;
   }
 
   expect(...tokenDescriptors) {
     const value = this[SYMBOL_MATCH](...tokenDescriptors);
-    if (value !== null) return value;
-    return this.throw();
+    return value !== null ? value : this.throw();
   }
 
   matchesFunction() {
-    const node = this.node;
-    if (node.type !== 'function') return null;
+    const node = this.nodes[this.index];
+    if (node.type !== "function") return null;
     const value = new TokenStream(node.nodes, node);
-    this.nodes = this.nodes.slice(1);
-    this.lastFunction = value;
+    this.index += 1;
     this.lastValue = null;
     return value;
   }
 
   expectFunction() {
     const value = this.matchesFunction();
-    if (value !== null) return value;
-    return this.throw();
+    return value !== null ? value : this.throw();
   }
 
   expectEmpty() {
     if (this.hasTokens()) this.throw();
   }
 
   throw() {
-    throw new Error(`Unexpected token type: ${this.node.type}`);
+    throw new Error(`Unexpected token type: ${this.nodes[this.index].type}`);
+  }
+
+  saveRewindPoint() {
+    this.rewindIndex = this.index;
+  }
+
+  rewind() {
+    if (this.rewindIndex === -1) throw new Error("Internal error");
+    this.index = this.rewindIndex;
+    this.lastValue = null;
   }
 };

src/index.js

@@ -1,8 +1,8 @@
 /* eslint-disable no-param-reassign */
-const parse = require('postcss-value-parser');
-const camelizeStyleName = require('fbjs/lib/camelizeStyleName');
-const transforms = require('./transforms');
-const TokenStream = require('./TokenStream');
+const parse = require("postcss-value-parser");
+const camelizeStyleName = require("fbjs/lib/camelizeStyleName");
+const transforms = require("./transforms");
+const TokenStream = require("./TokenStream");
 
 // Note if this is wrong, you'll need to change tokenTypes.js too
 const numberOrLengthRe = /^([+-]?(?:\d*\.)?\d+(?:[Ee][+-]?\d+)?)(?:px)?$/i;
@@ -11,14 +11,14 @@ const nullRe = /^null$/i;
 const undefinedRe = /^undefined$/i;
 
 // Undocumented export
-export const transformRawValue = (input) => {
+export const transformRawValue = input => {
   const value = input.trim();
 
   const numberMatch = value.match(numberOrLengthRe);
   if (numberMatch !== null) return Number(numberMatch[1]);
 
   const boolMatch = input.match(boolRe);
-  if (boolMatch !== null) return boolMatch[0].toLowerCase() === 'true';
+  if (boolMatch !== null) return boolMatch[0].toLowerCase() === "true";
 
   const nullMatch = input.match(nullRe);
   if (nullMatch !== null) return null;
@@ -35,32 +35,39 @@ const baseTransformShorthandValue = (propName, inputValue) => {
   return transforms[propName](tokenStream);
 };
 
-const transformShorthandValue = (process.env.NODE_ENV === 'production')
-  ? baseTransformShorthandValue
-  : (propName, inputValue) => {
-    try {
-      return baseTransformShorthandValue(propName, inputValue);
-    } catch (e) {
-      throw new Error(`Failed to parse declaration "${propName}: ${inputValue}"`);
-    }
-  };
+const transformShorthandValue =
+  process.env.NODE_ENV === "production"
+    ? baseTransformShorthandValue
+    : (propName, inputValue) => {
+        try {
+          return baseTransformShorthandValue(propName, inputValue);
+        } catch (e) {
+          throw new Error(
+            `Failed to parse declaration "${propName}: ${inputValue}"`
+          );
+        }
+      };
 
 export const getStylesForProperty = (propName, inputValue, allowShorthand) => {
-  const isRawValue = (allowShorthand === false) || !(propName in transforms);
+  const isRawValue = allowShorthand === false || !(propName in transforms);
   const propValue = isRawValue
     ? transformRawValue(inputValue)
     : transformShorthandValue(propName, inputValue.trim());
 
-  return (propValue && propValue.$merge)
+  return propValue && propValue.$merge
     ? propValue.$merge
     : { [propName]: propValue };
 };
 
 export const getPropertyName = camelizeStyleName;
 
-export default (rules, shorthandBlacklist = []) => rules.reduce((accum, rule) => {
-  const propertyName = getPropertyName(rule[0]);
-  const value = rule[1];
-  const allowShorthand = shorthandBlacklist.indexOf(propertyName) === -1;
-  return Object.assign(accum, getStylesForProperty(propertyName, value, allowShorthand));
-}, {});
+export default (rules, shorthandBlacklist = []) =>
+  rules.reduce((accum, rule) => {
+    const propertyName = getPropertyName(rule[0]);
+    const value = rule[1];
+    const allowShorthand = shorthandBlacklist.indexOf(propertyName) === -1;
+    return Object.assign(
+      accum,
+      getStylesForProperty(propertyName, value, allowShorthand)
+    );
+  }, {});