diff --git a/lazyload/bars.svg b/lazyload/bars.svg
new file mode 100644
index 0000000..7cb07e6
--- /dev/null
+++ b/lazyload/bars.svg
@@ -0,0 +1,52 @@
+
diff --git a/lazyload/handlers.go b/lazyload/handlers.go
new file mode 100644
index 0000000..5fe3eef
--- /dev/null
+++ b/lazyload/handlers.go
@@ -0,0 +1,39 @@
+package lazyload
+
+import (
+ _ "embed"
+ "net/http"
+ "time"
+)
+
+var (
+ //go:embed tokyo.png
+ graphBytes []byte
+ //go:embed bars.svg
+ barsBytes []byte
+)
+
+func Handlers(prefix string, mux *http.ServeMux) {
+ mux.HandleFunc(prefix+"/", index)
+ mux.HandleFunc(prefix+"/graph", graph)
+ mux.HandleFunc(prefix+"/bars.svg", bars)
+ mux.HandleFunc(prefix+"/tokyo.png", tokyo)
+}
+
+func index(w http.ResponseWriter, r *http.Request) {
+ Index().Render(r.Context(), w)
+}
+
+func graph(w http.ResponseWriter, r *http.Request) {
+ time.Sleep(2 * time.Second)
+ graphImage().Render(r.Context(), w)
+}
+
+func bars(w http.ResponseWriter, r *http.Request) {
+ w.Header().Set("Content-Type", "image/svg+xml")
+ w.Write(barsBytes)
+}
+
+func tokyo(w http.ResponseWriter, r *http.Request) {
+ w.Write(graphBytes)
+}
diff --git a/lazyload/templates.templ b/lazyload/templates.templ
new file mode 100644
index 0000000..8ff587f
--- /dev/null
+++ b/lazyload/templates.templ
@@ -0,0 +1,27 @@
+package lazyload
+
+import "examples/shared"
+
+templ demo() {
+
+
+}
+
+templ graphImage() {
+
+}
+
+templ Index() {
+ @shared.Layout("Lazy Loading") {
+ Lazy Loading
+ @demo()
+ }
+}
+
diff --git a/lazyload/templates_templ.go b/lazyload/templates_templ.go
new file mode 100644
index 0000000..359ef59
--- /dev/null
+++ b/lazyload/templates_templ.go
@@ -0,0 +1,212 @@
+// Code generated by templ@(devel) DO NOT EDIT.
+
+package lazyload
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import "context"
+import "io"
+import "bytes"
+
+// GoExpression
+import "examples/shared"
+
+func demo() templ.Component {
+ return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
+ templBuffer, templIsBuffer := w.(*bytes.Buffer)
+ if !templIsBuffer {
+ templBuffer = templ.GetBuffer()
+ defer templ.ReleaseBuffer(templBuffer)
+ }
+ ctx = templ.InitializeContext(ctx)
+ var_1 := templ.GetChildren(ctx)
+ if var_1 == nil {
+ var_1 = templ.NopComponent
+ }
+ ctx = templ.ClearChildren(ctx)
+// RawElement
+ _, err = templBuffer.WriteString("")
+ if err != nil {
+ return err
+ }
+ // Element (standard)
+ _, err = templBuffer.WriteString("")
+ if err != nil {
+ return err
+ }
+ // Element (void)
+ _, err = templBuffer.WriteString("
")
+ if err != nil {
+ return err
+ }
+ _, err = templBuffer.WriteString("
")
+ if err != nil {
+ return err
+ }
+ if !templIsBuffer {
+ _, err = io.Copy(w, templBuffer)
+ }
+ return err
+ })
+}
+
+func graphImage() templ.Component {
+ return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
+ templBuffer, templIsBuffer := w.(*bytes.Buffer)
+ if !templIsBuffer {
+ templBuffer = templ.GetBuffer()
+ defer templ.ReleaseBuffer(templBuffer)
+ }
+ ctx = templ.InitializeContext(ctx)
+ var_3 := templ.GetChildren(ctx)
+ if var_3 == nil {
+ var_3 = templ.NopComponent
+ }
+ ctx = templ.ClearChildren(ctx)
+ // Element (void)
+ _, err = templBuffer.WriteString("")
+ if err != nil {
+ return err
+ }
+ if !templIsBuffer {
+ _, err = io.Copy(w, templBuffer)
+ }
+ return err
+ })
+}
+
+func Index() templ.Component {
+ return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
+ templBuffer, templIsBuffer := w.(*bytes.Buffer)
+ if !templIsBuffer {
+ templBuffer = templ.GetBuffer()
+ defer templ.ReleaseBuffer(templBuffer)
+ }
+ ctx = templ.InitializeContext(ctx)
+ var_4 := templ.GetChildren(ctx)
+ if var_4 == nil {
+ var_4 = templ.NopComponent
+ }
+ ctx = templ.ClearChildren(ctx)
+ // TemplElement
+ var_5 := templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
+ templBuffer, templIsBuffer := w.(*bytes.Buffer)
+ if !templIsBuffer {
+ templBuffer = templ.GetBuffer()
+ defer templ.ReleaseBuffer(templBuffer)
+ }
+ // Element (standard)
+ _, err = templBuffer.WriteString("")
+ if err != nil {
+ return err
+ }
+ // Text
+ var_6 := `Lazy Loading`
+ _, err = templBuffer.WriteString(var_6)
+ if err != nil {
+ return err
+ }
+ _, err = templBuffer.WriteString("
")
+ if err != nil {
+ return err
+ }
+ // Whitespace (normalised)
+ _, err = templBuffer.WriteString(` `)
+ if err != nil {
+ return err
+ }
+ // TemplElement
+ err = demo().Render(ctx, templBuffer)
+ if err != nil {
+ return err
+ }
+ if !templIsBuffer {
+ _, err = io.Copy(w, templBuffer)
+ }
+ return err
+ })
+ err = shared.Layout("Lazy Loading").Render(templ.WithChildren(ctx, var_5), templBuffer)
+ if err != nil {
+ return err
+ }
+ if !templIsBuffer {
+ _, err = io.Copy(w, templBuffer)
+ }
+ return err
+ })
+}
+
diff --git a/lazyload/tokyo.png b/lazyload/tokyo.png
new file mode 100644
index 0000000..6ccc936
Binary files /dev/null and b/lazyload/tokyo.png differ
diff --git a/main.go b/main.go
index 7e29c90..1b58493 100644
--- a/main.go
+++ b/main.go
@@ -6,6 +6,7 @@ import (
"examples/clicktoload"
"examples/deleterow"
"examples/editrow"
+ "examples/lazyload"
"log"
"net/http"
@@ -65,4 +66,10 @@ var examples = []Example{
Slug: "edit-row",
Handlers: editrow.Handlers,
},
+ {
+ Name: "Lazy Loading",
+ Desc: "Demonstrates how to lazy load content",
+ Slug: "lazy-loading",
+ Handlers: lazyload.Handlers,
+ },
}