lit · justinfagnani · Oct 27, 2023
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,6 @@
+/node_modules/
+/.wireit/
+/benchmarks/**/*.js
+/benchmarks/**/*.js.map
+/benchmarks/**/*.d.ts
+/benchmarks/**/*.d.ts.map
diff --git a/LICENSE b/LICENSE
@@ -0,0 +1,28 @@
+BSD 3-Clause License
+
+Copyright (c) 2023 Google LLC. All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice, this
+   list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright notice,
+   this list of conditions and the following disclaimer in the documentation
+   and/or other materials provided with the distribution.
+
+3. Neither the name of the copyright holder nor the names of its
+   contributors may be used to endorse or promote products derived from
+   this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
diff --git a/README.md b/README.md
@@ -1 +1,39 @@
-# platform-benchmarks
+# Lit platform benchmarks
+
+This repo contains a set of micro-benchmarks of basic platform APIs.
+
+The benchmarks are useful to measure the performance fundamental operations across different DOM and JavaScript techniques and different browsers.
+
+## Benchmarks
+
+### dirty-check-attributes
+
+This benchmark measures the performance impact of dirty-checking values before calling `setAttribute()``.
+
+It measures three techniques:
+- always call `setAttribute()`` (no dirty-check)
+- dirty check against the DOM (with `getAttribute()`)
+- dirty check against a stored JS value
+
+```sh
+npm run bench:dirty-check-attributes
+```
+
+### dirty-check-text-content
+
+This benchmark measures the performance impact of dirty-checking values
+before setting `Text.textContent`.
+
+It measures three techniques:
+- always call `textContent` (no dirty-check)
+- dirty check against the DOM
+- dirty check against a stored JS value
+
+## Future benchmarks
+- Setting `.textContent` vs `.data`
+- `append()` vs `insertBefore()`
+- `template.innerHTML` vs `DOMParser`
+- template clone vs imperative DOM construction
+- Reusing TreeWalkers
+- Finding nodes with TreeWalker + comments vs query selectors, etc
+
diff --git a/benchmarks/dirty-check-attributes/index.html b/benchmarks/dirty-check-attributes/index.html
@@ -0,0 +1,4 @@
+<!doctype html>
+<html>
+  <script type="module" src="./index.js"></script> 
+</html>
diff --git a/benchmarks/dirty-check-attributes/tachometer.json b/benchmarks/dirty-check-attributes/tachometer.json
@@ -0,0 +1,60 @@
+{
+  "$schema": "https://raw.githubusercontent.com/Polymer/tachometer/master/config.schema.json",
+  "sampleSize": 50,
+  "timeout": 3,
+  "benchmarks": [
+    {
+      "measurement": {
+        "mode": "performance",
+        "entryName": "result"
+      },
+      "expand": [
+        {
+          "name": "always-set",
+          "url": "./index.html?benchmark=always-set",
+          "expand": [
+            {
+            "browser": "chrome"
+            },
+            {
+              "browser": "safari"
+            },
+            {
+              "browser": "firefox"
+            }
+          ]
+        },
+        {
+          "name": "check-set",
+          "url": "./index.html?benchmark=check-set",
+          "expand": [
+            {
+            "browser": "chrome"
+            },
+            {
+              "browser": "safari"
+            },
+                    {
+              "browser": "firefox"
+            }
+          ]
+        },
+        {
+          "name": "dirty-check",
+          "url": "./index.html?benchmark=dirty-check",
+          "expand": [
+            {
+            "browser": "chrome"
+            },
+            {
+              "browser": "safari"
+            },
+                    {
+              "browser": "firefox"
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}
diff --git a/benchmarks/dirty-check-text-content/index.html b/benchmarks/dirty-check-text-content/index.html
@@ -0,0 +1,4 @@
+<!doctype html>
+<html>
+  <script type="module" src="./index.js"></script> 
+</html>
diff --git a/benchmarks/dirty-check-text-content/tachometer.json b/benchmarks/dirty-check-text-content/tachometer.json
@@ -0,0 +1,60 @@
+{
+  "$schema": "https://raw.githubusercontent.com/Polymer/tachometer/master/config.schema.json",
+  "sampleSize": 50,
+  "timeout": 3,
+  "benchmarks": [
+    {
+      "measurement": {
+        "mode": "performance",
+        "entryName": "result"
+      },
+      "expand": [
+        {
+          "name": "always-set",
+          "url": "./index.html?benchmark=always-set",
+          "expand": [
+            {
+            "browser": "chrome"
+            },
+            {
+              "browser": "safari"
+            },
+            {
+              "browser": "firefox"
+            }
+          ]
+        },
+        {
+          "name": "check-set",
+          "url": "./index.html?benchmark=check-set",
+          "expand": [
+            {
+            "browser": "chrome"
+            },
+            {
+              "browser": "safari"
+            },
+                    {
+              "browser": "firefox"
+            }
+          ]
+        },
+        {
+          "name": "dirty-check",
+          "url": "./index.html?benchmark=dirty-check",
+          "expand": [
+            {
+            "browser": "chrome"
+            },
+            {
+              "browser": "safari"
+            },
+                    {
+              "browser": "firefox"
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}