Merge pull request #8 from mishamyrt/develop

Release v1.5.1

CHANGELOG.md

@@ -5,6 +5,16 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog][],
 and this project adheres to [Semantic Versioning][].
 
+## [1.5.1][] — 2019-10-20
+
+### Added
+
+-   Custom properties uglify (reduced the size of html by 312 bytes).
+
+### Removed
+
+-   Extra icons.
+
 ## [1.5.0][] — 2019-10-13
 
 ### Added
@@ -134,3 +144,5 @@ and this project adheres to [Semantic Versioning][].
 [1.4.1]: https://github.com/mishamyrt/myrt.co/releases/tag/v1.4.1
 
 [1.5.0]: https://github.com/mishamyrt/myrt.co/releases/tag/v1.5.0
+
+[1.5.1]: https://github.com/mishamyrt/myrt.co/releases/tag/v1.5.1

package.json

@@ -176,7 +176,7 @@
     {
       "name": "Critical",
       "path": "dist/static/en/index.html",
-      "limit": "4 KB"
+      "limit": "4.5 KB"
     },
     {
       "name": "Full",
@@ -185,7 +185,8 @@
         "dist/static/favicon-32*.png",
         "dist/static/*.css",
         "dist/static/*.woff2",
-        "dist/static/*.js"
+        "dist/static/*.js",
+        "dist/static/en/index.html"
       ],
       "limit": "120 KB"
     }
@@ -212,7 +213,6 @@
     "remark-lint": "^6.0.5",
     "remark-preset-lint-recommended": "^3.0.3",
     "sass": "^1.22.12",
-    "size-limit": "^2.1.6",
     "standardx": "^5.0.0",
     "stylelint": "^10.1.0",
     "stylelint-config-standard": "^18.3.0",

scripts/processors.js

@@ -19,6 +19,8 @@ const { outDir } = require('./paths')
 
 const tp = new Typograf(typografOptions)
 const classes = {}
+const properties = {}
+
 const css = {}
 
 const processNginx = () => {
@@ -96,19 +98,35 @@ const processHtmlFile = async (fileName) => {
 }
 
 const A = 'a'.charCodeAt(0)
-let lastUsed = -1
+let lastUsedClass = -1
+let lastUsedProperty = -1
 
 function cssPlugin (root) {
   const filePath = root.source.input.file.split('/')
   const fileName = filePath[filePath.length - 1]
   if (!classes[fileName]) classes[fileName] = {}
+  if (!properties[fileName]) properties[fileName] = {}
+  root.walkDecls(decl => {
+    if (decl.prop.startsWith('--')) {
+      if (!properties[fileName][decl.prop]) {
+        lastUsedProperty += 1
+        if (lastUsedProperty === 26) lastUsedProperty -= 26 + 7 + 25
+        properties[fileName][decl.prop] = `--${String.fromCharCode(A + lastUsedProperty)}`
+        decl.prop = properties[fileName][decl.prop]
+      }
+    }
+    if (decl.value.includes('var(--')) {
+      const property = decl.value.replace(/var\((.*)\)/, '$1')
+      decl.value = decl.value.replace(/--[\w_-]+/g, properties[fileName][property])
+    }
+  })
   root.walkRules(rule => {
     rule.selector = rule.selector.replace(/\.[\w_-]+/g, str => {
       const kls = str.substr(1)
       if (!classes[fileName][kls]) {
-        lastUsed += 1
-        if (lastUsed === 26) lastUsed -= 26 + 7 + 25
-        classes[fileName][kls] = String.fromCharCode(A + lastUsed)
+        lastUsedClass += 1
+        if (lastUsedClass === 26) lastUsedClass -= 26 + 7 + 25
+        classes[fileName][kls] = String.fromCharCode(A + lastUsedClass)
       }
       return '.' + classes[fileName][kls]
     })
@@ -124,7 +142,8 @@ const processCssFile = (fileName) => {
       ).css
       const filePath = fileName.split('/')
       css[filePath[filePath.length - 1]] = cssFile
-      lastUsed = -1
+      lastUsedClass = -1
+      lastUsedProperty = -1
     })
 }
 

src/manifest.webmanifest

@@ -4,47 +4,17 @@
   "theme_color": "#818181",
   "background_color": "#ffffff",
   "display": "standalone",
-  "Scope": "/",
+  "scope": "/",
   "start_url": "/en/",
   "serviceworker": {
     "src": "/worker.js"
   },
   "icons": [
-    {
-      "src": "/photo/icon-72x72.png",
-      "sizes": "72x72",
-      "type": "image/png"
-    },
-    {
-      "src": "/photo/icon-96x96.png",
-      "sizes": "96x96",
-      "type": "image/png"
-    },
-    {
-      "src": "/photo/icon-128x128.png",
-      "sizes": "128x128",
-      "type": "image/png"
-    },
-    {
-      "src": "/photo/icon-144x144.png",
-      "sizes": "144x144",
-      "type": "image/png"
-    },
-    {
-      "src": "/photo/icon-152x152.png",
-      "sizes": "152x152",
-      "type": "image/png"
-    },
     {
       "src": "/photo/icon-192x192.png",
       "sizes": "192x192",
       "type": "image/png"
     },
-    {
-      "src": "/photo/icon-384x384.png",
-      "sizes": "384x384",
-      "type": "image/png"
-    },
     {
       "src": "/photo/icon-512x512.png",
       "sizes": "512x512",

src/worker.js

@@ -38,6 +38,8 @@ self.addEventListener('activate', event => {
   event.waitUntil(clearCache())
 })
 
-self.addEventListener('fetch', event => {
-  event.respondWith(getCache(event))
-})
+if (process.env.NODE_ENV === 'production') {
+  self.addEventListener('fetch', event => {
+    event.respondWith(getCache(event))
+  })
+}