reduce bundle size with timeago.js

package-lock.json

@@ -9,6 +9,11 @@
       "resolved": "https://registry.npmjs.org/@gamestdio/websocket/-/websocket-0.2.2.tgz",
       "integrity": "sha512-ptWTKBq6IliC7lNhfAI/YI5WBjhPClflZV61V7In/qxGbgrWrlny6/Df4NtrUs7QUeNccv8yqQwjjw+f0veGjQ=="
     },
+    "@types/jquery": {
+      "version": "2.0.48",
+      "resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-2.0.48.tgz",
+      "integrity": "sha512-nNLzUrVjaRV/Ds1eHZLYTd7IZxs38cwwLSaqMJj8OTXY8xNUbxSK69bi9cMLvQ7dm/IBeQ1wHwQ0S1uYa0rd2w=="
+    },
     "@types/node": {
       "version": "9.4.0",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-9.4.0.tgz",
@@ -3957,27 +3962,6 @@
       "resolved": "https://registry.npmjs.org/intersection-observer/-/intersection-observer-0.5.0.tgz",
       "integrity": "sha512-8Zgt4ijlyvIrQVTA7MPb2W9+KhoetrAbxlh0RmTGxpx0+ZsAXvy7IsbNnZIrqZ6TddAdWeQj49x7Ph7Ir6KRkA=="
     },
-    "intl-messageformat": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-2.2.0.tgz",
-      "integrity": "sha1-NFvNRt5jC3aDMwwuUhd/9eq0hPw=",
-      "requires": {
-        "intl-messageformat-parser": "1.4.0"
-      }
-    },
-    "intl-messageformat-parser": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/intl-messageformat-parser/-/intl-messageformat-parser-1.4.0.tgz",
-      "integrity": "sha1-tD1FqXRoytvkQzHXS7Ho3qRPwHU="
-    },
-    "intl-relativeformat": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/intl-relativeformat/-/intl-relativeformat-2.1.0.tgz",
-      "integrity": "sha1-AQ8RBYAiUfQKxH0OPhogE0iiVd8=",
-      "requires": {
-        "intl-messageformat": "2.2.0"
-      }
-    },
     "invert-kv": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
@@ -8009,6 +7993,14 @@
         "xtend": "4.0.1"
       }
     },
+    "timeago.js": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/timeago.js/-/timeago.js-3.0.2.tgz",
+      "integrity": "sha1-MqZ+fA2IfqQspYjTquJvd95edsw=",
+      "requires": {
+        "@types/jquery": "2.0.48"
+      }
+    },
     "timers-browserify": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",

package.json

@@ -33,7 +33,6 @@
     "idb-keyval": "^2.3.0",
     "indexeddb-getall-shim": "^1.3.1",
     "intersection-observer": "^0.5.0",
-    "intl-relativeformat": "^2.1.0",
     "lodash": "^4.17.4",
     "lodash-webpack-plugin": "^0.11.4",
     "node-fetch": "^1.7.3",
@@ -54,6 +53,7 @@
     "svelte-loader": "^2.3.3",
     "svelte-transitions": "^1.1.1",
     "svgo": "^1.0.3",
+    "timeago.js": "^3.0.2",
     "tiny-queue": "^0.2.1",
     "uglifyjs-webpack-plugin": "^1.1.5",
     "url-search-params": "^0.10.0",

routes/_components/status/StatusRelativeDate.html

@@ -26,10 +26,9 @@
 
 </style>
 <script>
-  import IntlRelativeFormat from 'intl-relativeformat'
   import { mark, stop } from '../../_utils/marks'
-
+  import timeago from 'timeago.js'
-  const relativeFormat = new IntlRelativeFormat('en-US');
+  const timeagoInstance = timeago()
 
   export default {
     computed: {
@@ -37,7 +36,7 @@
       statusId: (status) => status.id,
       relativeDate: (createdAtDate) => {
         mark('compute relativeDate')
-        let res = relativeFormat.format(new Date(createdAtDate))
+        let res = timeagoInstance.format(createdAtDate)
         stop('compute relativeDate')
         return res
       },