1.6.2 • Published 5 years ago

@live-components/page-header v1.6.2

Weekly downloads
-
License
MIT
Repository
github
Last release
5 years ago

<page-header>

A Simple ESM web page header Web Component

Developer Experience

Page Header

  • install as an HTML Script Tag
  • only a single runtime dependency > <img-icon> (svg icon component)
  • very small byte size over the wire > 16.5kb
  • optimal content compression > brotli (gzip for nomodule js) |
  • excellent browser support
    • IE11 (nomodule-only basic css/initial login)
    • full support for the last 2 versions of Safari, Edge, Firefox, Mobile Safari, Chrome
  • minimal developer tooling
    • Qunit (unit testing)
    • bread-compressor cli (for gzip and br)
    • SkyPack CDN via NPM (distribution)*
  • SSR Support
    • minimal HTML boilerplate (HTML slots plus wrapper)
    • JS not loaded on server and HTML is identical on server and browser

(*) Unpkg and AWS S3/Cloudfront (plus some tooling) are other alternative distribution method as well.

Requirements

  • a target application that supports HTML, JS, and CSS

Terminology

termdefinitionresources
Web ComponentA native 1st class browser HTML node built with a combination of Custom Elements, Shadow DOM, and HTML Template tagswebcomponents.org
Custom ElementA custom & native 1st Class browser HTML element complete with lifecycyle methods and a constructorUsing Custom ELements
Shadow DOMNative encapulation for HTML on a page similar to DOM Fragments or IFrames
Shadow RootThe reference container for a given Shadow DOM instanceUsing Shadow DOM
SlotTransclusion HTML Nodes for Shadow DOM that live in the 'Light' DOM but are slotted into the Shadow DOMSlot usage, Slots and Template Tags
Custom Properties (AKA CSS Variables)scoped CSS values that can pierce through Shadow DOMUsing Custom Properties
Custom EventsEvents that are developer created and typically pass data to the evt objectCreating and triggering Custom Events
1.6.2

5 years ago

1.6.1

5 years ago

1.6.0

5 years ago

1.5.0

5 years ago

1.4.1

5 years ago

1.4.0

5 years ago

1.3.0

5 years ago

1.1.1

5 years ago

1.1.0

5 years ago

1.0.0

5 years ago