From a6e8cf983ed4eb4775921ffd9db3b849af1eca12 Mon Sep 17 00:00:00 2001
From: MacRat <m@crat.jp>
Date: Thu, 8 Feb 2024 20:25:18 +0900
Subject: [PATCH 1/2] perf: minify HTML more agressive

---
 builder/go.mod         |   3 +-
 builder/go.sum         |   2 +
 builder/markdown.go    |  13 +---
 builder/minify.go      | 162 ++++++++++++++++++++++++++++++++++++-----
 builder/minify_test.go | 156 +++++++++++++++++++++++++++++++++++++++
 5 files changed, 309 insertions(+), 27 deletions(-)
 create mode 100644 builder/minify_test.go

diff --git a/builder/go.mod b/builder/go.mod
index da72bea3..0bb0fb08 100644
--- a/builder/go.mod
+++ b/builder/go.mod
@@ -8,11 +8,13 @@ require (
 	github.com/dsoprea/go-jpeg-image-structure/v2 v2.0.0-20221012074422-4f3f7e934102
 	github.com/fsnotify/fsnotify v1.7.0
 	github.com/golang/freetype v0.0.0-20170609003504-e2365dfdc4a0
+	github.com/google/go-cmp v0.6.0
 	github.com/skip2/go-qrcode v0.0.0-20200617195104-da1b6568686e
 	github.com/tdewolff/minify/v2 v2.20.14
 	github.com/yuin/goldmark v1.6.0
 	github.com/yuin/goldmark-highlighting/v2 v2.0.0-20230729083705-37449abec8cc
 	golang.org/x/image v0.15.0
+	golang.org/x/net v0.20.0
 	gopkg.in/yaml.v3 v3.0.1
 )
 
@@ -27,7 +29,6 @@ require (
 	github.com/go-xmlfmt/xmlfmt v1.1.2 // indirect
 	github.com/golang/geo v0.0.0-20230421003525-6adc56603217 // indirect
 	github.com/tdewolff/parse/v2 v2.7.9 // indirect
-	golang.org/x/net v0.20.0 // indirect
 	golang.org/x/sys v0.16.0 // indirect
 	gopkg.in/yaml.v2 v2.4.0 // indirect
 )
diff --git a/builder/go.sum b/builder/go.sum
index aa112761..f4d1c974 100644
--- a/builder/go.sum
+++ b/builder/go.sum
@@ -62,6 +62,8 @@ github.com/golang/geo v0.0.0-20210211234256-740aa86cb551 h1:gtexQ/VGyN+VVFRXSFig
 github.com/golang/geo v0.0.0-20210211234256-740aa86cb551/go.mod h1:QZ0nwyI2jOfgRAoBvP+ab5aRr7c9x7lhGEJrKvBwjWI=
 github.com/golang/geo v0.0.0-20230421003525-6adc56603217 h1:HKlyj6in2JV6wVkmQ4XmG/EIm+SCYlPZ+V4GWit7Z+I=
 github.com/golang/geo v0.0.0-20230421003525-6adc56603217/go.mod h1:8wI0hitZ3a1IxZfeH3/5I97CI8i5cLGsYe7xNhQGs9U=
+github.com/google/go-cmp v0.6.0 h1:ofyhxvXcZhMsU5ulbFiLKl/XBFqE1GSq7atu8tAmTRI=
+github.com/google/go-cmp v0.6.0/go.mod h1:17dUlkBOakJ0+DkrSSNjCkIjxS6bF9zb3elmeNGIjoY=
 github.com/jessevdk/go-flags v1.4.0/go.mod h1:4FA24M0QyGHXBuZZK/XkWh8h0e1EYbRYJSGM75WSRxI=
 github.com/jessevdk/go-flags v1.5.0/go.mod h1:Fw0T6WPc1dYxT4mKEZRfG5kJhaTDP9pj1c2EWnYs/m4=
 github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
diff --git a/builder/markdown.go b/builder/markdown.go
index abb34507..3c104011 100644
--- a/builder/markdown.go
+++ b/builder/markdown.go
@@ -2,8 +2,8 @@ package main
 
 import (
 	"bytes"
-	"encoding/json"
 	"fmt"
+	"html/template"
 	"io"
 	"net/url"
 	"regexp"
@@ -137,12 +137,7 @@ func (r *CodeRenderer) Render(w markdown.BufWriter, source []byte, node ast.Node
 		return ast.WalkStop, err
 	}
 
-	jsonCode, err := json.Marshal(plainCode)
-	if err != nil {
-		return ast.WalkStop, err
-	}
-
-	_, err = fmt.Fprintf(w, `<div class="chroma"><button onclick='copyCodeBlock(this, %s)'>Copy</button><pre>`, jsonCode)
+	_, err = fmt.Fprintf(w, `<div class="chroma" data-code="%s"><button onclick='copyCodeBlock(this)'>Copy</button><pre>`, template.HTMLEscapeString(plainCode))
 	if err != nil {
 		return ast.WalkStop, err
 	}
@@ -159,8 +154,8 @@ func (r *CodeRenderer) Render(w markdown.BufWriter, source []byte, node ast.Node
 func (r *CodeRenderer) WriteCodeBlockAssets(w io.Writer) error {
 	_, err := fmt.Fprintf(w, `
 		<script>
-		function copyCodeBlock(elm, code) {
-			navigator.clipboard.writeText(code).then(() => {
+		function copyCodeBlock(elm) {
+			navigator.clipboard.writeText(elm.parentNode.dataset.code).then(() => {
 				elm.innerText = "Copied!";
 				setTimeout(() => {
 					elm.innerText = "Copy";
diff --git a/builder/minify.go b/builder/minify.go
index 76176321..fc739d17 100644
--- a/builder/minify.go
+++ b/builder/minify.go
@@ -1,39 +1,52 @@
 package main
 
 import (
+	"bytes"
 	"io"
+	"strings"
 
 	"github.com/tdewolff/minify/v2"
 	"github.com/tdewolff/minify/v2/css"
-	"github.com/tdewolff/minify/v2/html"
+	mhtml "github.com/tdewolff/minify/v2/html"
 	"github.com/tdewolff/minify/v2/js"
 	"github.com/tdewolff/minify/v2/json"
 	"github.com/tdewolff/minify/v2/svg"
 	"github.com/tdewolff/minify/v2/xml"
+	"golang.org/x/net/html"
+	"golang.org/x/net/html/atom"
 )
 
+var (
+	Minifier      = minify.New()
+	MinifierFuncs = map[string]minify.MinifierFunc{
+		"text/html":              mhtml.Minify,
+		"text/css":               css.Minify,
+		"text/javascript":        js.Minify,
+		"application/javascript": js.Minify,
+		"application/json":       json.Minify,
+		"application/ld+json":    json.Minify,
+		"image/svg+xml":          svg.Minify,
+		"text/xml":               xml.Minify,
+		"application/xml":        xml.Minify,
+	}
+)
+
+func init() {
+	for k, v := range MinifierFuncs {
+		Minifier.AddFunc(k, v)
+	}
+}
+
 func MinifyWriter(mimetype string, w io.Writer) io.WriteCloser {
-	types := map[string]minify.MinifierFunc{
-		"text/html":           html.Minify,
-		"text/css":            css.Minify,
-		"text/javascript":     js.Minify,
-		"application/json":    json.Minify,
-		"application/ld+json": json.Minify,
-		"image/svg+xml":       svg.Minify,
-		"text/xml":            xml.Minify,
-		"application/xml":     xml.Minify,
-	}
-
-	if _, ok := types[mimetype]; !ok {
+	if _, ok := MinifierFuncs[mimetype]; !ok {
 		return NopWriteCloser{w}
 	}
 
-	m := minify.New()
-	for k, v := range types {
-		m.AddFunc(k, v)
+	if mimetype == "text/html" {
+		return &HTMLMinifier{w: Minifier.Writer(mimetype, w)}
 	}
 
-	return m.Writer(mimetype, w)
+	return Minifier.Writer(mimetype, w)
 }
 
 type NopWriteCloser struct {
@@ -47,3 +60,118 @@ func (w NopWriteCloser) Write(p []byte) (int, error) {
 func (w NopWriteCloser) Close() error {
 	return nil
 }
+
+type HTMLMinifier struct {
+	w   io.WriteCloser
+	buf bytes.Buffer
+}
+
+func (w *HTMLMinifier) Write(p []byte) (int, error) {
+	return w.buf.Write(p)
+}
+
+func (w *HTMLMinifier) Close() error {
+	if err := HoistingHTML(w.w, &w.buf); err != nil {
+		return err
+	}
+	return w.w.Close()
+}
+
+func getAttribute(n *html.Node, key, default_ string) string {
+	for _, attr := range n.Attr {
+		if attr.Key == key {
+			return attr.Val
+		}
+	}
+	return default_
+}
+
+func nextNode(n *html.Node) *html.Node {
+	if n.FirstChild != nil {
+		return n.FirstChild
+	} else if n.NextSibling != nil {
+		return n.NextSibling
+	} else {
+		for {
+			n = n.Parent
+			if n == nil {
+				break
+			}
+			if n.NextSibling != nil {
+				return n.NextSibling
+			}
+		}
+	}
+	return nil
+}
+
+func HoistingHTML(w io.Writer, r io.Reader) error {
+	var scripts []string
+	var styles []string
+
+	root, err := html.Parse(r)
+	if err != nil {
+		return err
+	}
+
+	node := root
+	var head, body *html.Node
+
+	popAndGoNext := func() {
+		var next *html.Node
+		for next == nil {
+			next = node.NextSibling
+			if next == nil {
+				node = node.Parent
+			}
+		}
+
+		node.Parent.RemoveChild(node)
+		node = next
+	}
+
+	for node != nil {
+		if node.DataAtom == atom.Head {
+			head = node
+		}
+		if node.DataAtom == atom.Body {
+			body = node
+		}
+
+		if node.DataAtom == atom.Script && getAttribute(node, "type", "text/javascript") == "text/javascript" && node.FirstChild != nil {
+			scripts = append(scripts, node.FirstChild.Data)
+			popAndGoNext()
+		} else if node.DataAtom == atom.Style && getAttribute(node, "type", "text/css") == "text/css" && node.FirstChild != nil {
+			styles = append(styles, node.FirstChild.Data)
+			popAndGoNext()
+		} else {
+			node = nextNode(node)
+		}
+	}
+
+	if script := strings.Join(scripts, "\n;\n"); script != "" {
+		body.AppendChild(&html.Node{
+			Type:     html.ElementNode,
+			DataAtom: atom.Script,
+			Data:     "script",
+			FirstChild: &html.Node{
+				Type: html.TextNode,
+				Data: script,
+			},
+		})
+	}
+
+	if style := strings.Join(styles, "\n"); style != "" {
+		head.AppendChild(&html.Node{
+			Type:     html.ElementNode,
+			DataAtom: atom.Style,
+			Data:     "style",
+			FirstChild: &html.Node{
+				Type: html.TextNode,
+				Data: style,
+			},
+		})
+	}
+
+	return html.Render(w, root)
+}
diff --git a/builder/minify_test.go b/builder/minify_test.go
new file mode 100644
index 00000000..b3e2cbf1
--- /dev/null
+++ b/builder/minify_test.go
@@ -0,0 +1,156 @@
+package main
+
+import (
+	"fmt"
+	"strings"
+	"testing"
+
+	"github.com/google/go-cmp/cmp"
+)
+
+func TestHoistingHTML(t *testing.T) {
+	tests := []struct {
+		source string
+		output string
+	}{
+		{
+			source: strings.Join([]string{
+				`<!DOCTYPE html>`,
+				`<html>`,
+				`	<head>`,
+				`		<meta charset="utf-8">`,
+				`		<title>Hoisting</title>`,
+				`		<script src="script.js"></script>`,
+				`		<script src="https://example.com/lib/script.js"></script>`,
+				`	</head>`,
+				`	<body>`,
+				`		<h1>Hoisting</h1>`,
+				`		<p>Hoisting for HTML!</p>`,
+				`	</body>`,
+				`</html>`,
+			}, "\n"),
+			output: strings.Join([]string{
+				`<!DOCTYPE html><html><head>`,
+				`		<meta charset="utf-8"/>`,
+				`		<title>Hoisting</title>`,
+				`		<script src="script.js"></script>`,
+				`		<script src="https://example.com/lib/script.js"></script>`,
+				`	</head>`,
+				`	<body>`,
+				`		<h1>Hoisting</h1>`,
+				`		<p>Hoisting for HTML!</p>`,
+				`	`,
+				`</body></html>`,
+			}, "\n"),
+		},
+		{
+			source: strings.Join([]string{
+				`<!DOCTYPE html>`,
+				`<html>`,
+				`	<head>`,
+				`		<meta charset="utf-8">`,
+				`		<title>Hoisting</title>`,
+				`		<script>`,
+				`			console.log("hello");`,
+				`		</script>`,
+				`		<style>`,
+				`body {`,
+				`  background-color: #fff;`,
+				`}`,
+				`		</style>`,
+				`	</head>`,
+				`	<body>`,
+				`		<h1>Hoisting</h1>`,
+				`		<p>Hoisting for HTML!</p>`,
+				`		<style>`,
+				`p {`,
+				`  color: #000;`,
+				`}`,
+				`		</style>`,
+				`		<script>`,
+				`			console.log("world!");`,
+				`		</script>`,
+				`	</body>`,
+				`</html>`,
+			}, "\n"),
+			output: strings.Join([]string{
+				`<!DOCTYPE html><html><head>`,
+				`		<meta charset="utf-8"/>`,
+				`		<title>Hoisting</title>`,
+				`		`,
+				`		`,
+				`	<style>body{background-color:#fff}p{color:#000}</style></head>`,
+				`	<body>`,
+				`		<h1>Hoisting</h1>`,
+				`		<p>Hoisting for HTML!</p>`,
+				`		`,
+				`		`,
+				`	`,
+				`<script>console.log("hello"),console.log("world!")</script></body></html>`,
+			}, "\n"),
+		},
+		{
+			source: strings.Join([]string{
+				`<!DOCTYPE html>`,
+				`<html>`,
+				`	<head>`,
+				`		<meta charset="utf-8">`,
+				`		<title>Hoisting</title>`,
+				`		<script src="script.js"></script>`,
+				`		<script src="https://example.com/lib/script.js"></script>`,
+				`		<script>`,
+				`			console.log("hello");`,
+				`		</script>`,
+				`		<style>`,
+				`body {`,
+				`  background-color: #fff;`,
+				`}`,
+				`		</style>`,
+				`	</head>`,
+				`	<body>`,
+				`		<h1>Hoisting</h1>`,
+				`		<p>Hoisting for HTML!</p>`,
+				`		<style>`,
+				`p {`,
+				`  color: #000;`,
+				`}`,
+				`		</style>`,
+				`		<script>`,
+				`			console.log("world!");`,
+				`		</script>`,
+				`	</body>`,
+				`</html>`,
+			}, "\n"),
+			output: strings.Join([]string{
+				`<!DOCTYPE html><html><head>`,
+				`		<meta charset="utf-8"/>`,
+				`		<title>Hoisting</title>`,
+				`		<script src="script.js"></script>`,
+				`		<script src="https://example.com/lib/script.js"></script>`,
+				`		`,
+				`		`,
+				`	<style>body{background-color:#fff}p{color:#000}</style></head>`,
+				`	<body>`,
+				`		<h1>Hoisting</h1>`,
+				`		<p>Hoisting for HTML!</p>`,
+				`		`,
+				`		`,
+				`	`,
+				`<script>console.log("hello"),console.log("world!")</script></body></html>`,
+			}, "\n"),
+		},
+	}
+
+	for i, test := range tests {
+		t.Run(fmt.Sprint(i), func(t *testing.T) {
+			var output strings.Builder
+			err := HoistingHTML(&output, strings.NewReader(test.source))
+			if err != nil {
+				t.Fatalf("unexpected error: %v", err)
+			}
+			if diff := cmp.Diff(test.output, output.String()); diff != "" {
+				t.Errorf("output mismatch (-want +got):\n%s", diff)
+			}
+		})
+	}
+}

From d8d61312d5a379cd663887ea34ade5f4a363bd58 Mon Sep 17 00:00:00 2001
From: MacRat <m@crat.jp>
Date: Thu, 8 Feb 2024 20:34:29 +0900
Subject: [PATCH 2/2] test: fix snapshot test

---
 builder/minify_test.go | 38 ++++++++++++++++++++++++++++++++++----
 1 file changed, 34 insertions(+), 4 deletions(-)

diff --git a/builder/minify_test.go b/builder/minify_test.go
index b3e2cbf1..aae28340 100644
--- a/builder/minify_test.go
+++ b/builder/minify_test.go
@@ -79,14 +79,29 @@ func TestHoistingHTML(t *testing.T) {
 				`		<title>Hoisting</title>`,
 				`		`,
 				`		`,
-				`	<style>body{background-color:#fff}p{color:#000}</style></head>`,
+				`	<style>`,
+				`body {`,
+				`  background-color: #fff;`,
+				`}`,
+				`		`,
+				``,
+				`p {`,
+				`  color: #000;`,
+				`}`,
+				`		</style></head>`,
 				`	<body>`,
 				`		<h1>Hoisting</h1>`,
 				`		<p>Hoisting for HTML!</p>`,
 				`		`,
 				`		`,
 				`	`,
-				`<script>console.log("hello"),console.log("world!")</script></body></html>`,
+				`<script>`,
+				`			console.log("hello");`,
+				`		`,
+				`;`,
+				``,
+				`			console.log("world!");`,
+				`		</script></body></html>`,
 			}, "\n"),
 		},
 		{
@@ -129,14 +144,29 @@ func TestHoistingHTML(t *testing.T) {
 				`		<script src="https://example.com/lib/script.js"></script>`,
 				`		`,
 				`		`,
-				`	<style>body{background-color:#fff}p{color:#000}</style></head>`,
+				`	<style>`,
+				`body {`,
+				`  background-color: #fff;`,
+				`}`,
+				`		`,
+				``,
+				`p {`,
+				`  color: #000;`,
+				`}`,
+				`		</style></head>`,
 				`	<body>`,
 				`		<h1>Hoisting</h1>`,
 				`		<p>Hoisting for HTML!</p>`,
 				`		`,
 				`		`,
 				`	`,
-				`<script>console.log("hello"),console.log("world!")</script></body></html>`,
+				`<script>`,
+				`			console.log("hello");`,
+				`		`,
+				`;`,
+				``,
+				`			console.log("world!");`,
+				`		</script></body></html>`,
 			}, "\n"),
 		},
 	}