README
¶
Fragments
Fragments middleware for Fiber enables building microservices for the frontend.
A <fragment> symbolizes a part of a template that can be served by a singular microservice. Thus, making a fragment the contract between different services and teams within a large engineering organization. The middleware concurrently fetches those parts from the service and replaces it in the template. It supports GET and POST HTTP methods to fetcht the content. Related resources like CSS or JavaScript are injected via the HTTP LINK entity header field. A <fragment> can occure in the body element or the header element. See Example to learn more about using fragments.
Tailor by Zalando is prior art for this middleware.
Fragement(s)
A fragment will be hybrid-polymorphic (if this is a thing). On the server it is parsed and evaluate by the middleware. 🦄 In the browser it will be a web component that received data from the middleware (this is still work in progress ⚠️).
Server
srcThe source to fetch for replacement in the DOMmethodcan be ofGET(default) orPOST.primarydenotes a fragment that sets the response code of the pageidis an optional unique identifier (optional)refis an optional forward reference to anid(optional)timeouttimeout of a fragement to receive in milliseconds (default is300)deferredis deferring the fetch to the browserfallbackis the fallback source in case of timeout/error on the current fragment
Example
Import the middleware package this is part of the Fiber web framework.
package main
import (
"github.com/gofiber/fiber/v2"
"github.com/gofiber/template/html"
"github.com/github/fiber-fragments"
)
After you initiate your Fiber app, you can plugin in the fragments middleware. The middleware draws the templates for the fragments to load from the template engine. Thus it supports using all template engines supported by the Fiber team.
// Create a new engine
engine := html.New("./views", ".html")
// Pass the engine to the Views
app := fiber.New(fiber.Config{
Views: engine,
})
// Associates the route with a specific template with fragments to render
app.Get("/index", fragments.Template(fragments.Config{}, "index", fiber.Map{}, "layouts/main"))
// this would listen to port 8080
app.Listen(":8080")
<html>
<head>
<script type="fragment" src="assets"></script>
</head>
<body>
<h1>Example</h1>
<fragment src="fragment1.html"></fragment>
</body>
</html>
The example folder contains many examples. You can learn how to use a forward reference of content for fetching outer and inner content and replace either one.
Benchmark(s)
This is run on a MacBook Pro 16 inch locally. It is the example run.
- Parsing a local template with extrapolation with the fragments
- Parsing the fragments
- Doing fragments
- Inlining results and adding
Linkheader resources to the output
echo "GET http://127.0.0.1:8080/index" | vegeta attack -duration=5s -rate 2000 | tee results.bin | vegeta report
vegeta report -type=json results.bin > metrics.json
cat results.bin | vegeta plot > plot.html
cat results.bin | vegeta report -type="hist[0,100ms,200ms,300ms]"
Requests [total, rate, throughput] 10000, 2000.26, 2000.15
Duration [total, attack, wait] 5s, 4.999s, 285.172µs
Latencies [min, mean, 50, 90, 95, 99, max] 183.725µs, 251.517µs, 226.993µs, 310.698µs, 394.601µs, 563.022µs, 1.347ms
Bytes In [total, mean] 6240000, 624.00
Bytes Out [total, mean] 0, 0.00
Success [ratio] 100.00%
Status Codes [code:count] 200:10000
Error Set:
Bucket # % Histogram
[0s, 100ms] 10000 100.00% ###########################################################################
[100ms, 200ms] 0 0.00%
[200ms, 300ms] 0 0.00%
[300ms, +Inf] 0 0.00%
License
Documentation
¶
Index ¶
- Constants
- func CreateNodes(links []Link) []*html.Node
- func Do(c *fiber.Ctx, cfg Config, doc *Document) error
- func Template(config Config, name string, bind interface{}, layouts ...string) fiber.Handler
- type Config
- type Document
- type Fragment
- func (f *Fragment) Deferred() bool
- func (f *Fragment) Element() *goquery.Selection
- func (f *Fragment) Fallback() string
- func (f *Fragment) HtmlFragment() *HtmlFragment
- func (f *Fragment) ID() string
- func (f *Fragment) Links() []*html.Node
- func (f *Fragment) Method() string
- func (f *Fragment) Primary() bool
- func (f *Fragment) Ref() string
- func (f *Fragment) Resolve() ResolverFunc
- func (f *Fragment) Src() string
- func (f *Fragment) Timeout() time.Duration
- type Header
- type HtmlFragment
- type Link
- type Resolver
- type ResolverFunc
Constants ¶
const ( StyleSheet = "stylesheet" Script = "script" )
Variables ¶
This section is empty.
Functions ¶
Types ¶
type Config ¶
type Config struct {
// Filter defines a function to skip the middleware.
// Optional. Default: nil
Filter func(*fiber.Ctx) bool
// FilterResponse defines a function to filter the responses
// from the fragment sources.
FilterResponse func(*fasthttp.Response) *fasthttp.Response
// FilterRequest defines a function to filter the request
// to the fragment sources.
FilterRequest func(*fasthttp.Request) *fasthttp.Request
// ErrorHandler defines a function which is executed
// It may be used to define a custom error.
// Optional. Default: 401 Invalid or expired key
ErrorHandler fiber.ErrorHandler
// FilterHead defines a function to filter the new
// nodes in the <head> of the document passed by the LINK header entity.
FilterHead func([]*html.Node) []*html.Node
// DefaultHost defines the host to use,
// if no host is set on a fragment.
// Optional. Default: localhost:3000
DefaultHost string
}
Config ...
type Document ¶
Document ...
func (*Document) HtmlFragment ¶ added in v0.2.0
func (d *Document) HtmlFragment() *HtmlFragment
Fragments is returning the selection of fragments from an HTML page.
func (*Document) SetStatusCode ¶
SetStatusCode is setting the HTTP status code for the document.
func (*Document) StatusCode ¶
StatusCode is getting the HTTP status code for the document.
type Fragment ¶
type Fragment struct {
// contains filtered or unexported fields
}
Fragment is a <fragment> in the <header> or <body> of a HTML page.
func FromSelection ¶
FromSelection creates a new fragment from a fragment selection in the DOM.
func (*Fragment) HtmlFragment ¶ added in v0.2.0
func (f *Fragment) HtmlFragment() *HtmlFragment
HtmlFragment returns embedded fragments of HTML.
func (*Fragment) Links ¶
Links returns the new nodes that go in the head via the LINK HTTP header entity.
func (*Fragment) Primary ¶
Primary denotes a fragment as responsible for setting the response code of the entire HTML page.
func (*Fragment) Resolve ¶
func (f *Fragment) Resolve() ResolverFunc
Resolve is resolving all needed data, setting headers and the status code.
type HtmlFragment ¶ added in v0.2.0
HtmlFragment is representation of HTML fragments.
func NewHtmlFragment ¶ added in v0.2.0
func NewHtmlFragment(root *html.Node) (*HtmlFragment, error)
NewHtmlFragment creates a new fragment of HTML.
func (*HtmlFragment) AppendHead ¶ added in v0.2.1
func (d *HtmlFragment) AppendHead(ns ...*html.Node)
AppendHead ...
func (*HtmlFragment) Fragment ¶ added in v0.2.0
func (h *HtmlFragment) Fragment() *goquery.Document
Document get the full document representation of the HTML fragment.
func (*HtmlFragment) Fragments ¶ added in v0.2.0
func (h *HtmlFragment) Fragments() (map[string]*Fragment, error)
Fragments is returning the selection of fragments from an HTML page.
func (*HtmlFragment) Html ¶ added in v0.2.0
func (h *HtmlFragment) Html() (string, error)
Html creates the HTML output of the created document.
Source Files
Directories