add perf utils

Author: RobinMalfait

.gitignore

@@ -4,3 +4,6 @@
 index.html
 package-lock.json
 yarn-error.log
+
+# Perf related files
+isolate*.log

perf/.gitignore

@@ -0,0 +1,2 @@
+output*.css
+v8.json

perf/fixture.css

@@ -0,0 +1,61 @@
+@tailwind base;
+
+@tailwind components;
+
+@tailwind utilities;
+
+
+.btn-1-xl {
+  @apply sm:space-x-0;
+  @apply xl:space-x-0;
+  @apply sm:space-x-1;
+  @apply xl:space-x-1;
+  @apply sm:space-y-0;
+  @apply xl:space-y-0;
+  @apply sm:space-y-1;
+  @apply xl:space-y-1;
+}
+.btn-2-xl {
+  @apply sm:space-x-0;
+  @apply xl:space-x-0;
+  @apply sm:space-x-1;
+  @apply xl:space-x-1;
+  @apply sm:space-y-0;
+  @apply xl:space-y-0;
+  @apply sm:space-y-1;
+  @apply xl:space-y-1;
+  @apply btn-1-xl;
+}
+.btn-3-xl {
+  @apply sm:space-x-0;
+  @apply xl:space-x-0;
+  @apply sm:space-x-1;
+  @apply xl:space-x-1;
+  @apply sm:space-y-0;
+  @apply xl:space-y-0;
+  @apply sm:space-y-1;
+  @apply xl:space-y-1;
+  @apply btn-2-xl;
+}
+.btn-4-xl {
+  @apply sm:space-x-0;
+  @apply xl:space-x-0;
+  @apply sm:space-x-1;
+  @apply xl:space-x-1;
+  @apply sm:space-y-0;
+  @apply xl:space-y-0;
+  @apply sm:space-y-1;
+  @apply xl:space-y-1;
+  @apply btn-3-xl;
+}
+.btn-5-xl {
+  @apply sm:space-x-0;
+  @apply xl:space-x-0;
+  @apply sm:space-x-1;
+  @apply xl:space-x-1;
+  @apply sm:space-y-0;
+  @apply xl:space-y-0;
+  @apply sm:space-y-1;
+  @apply xl:space-y-1;
+  @apply btn-4-xl;
+}

perf/script.sh

@@ -0,0 +1,15 @@
+# Cleanup existing perf stuff
+rm isolate-*.log
+
+# Ensure we use the latest build version
+npm run babelify
+
+# Run Tailwind on the big fixture file & profile it
+node --prof lib/cli.js build ./perf/fixture.css -c ./perf/tailwind.config.js -o ./perf/output.css
+
+# Generate flame graph
+node --prof-process --preprocess -j isolate*.log > ./perf/v8.json
+
+# Now visit: https://mapbox.github.io/flamebearer/
+# And drag that v8.json file in there!
+# You can put "./lib" in the search box which will highlight all our code in green.

perf/tailwind.config.js

@@ -0,0 +1,28 @@
+module.exports = {
+  future: 'all',
+  experimental: 'all',
+  purge: [],
+  theme: {
+    extend: {},
+  },
+  variants: [
+    'responsive',
+    'motion-safe',
+    'motion-reduce',
+    'group-hover',
+    'group-focus',
+    'hover',
+    'focus-within',
+    'focus-visible',
+    'focus',
+    'active',
+    'visited',
+    'disabled',
+    'checked',
+    'first',
+    'last',
+    'odd',
+    'even',
+  ],
+  plugins: [],
+}