efficient template compiler

kbrsh · Apr 2, 2017 · 9d577b8 · 9d577b8
1 parent 159eee8
commit 9d577b8
Show file tree

Hide file tree

Showing 5 changed files with 147 additions and 45 deletions.
diff --git a/dist/moon.js b/dist/moon.js
@@ -187,28 +187,6 @@
       return path[0];
     };
 
-    /**
-     * Compiles a Template
-     * @param {String} template
-     * @param {Boolean} isString
-     * @return {String} compiled template
-     */
-    var compileTemplate = function (template, isString) {
-      var TEMPLATE_RE = /{{([A-Za-z0-9_$@]+)([A-Za-z0-9_.()'"+\-*/\s\[\]]+)?}}/gi;
-      var compiled = template;
-      template.replace(TEMPLATE_RE, function (match, key, modifiers) {
-        if (!modifiers) {
-          modifiers = '';
-        }
-        if (isString) {
-          compiled = compiled.replace(match, '" + instance.get("' + key + '")' + modifiers + ' + "');
-        } else {
-          compiled = compiled.replace(match, 'instance.get("' + key + '")' + modifiers);
-        }
-      });
-      return compiled;
-    };
-
     /**
      * Extracts the Slots From Component Children
      * @param {Array} children
@@ -819,6 +797,79 @@
     };
 
     /* ======= Compiler ======= */
+    var openRE = /\{\{/;
+    var closeRE = /\}\}/;
+    var modifierRE = /\[|\./;
+
+    var compileTemplate = function (template, isString) {
+      var state = {
+        current: 0,
+        template: template,
+        output: ""
+      };
+
+      compileTemplateState(state, isString);
+
+      return state.output;
+    };
+
+    var compileTemplateState = function (state, isString) {
+      var template = state.template;
+      var length = template.length;
+      while (state.current < length) {
+        var value = scanTemplateStateUntil(state, openRE);
+
+        if (value) {
+          state.output += value;
+        }
+
+        state.current += 2;
+
+        var name = scanTemplateStateUntil(state, closeRE);
+
+        if (name) {
+          var modifiers = "";
+          var modifierIndex = null;
+          if ((modifierIndex = name.search(modifierRE)) !== -1) {
+            modifiers = name.substring(modifierIndex);
+            name = name.substring(0, modifierIndex);
+          }
+
+          if (isString) {
+            state.output += '" + instance.get("' + name + '")' + modifiers + ' + "';
+          } else {
+            state.output += 'instance.get("' + name + '")' + modifiers;
+          }
+        }
+
+        state.current += 2;
+      }
+    };
+
+    var scanTemplateStateUntil = function (state, re) {
+      var template = state.template;
+      var tail = template.substring(state.current);
+      var length = tail.length;
+      var idx = tail.search(re);
+
+      var match = "";
+
+      switch (idx) {
+        case -1:
+          match = tail;
+          break;
+        case 0:
+          match = '';
+          break;
+        default:
+          match = tail.substring(0, idx);
+      }
+
+      state.current += match.length;
+
+      return match;
+    };
+
     var lex = function (input) {
       var state = {
         input: input,

diff --git a/dist/moon.min.js b/dist/moon.min.js
diff --git a/src/compiler/template.js b/src/compiler/template.js
@@ -0,0 +1,72 @@
+const openRE = /\{\{/;
+const closeRE = /\}\}/;
+const modifierRE = /\[|\./;
+
+const compileTemplate = function(template, isString) {
+  let state = {
+    current: 0,
+    template: template,
+    output: ""
+  };
+
+  compileTemplateState(state, isString);
+
+  return state.output;
+}
+
+const compileTemplateState = function(state, isString) {
+  const template = state.template;
+  const length = template.length;
+  while(state.current < length) {
+    const value = scanTemplateStateUntil(state, openRE);
+
+    if(value) {
+      state.output += value;
+    }
+
+    state.current += 2;
+
+    let name = scanTemplateStateUntil(state, closeRE);
+
+    if(name) {
+      let modifiers = "";
+      let modifierIndex = null;
+      if((modifierIndex = (name.search(modifierRE))) !== -1) {
+        modifiers = name.substring(modifierIndex);
+        name = name.substring(0, modifierIndex);
+      }
+
+      if(isString) {
+        state.output += `" + instance.get("${name}")${modifiers} + "`;
+      } else {
+        state.output += `instance.get("${name}")${modifiers}`;
+      }
+    }
+
+    state.current += 2;
+  }
+}
+
+const scanTemplateStateUntil = function(state, re) {
+  const template = state.template;
+  const tail = template.substring(state.current);
+  const length = tail.length;
+  const idx = tail.search(re);
+
+  let match = "";
+
+  switch (idx) {
+    case -1:
+      match = tail;
+      break;
+    case 0:
+      match = '';
+      break;
+    default:
+      match = tail.substring(0, idx);
+  }
+
+  state.current += match.length;
+
+  return match;
+}
diff --git a/src/index.js b/src/index.js
@@ -23,6 +23,7 @@ let id = 0;
 //=require util/vdom.js
 
 /* ======= Compiler ======= */
+//=require compiler/template.js
 //=require compiler/lexer.js
 //=require compiler/parser.js
 //=require compiler/generator.js

diff --git a/src/util/util.js b/src/util/util.js
@@ -75,28 +75,6 @@ const resolveKeyPath = function(instance, obj, keypath, val) {
   return path[0];
 }
 
-/**
- * Compiles a Template
- * @param {String} template
- * @param {Boolean} isString
- * @return {String} compiled template
- */
-const compileTemplate = function(template, isString) {
-  const TEMPLATE_RE = /{{([A-Za-z0-9_$@]+)([A-Za-z0-9_.()'"+\-*/\s\[\]]+)?}}/gi;
-  let compiled = template;
-  template.replace(TEMPLATE_RE, function(match, key, modifiers) {
-    if(!modifiers) {
-      modifiers = '';
-    }
-    if(isString) {
-      compiled = compiled.replace(match, `" + instance.get("${key}")${modifiers} + "`);
-    } else {
-      compiled = compiled.replace(match, `instance.get("${key}")${modifiers}`);
-    }
-  });
-  return compiled;
-}
-
 /**
  * Extracts the Slots From Component Children
  * @param {Array} children