refactor: reduce dist files sizes (#76)

* fix(parser): plugin-helper import, remove dist file code duplication

* feat(plugin-helper): reduce bundle size, set new limits to 650 bytes

* refactor(preset): html5, react presets to reduce the size of dist files

packages/bbob-parser/src/parse.js

@@ -1,5 +1,5 @@
 import TagNode from '@bbob/plugin-helper/lib/TagNode';
-import { isTagNode } from '@bbob/plugin-helper';
+import { isTagNode } from '@bbob/plugin-helper/lib/index';
 import { createLexer } from './lexer';
 import { createList } from './utils';
 

packages/bbob-plugin-helper/package.json

@@ -42,7 +42,7 @@
   "bundlesize": [
     {
       "path": "./dist/index.min.js",
-      "maxSize": "580 B"
+      "maxSize": "650 B"
     }
   ],
   "publishConfig": {

packages/bbob-plugin-helper/src/index.js

@@ -4,6 +4,8 @@ const isTagNode = (el) => typeof el === 'object' && !!el.tag;
 const isStringNode = (el) => typeof el === 'string';
 const isEOL = (el) => el === N;
 
+const keysReduce = (obj, reduce, def) => Object.keys(obj).reduce(reduce, def);
+
 const getNodeLength = (node) => {
   if (isTagNode(node)) {
     return node.content.reduce((count, contentNode) => count + getNodeLength(contentNode), 0);
@@ -61,13 +63,15 @@ const attrValue = (name, value) => {
  */
 const attrsToString = (values) => {
   // To avoid some malformed attributes
-  if (typeof values === 'undefined') {
+  if (values == null) {
     return '';
   }
 
-  return Object.keys(values)
+  return keysReduce(
-    .reduce((arr, key) => [...arr, attrValue(key, values[key])], [''])
+    values,
-    .join(' ');
+    (arr, key) => [...arr, attrValue(key, values[key])],
+    [''],
+  ).join(' ');
 };
 
 /**
@@ -77,9 +81,11 @@ const attrsToString = (values) => {
  * @param attrs
  * @returns {string}
  */
-const getUniqAttr = (attrs) => Object
+const getUniqAttr = (attrs) => keysReduce(
-  .keys(attrs)
+  attrs,
-  .reduce((res, key) => (attrs[key] === key ? attrs[key] : null), null);
+  (res, key) => (attrs[key] === key ? attrs[key] : null),
+  null,
+);
 
 export {
   attrsToString,

packages/bbob-preset-html5/src/defaultTags.js

@@ -1,5 +1,5 @@
 /* eslint-disable no-plusplus,no-lonely-if */
-import { getUniqAttr, isStringNode, isTagNode } from '@bbob/plugin-helper';
+import { getUniqAttr, isStringNode, isTagNode } from '@bbob/plugin-helper/lib/index';
 import TagNode from '@bbob/plugin-helper/lib/TagNode';
 
 const isStartsWith = (node, type) => (node[0] === type);
@@ -59,75 +59,39 @@ const renderUrl = (node, render) => (getUniqAttr(node.attrs)
   ? getUniqAttr(node.attrs)
   : render(node.content));
 
+const toNode = (tag, attrs, content) => ({
+  tag,
+  attrs,
+  content,
+});
+
 export default {
-  b: (node) => ({
+  b: (node) => toNode('span', {
-    tag: 'span',
+    style: 'font-weight: bold;',
-    attrs: {
+  }, node.content),
-      style: 'font-weight: bold;',
+  i: (node) => toNode('span', {
-    },
+    style: 'font-style: italic;',
-    content: node.content,
+  }, node.content),
-  }),
+  u: (node) => toNode('span', {
-  i: (node) => ({
+    style: 'text-decoration: underline;',
-    tag: 'span',
+  }, node.content),
-    attrs: {
+  s: (node) => toNode('span', {
-      style: 'font-style: italic;',
+    style: 'text-decoration: line-through;',
-    },
+  }, node.content),
-    content: node.content,
+  url: (node, { render }, options) => toNode('a', {
-  }),
+    href: renderUrl(node, render, options),
-  u: (node) => ({
+  }, node.content),
-    tag: 'span',
+  img: (node, { render }) => toNode('img', {
-    attrs: {
+    src: render(node.content),
-      style: 'text-decoration: underline;',
+  }, null),
-    },
+  quote: (node) => toNode('blockquote', {}, [toNode('p', {}, node.content)]),
-    content: node.content,
+  code: (node) => toNode('pre', {}, node.content),
-  }),
+  style: (node) => toNode('span', {
-  s: (node) => ({
+    style: getStyleFromAttrs(node.attrs),
-    tag: 'span',
+  }, node.content),
-    attrs: {
+  list: (node) => {
-      style: 'text-decoration: line-through;',
+    const type = getUniqAttr(node.attrs);
-    },
+
-    content: node.content,
+    return toNode(type ? 'ol' : 'ul', type ? { type } : {}, asListItems(node.content));
-  }),
+  },
-  url: (node, { render }, options) => ({
-    tag: 'a',
-    attrs: {
-      href: renderUrl(node, render, options),
-    },
-    content: node.content,
-  }),
-  img: (node, { render }) => ({
-    tag: 'img',
-    attrs: {
-      src: render(node.content),
-    },
-    content: null,
-  }),
-  quote: (node) => ({
-    tag: 'blockquote',
-    attrs: {},
-    content: [{
-      tag: 'p',
-      attrs: {},
-      content: node.content,
-    }],
-  }),
-  code: (node) => ({
-    tag: 'pre',
-    attrs: {},
-    content: node.content,
-  }),
-  style: (node) => ({
-    tag: 'span',
-    attrs: {
-      style: getStyleFromAttrs(node.attrs),
-    },
-    content: node.content,
-  }),
-  list: (node) => ({
-    tag: getUniqAttr(node.attrs) ? 'ol' : 'ul',
-    attrs: getUniqAttr(node.attrs) ? {
-      type: getUniqAttr(node.attrs),
-    } : {},
-    content: asListItems(node.content),
-  }),
 };

packages/bbob-preset-react/src/index.js

@@ -1,33 +1,31 @@
 import presetHTML5 from '@bbob/preset-html5';
 
+const tagAttr = (style) => ({
+  attrs: {
+    style,
+  },
+});
+
 export default presetHTML5.extend((tags) => ({
   ...tags,
 
   b: (...args) => ({
     ...tags.b(...args),
-    attrs: {
+    ...tagAttr({ fontWeight: 'bold' }),
-      style: { fontWeight: 'bold' },
-    },
   }),
 
   i: (...args) => ({
-    ...tags.b(...args),
+    ...tags.i(...args),
-    attrs: {
+    ...tagAttr({ fontStyle: 'italic' }),
-      style: { fontStyle: 'italic' },
-    },
   }),
 
   u: (...args) => ({
-    ...tags.b(...args),
+    ...tags.u(...args),
-    attrs: {
+    ...tagAttr({ textDecoration: 'underline' }),
-      style: { textDecoration: 'underline' },
-    },
   }),
 
   s: (...args) => ({
-    ...tags.b(...args),
+    ...tags.s(...args),
-    attrs: {
+    ...tagAttr({ textDecoration: 'line-through' }),
-      style: { textDecoration: 'line-through' },
-    },
   }),
 }));

packages/bbob-preset/src/index.js

@@ -1,5 +1,5 @@
 /* eslint-disable indent */
-import { isTagNode } from '@bbob/plugin-helper';
+import { isTagNode } from '@bbob/plugin-helper/lib/index';
 
 function process(tags, tree, core, options) {
   tree.walk((node) => (isTagNode(node) && tags[node.tag]